简体   繁体   English

Wordpress:如何向帖子添加滑块

[英]Wordpress: how to add sliders to posts

I have tried the following code in single.php file in wordpress. 我已经在wordpress的single.php文件中尝试了以下代码。 I used these chunk of code displaying related posts of current post. 我使用了这些代码块来显示当前帖子的相关帖子。

 <ul class="step-nav clearfix">
<li class="prev button">
    <?php echo previous_post_link('%link', 'Previous'); ?>
</li>
<li class="next button">
    <?php echo next_post_link('%link', 'Next'); ?>
</li>
</ul>

It shows next and previous link. 它显示了下一个和上一个链接。 Now the problem is that I am not getting any idea of how to write jquery code which will slide all next or previous post wihout changing the url of browser. 现在的问题是,我对如何编写jQuery代码一无所知,该代码将滑动所有下一个或上一个帖子,而不会更改浏览器的URL。 Please help. 请帮忙。

You can use ajax loading to laod the content if you do not want the url to be changed and the new posts slideIn.. 如果您不希望更改URL并且新帖子slideIn,则可以使用ajax加载对内容进行修饰。

Here is a sample code for ajax navigation I am using, you can modify it accordingly. 这是我正在使用的Ajax导航的示例代码,您可以相应地对其进行修改。

// Ajaxed navigation On Page
jQuery(document).ready(function(){
    jQuery('#latestvideo-wrapper').append('<div class="video-loader"></div>');
    jQuery('.videosarticle a').live('click', function(e)  {
    jQuery('#latestvideo-wrapper .video-loader').fadeIn(500);
    e.preventDefault();
    var link = jQuery(this).attr('href');
    jQuery('#latestvideo-wrapper #latestvideobox').fadeOut(100).load(link + ' #latestvideobox', function() {
    jQuery('#latestvideo-wrapper .video-loader').fadeOut(400);
    jQuery('#latestvideo-wrapper #latestvideobox').fadeIn(500);
     });
    });
});

According to this code the previous content is fading Out and the new content is fading In. 根据此代码,以前的内容正在淡出,而新的内容正在淡入。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM