Question

我试图制作一个弹出窗口，显示帖子标题和帖子缩略图。

我已将此弹出代码添加到类别页面模板中。

基本上，如果您点击帖子标题，弹出窗口将显示帖子缩略图和帖子标题，但每个弹出窗口显示相同的帖子详细信息。

我需要做出哪些更改，因此每个弹出窗口都会显示相应的帖子详细信息

例子。我有3个帖子，标题为Post A，Post B，Post C，但在灯箱中所有帖子标题都说“Post A”

任何建议都将不胜感激

这是使用.....................

的代码

<div id="maincontainer" style="width:700px; height:auto; display:block;"><!-- Begin  Main Container -->

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

<span id="magblock"> <!-- Begin Post Block -->

<div class="magazinethumbs">

<?php 
// check if the post has a Post Thumbnail assigned to it.
if ( has_post_thumbnail() ) {
the_post_thumbnail( 'magazine-thumb' );
}
?>
</div>

<!-- This opens the Lightbox -->
<a class="lbp-inline-link-1 cboxElement" href="#">

<h2 class="indextitle" style="font-size:12px;">
<?php the_title(); ?>
</h2>
</a>

</span> <!-- End Post Block-->


<div style="display: none;"> <!-- Lightbox Popup -->
<div id="lbp-inline-href-1" style="padding:10px; background: #fff;">

<!-- Here is the bug, the lightbox is loading the same post details -->

<div class="magazinethumbs">

<?php 
// check if the post has a Post Thumbnail assigned to it.
if ( has_post_thumbnail() ) {
the_post_thumbnail( 'magazine-thumb' );
}
?>
</div>

<h2 class="indextitle" style="font-size:12px;">
<?php the_title(); ?>
</h2>

</div>
</div> <!-- End Lightbox Popup -->

<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
<?php wp_reset_query();?>

</div><!-- End Main container -->

我正在使用“Lightbox Plus For Wordpress”插件 http://www.endocreative.com/how-to-insert-content-in-a-popup-using-lightbox-plus-for-wordpress/

我尝试了修改后的代码，但没有用...只需在灯箱内加载整个类别页面......

这是修改后的代码

<a class="lbp-inline-link-<?php the_ID(); ?> cboxElement" href="#"> 
<h2 class="indextitle" style="font-size:12px;">
<?php the_title(); ?>
</h2>
</a>


<div style="display: none;"> <!-- begin popup -->
<div id="lbp-inline-href-<?php the_ID(); ?>" style="padding:10px; background: #fff;">

<h2 class="indextitle" style="font-size:12px;">
<?php the_title(); ?>
</h2>

</div>
</div> <!-- End popup -->

由于

Answer 1

当你回答我的评论时，我可能正在睡觉。

您必须执行该教程的第2步，它将为您提供内联灯箱个人设置。

它会给你一个连续的课程

lbp-inline-link-1 lbp-inline-href-1，

lbp-inline-link-2 lbp-inline-href-2等等......

前

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

插入：

<?php 
$i = 1;
if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

取代：

<a class="lbp-inline-link-1 cboxElement" href="#">

把

<a class="lbp-inline-link-<?php echo $i;?>" href="#">

为：

做同样的事情

<div id="lbp-inline-href-1" style="padding:10px; background: #fff;">

把

<div id="lbp-inline-href-<?php echo $i; ?>" style="padding:10px; background: #fff;">

并在结束之前提出

<?php 
$i++;
endwhile; else: ?>

OBS：你必须设置数字os帖子显示相同数量的“内联灯箱数量”

例如：如果帖子列表将显示，每页10个帖子，在步骤2“内联灯箱数量::”您必须设置为10.

在Popup中添加Wordpress帖子标题

1 个答案: