php - wordpress pjax

问题描述

问 题

wordpress 如何实现全站pjax最好是插件，如果修改主题代码，麻烦说一下思路

解决方案

这个问题解决起来并不难，翻翻 pjax 的 github 就略知一二。恰好之前制作 typecho 模板，使用过 pjax 来实现全站无刷新，便来一答。

首先，编辑 WordPress 当前主题的 footer.php ，在 </body> 标签结束之前，引入 jquery.pjax.js。

<script src="http://www.typecho.biz/usr/themes/helloty-66a/js/jquery.pjax.js"></script>

在主题后台选项的 JavaScript 执行区域加入下面这段代码以使用 pjax。当然你也可以单独写成一个 js 文件在 jquery.pjax.js 后引入。

$(function(){
    $(document).pjax("a", '#main', {fragment:'#main', timeout:6000});
    $(document).on('pjax:send', function() {
      $('#loading').show();
    })
    $(document).on('pjax:complete', function() {
        $('#loading').hide();
    })
})

其中第二行的 a 表示全部超链接，#main 表示要修改内容的容器，这里需要结合实际情况做出改变，比如常见一些主题使用的是 .container；如果你要修改为 body 我也不介意，只不过那样似乎是为了无刷新而去无刷新了。

最后还是建议放弃通过 WordPress 插件造就一切的思想，虽然它方便了不少非专业人士添加新功能，但是各个主题多变，甚至有一些主题压根没有按照规范使用 wp_head() wp_footer() 函数以方便二开引入js，结合情况从实际出发才最重要。

这篇关于php - wordpress pjax的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！