網站最後更新日期:2016年12月3日
歡迎大家來到暢想資源 AREFLY.COM!
讚好Facebook
追隨Twitter
加入QQ群
關注微博
關注微信公眾號
捐款
更多聯絡方式
X

【純代碼】為WordPress添加AJAX無刷新之評論分頁功能

WordPress預設自帶一個「評論分頁」功能,可以方便的防止過多評論導致頁面過長,但是當訪客在切換評論時,頁面需要不停地經過刷新、加載,降低訪客體驗,而今天「暢想資源」就來教大家如何為WordPress添加AJAX無刷新的評論分頁功能,提升網站的用戶體驗! :mrgreen:

預覽

可參考本站「留言本」頁面! :grin:

教學

提示:在開始進行以下步驟前,請先確定你的網站已經成功加載jQuery庫!

1、首先於主題的「迴響 (comments.php)」文件內的「評論主題DIV(例如 commentlist 等)」的DIV外添加 <div id="loading-comments"><span>評論載入中,請稍等...</span></div>

wordpress-ajax-comment-pages-1

2、然後將下列代碼新增為JS文件(例如「ajax-comment-pages.js」等)並儲存至WordPress主題目錄下,然後在網頁內使用 script 來引用該文件即可!

注意:請根據各行注釋將相關DIV的 idclass 進行適當修改後方可於網頁內正常使用!

3、現在在網頁內試試看點擊你的評論分頁,是不是已經可以實現無刷新加載了?如果還不行,請確定DIV是否已經設定正常,或者於下方留言說明問題,本站將會盡力幫你解決! :razz:

參考

WordPress Ajax 评论分页

WordPress分页评论Ajax载入

覺得這篇文章有用麼?分享一下讓更多人知道吧!

爲繼續支持本站繼續寫出優質文章、歡迎捐款!

注:本站同時長期承接WordPress外掛及主題制作、伺服器環境配置等,如需詳情,請「聯系我們」!

© 版權聲明:「暢想資源」之所有文章及資源系采用「創用 CC 姓名標示-非商業性-相同方式分享 3.0 香港 授權條款」發布及共享,轉載時須以相同方式發布並注明「原文鏈接」!

本文固定鏈接:http://www.arefly.com/wordpress-ajax-comment-pages/

本文章由「」於2014年10月13日發表於「WordPress」分類

你可以發表迴響,並在保留原文地址及作者的情況下引用到你的網站

轉載請注明:【純代碼】為WordPress添加AJAX無刷新之評論分頁功能 | 暢想資源

關鍵字:, , ,

以下是廣告時間,廣告內容僅供參考!

廣告載入中...

【純代碼】為WordPress添加AJAX無刷新之評論分頁功能:目前有 93 條留言

訪客以 53:40 大幅領先博主

迴響載入中,請稍等...
  1. 42樓
    yanyan China Google Chrome Windows

    真的可以吗?我试试

    [回覆]
  2. 41樓
    你好 China Google Chrome Windows

    测试下,看看

    [回覆]
  3. 40樓
    leejon China Google Chrome Windows

    测试ajax评论

    [回覆]
  4. 39樓
    晓庄 China Google Chrome Windows

    分页倒是出来了。但有一个问题,点击回复,会刷新页面,时好时坏。
    博主能帮忙看下嘛

    [回覆]
  5. 38樓
    晓庄 China Google Chrome Windows

    唉。没弄好。一直出不来。

    [回覆]
  6. 37樓
    拽立网 China Google Chrome Windows

    谢谢博主分享好东西,我学习研究一下!

    [回覆]
    • 感謝支持! :razz: :razz: :razz:

      [回覆]
      • 拽立网 China Google Chrome Windows

        弄不好,点击下一页消失,全部消失了!错在哪里? :shock:

        [回覆]
  7. 36樓
    chasonma China QQ浏览器 Windows

    路过,来看看! :mrgreen:

    [回覆]
  8. 35樓
    亡月帝 China Google Chrome Windows

    错过了几篇文章~~~~

    [回覆]
  9. 34樓
    我就有 China Google Chrome Windows

    谢谢分享,学习了,博主你的头像好给力啊 - -!

    [回覆]
  10. 33樓
    料网 China Mozilla Firefox Windows

    博主,我今天尝试了一下。为什么点击页脚加载之后,评论列表重复出现了两次。。不知道这里能不能写链接,详见这里:http://www.liaosam.com/my-2014.html 。点击底部评论的 页码1 之后 好像页面加载的时候评论整个先后刷了两次(我注意的是右侧滚动条位置,第一次好像正常,第二次刷了以后导致出现两次评论列表。。)。

    [回覆]
    • 你好~我之前也遇到过类似问题,个人感觉是因为JS中的DIV没有设置好,才导致这样重复显示~你看看JS中的元素都按自己的需要调整了么? :?: :?:

      [回覆]
      • 料网 China 搜狗浏览器 Windows

        谢谢博主的快速回复!仔细检查了一遍,元素div和对象名称都是对的,现在怀疑可能是我用的另一个ajax提交评论的JS影响的。希望能顺利解决!

        [回覆]
  11. 32樓
    协会主席 China Mozilla Firefox Windows

    翻页后头像加载不了了。。

    [回覆]
    • :?: :?: 奇怪...我這裏正常的啊?能不能F12看看是什麼錯誤呢? :sorry: :sorry:

      [回覆]
  12. 好像不兼容我主题

    [回覆]
  13. 30樓
    大肥羊 China Mozilla Firefox Windows

    开了图片lazyload,翻页后头像就加载不进来了。。。。

    [回覆]
    • :sorry: :sorry: 奇怪?我的網站麼?我這裏看起來沒問題啊... :shock: :shock:

      [回覆]
  14. 29樓
    大肥羊 China Mozilla Firefox Windows

    评论要翻页的文章不多,就不折腾了。

    [回覆]
  15. 28樓
    凯凯 China Google Chrome Windows

    帅哥,我使用了不行啊,点击下一页只显示在加载中,列表不显示 :(

    [回覆]
    • :sorry: :sorry: 很可能是因爲你的主題評論DIV不同,自己拿F12看看修改對應代碼就行了~ :mrgreen: :mrgreen:

      [回覆]
  16. 27樓
    从良未遂 China Google Chrome Windows

    我的是主题自带的哎

    [回覆]
  17. 26樓
    fendou China Mozilla Firefox Windows

    我想问下博主这个评论功能怎么弄呢 又有表情还可以插入链接

    [回覆]
廣告載入中...

發表迴響



微笑 調皮 偷笑 可愛 大笑 壞笑 詭計 贊 疑問 HI~ 愛 抱歉 對不起 頭暈 驚訝 帥 努力 勞累 瘋狂 難過 大哭 差 豬 邪惡 無言 憤怒 流汗 擦汗


快捷鍵:Ctrl+Enter