Question

我目前使用以下代码从一些名为product的自定义帖子中使用颜色框提取内容：

Wordpress内容：

<a href='#1612' class='inline'>Test</a>

脚本：

<script src="<?php echo get_template_directory_uri();?>/js/jquery.colorbox-min.js" type="text/javascript"></script>
<script>jQuery(document).ready(function(){
jQuery(".inline").colorbox({
    inline:true,
    width:"90%",
    maxWidth:800
}).mouseover(function(){ jQuery(this).click();})
jQuery('#cboxContent').mouseover(
    function(){ jQuery(this).click();
}); 

jQuery('#cboxContent').mouseleave(
    function(){ jQuery.colorbox.close();
});
});
</script>

页面底部模板：

<div style="display:none">
<?php $loop = new WP_Query( array( 'p' => '399', 'post_type' => 'product', 'posts_per_page' => 1 ) ); ?>
    <?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
        <div class="inline_content" id="<?php echo $post->ID ?>">
            <h2><?php the_title();?></h2>
            <div class="sixty">
                <?php the_post_thumbnail();?>
            </div>
            <div class="forty">
                <p>
                    <?php the_field('product_description');?>
                </p>
                <button onClick="window.open('<?php the_field('similar_product_link');?>');">See Similar</button>
                <button onClick="window.open('<?php the_field('product_link');?>');" class="dark">Buy</button>
                <?php endwhile; wp_reset_query(); ?>
            </div>
        </div>
</div>

这很好用，但是我必须一遍又一遍地添加最后一个块的新实例，预先填写产品的ID号。因此，对于添加到网站的新产品，他们不会提取内容。立即将href传送到灯箱的最佳方法是什么，所以它会输入正确的id号码，只唱一个块？

Answer 1

如果我理解你，那么你应该像这样修改你的最后一段代码：

<?php $loop = new WP_Query( array( 'post_type' => 'product', 'posts_per_page' => -1 ) ); ?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<div style="display:none">
    <div class="inline_content" id="<?php the_ID(); ?>">
        <h2><?php the_title();?></h2>
        <div class="sixty">
            <?php the_post_thumbnail();?>
        </div>
        <div class="forty">
            <p><?php the_field('product_description');?></p>
            <button onClick="window.open('<?php the_field('similar_product_link');?>');">See Similar</button>
            <button onClick="window.open('<?php the_field('product_link');?>');" class="dark">Buy</button>
        </div>
    </div>
</div>
<?php endwhile; wp_reset_query(); ?>

此代码将为每个产品实例输出一个隐藏块。如果你有很多产品会有些麻烦，所以我建议你学习： https://codex.wordpress.org/Class_Reference/WP_Query， https://codex.wordpress.org/Function_Reference/paginate_links 和 https://codex.wordpress.org/Pagination

P.S。在同一种循环中，您可以输出链接

<?php $loop = new WP_Query( array( 'post_type' => 'product', 'posts_per_page' => -1 ) ); ?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
    <a href='#<?php the_ID(); ?>' class='inline'>Test</a><br>
<?php endwhile; wp_reset_query(); ?>

带有动态内容的Wordpress和Colorbox

1 个答案: