在模态内的wordpress post中添加下一个和上一个按钮

deedee92

我使用引导框架创建了一个wordpress主题,当用户单击帖子时,弹出窗口并显示帖子的内容,而不是转到单个帖子页面。

我的问题是我需要添加一个下一个/上一个按钮,以便当用户单击它时,模式将关闭,而另一个将弹出下一个帖子的内容。

这是我的代码:

content.php

<a href="#myModal-<?php the_ID(); ?>" data-toggle="modal" class="clickme readmore text-right">Read more</a>

    <div id="myModal-<?php the_ID(); ?>" class="modal fade"><?php include 'popup-modal.php'; ?>     </div>

popup-modal.php

<div class="modal-dialog">
<div class="modal-content">

POST CONTENT HERE.......

<div class="nav-links">
<div class="nav-previous">
<a href="#" rel="prev" data-dismiss="modal" data-toggle="modal"></a>
</div>
<div class="nav-next">
<a href="#" rel="next" data-dismiss="modal" data-toggle="modal"></a>
</div>
</div>

</div>
</div>

现在,我不确定要在导航链接的href上放置什么内容,因此我可以调用下一个帖子并将其显示在模式中。我希望有人可以帮助我。

最高

这是我的解决方案:

<?php $next_post = get_adjacent_post(false,'',false);?>
<?php $previous_post = get_adjacent_post(false,'',true);?>   

然后,导航输出:

<div class="navigation row">
<div class="col-md-6">
    <?php if($next_post->ID != ''): ?>
        <a href="#myModal-<?php echo $next_post->ID; ?>" data-toggle="modal" >
            <button type="button" class="btn btn-default m-t-30">Previous</button>
        </a>
    <?php endif; ?>
</div>
<div class="col-md-6">
    <?php if($previous_post->ID != ''): ?>
        <a href="#myModal-<?php echo $previous_post->ID;  ?>" data-toggle="modal" >
            <button type="button" class="btn btn-default m-t-30">Next</button>
        </a>
    <?php endif; ?>
</div>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

WordPress链接分页仅显示下一个和上一个按钮

来自分类Dev

在React应用中从模态内部单击下一个和上一个按钮时,无法使动画(淡入)在模态上工作

来自分类Dev

在wordpress的下一个和上一个链接中显示自定义字段数据

来自分类Dev

WordPress中的下一个上一个具有标题的前一个/下一个链接?

来自分类Dev

AngularJS-转到上一个/下一个模态

来自分类Dev

如何添加下一个和上一个按钮弹出?

来自分类Dev

在 wordpress foreach 循环中,返回当前行 id 和下一个/上一个行 id

来自分类Dev

如何为该滑块添加下一个和上一个按钮,而不是data-link =“ n”(删除分页并仅添加下一个和上一个按钮)

来自分类Dev

如何添加下一个和上一个按钮--- Turn.js

来自分类Dev

如何添加下一个和上一个按钮--- Turn.js

来自分类Dev

语法错误,在WordPress的下一个/上一个发布链接中排除类别

来自分类Dev

光滑-上一个/下一个箭头停留在滑动式转盘内

来自分类Dev

“上一个”和“下一个”提交表单,在非常有限的范围内增加或减少值

来自分类Dev

特定Wordpress父类别中的下一个/最后一个URL

来自分类Dev

特定Wordpress父类别中的下一个/最后一个URL

来自分类Dev

如何在ruby中打破内循环和外循环的下一个?

来自分类Dev

打开键盘箭头按钮上的下一个模态,单击

来自分类Dev

如何向 ListView 添加上一个和下一个按钮

来自分类Dev

如何在video.js中添加上一个和下一个按钮

来自分类Dev

如何通过单击轮播项目内的按钮转到下一个轮播项目

来自分类Dev

分页-jQuery DataTables中的上一个和下一个大小按钮

来自分类Dev

FullCalendar中的“上一个”和“下一个”按钮产生“关闭”消息

来自分类Dev

更改datepicker插件中的下一个和上一个按钮的位置

来自分类Dev

图库中的下一个和上一个按钮

来自分类Dev

从下一个星期一开始在wordpress中安排活动

来自分类Dev

下一个上一篇文章在WordPress中

来自分类Dev

等待循环内按下一个键

来自分类Dev

在一个查询中,MySQL SELECT值在范围内,而下一个值在范围内

来自分类Dev

jQuery在下一个元素内选择一个嵌套元素

Related 相关文章

  1. 1

    WordPress链接分页仅显示下一个和上一个按钮

  2. 2

    在React应用中从模态内部单击下一个和上一个按钮时,无法使动画(淡入)在模态上工作

  3. 3

    在wordpress的下一个和上一个链接中显示自定义字段数据

  4. 4

    WordPress中的下一个上一个具有标题的前一个/下一个链接?

  5. 5

    AngularJS-转到上一个/下一个模态

  6. 6

    如何添加下一个和上一个按钮弹出?

  7. 7

    在 wordpress foreach 循环中,返回当前行 id 和下一个/上一个行 id

  8. 8

    如何为该滑块添加下一个和上一个按钮,而不是data-link =“ n”(删除分页并仅添加下一个和上一个按钮)

  9. 9

    如何添加下一个和上一个按钮--- Turn.js

  10. 10

    如何添加下一个和上一个按钮--- Turn.js

  11. 11

    语法错误,在WordPress的下一个/上一个发布链接中排除类别

  12. 12

    光滑-上一个/下一个箭头停留在滑动式转盘内

  13. 13

    “上一个”和“下一个”提交表单,在非常有限的范围内增加或减少值

  14. 14

    特定Wordpress父类别中的下一个/最后一个URL

  15. 15

    特定Wordpress父类别中的下一个/最后一个URL

  16. 16

    如何在ruby中打破内循环和外循环的下一个?

  17. 17

    打开键盘箭头按钮上的下一个模态,单击

  18. 18

    如何向 ListView 添加上一个和下一个按钮

  19. 19

    如何在video.js中添加上一个和下一个按钮

  20. 20

    如何通过单击轮播项目内的按钮转到下一个轮播项目

  21. 21

    分页-jQuery DataTables中的上一个和下一个大小按钮

  22. 22

    FullCalendar中的“上一个”和“下一个”按钮产生“关闭”消息

  23. 23

    更改datepicker插件中的下一个和上一个按钮的位置

  24. 24

    图库中的下一个和上一个按钮

  25. 25

    从下一个星期一开始在wordpress中安排活动

  26. 26

    下一个上一篇文章在WordPress中

  27. 27

    等待循环内按下一个键

  28. 28

    在一个查询中,MySQL SELECT值在范围内,而下一个值在范围内

  29. 29

    jQuery在下一个元素内选择一个嵌套元素

热门标签

归档