WordPress 主題製作學習筆記：幫你的主題加上「自...
WordPress, WordPress Themes, WordPress主題製作入門 2010.05.22 覺非 人氣: 506 次瀏覽

今天的主題製作學習筆記要探討的是評論功能，如無意外，下一篇文章也是探討關於主題評論的部份。

長期使用 的使用者們都知道，自從 2.7 之後的版本都已經支援自帶評論分頁的功能了，但是，我們要如何將這樣的功能實現在主題裏呢？在 官方網站的代碼頁面，我們可以看到相當簡單的代碼，請你將原本 comments.php 裡面的這段代碼：

 

<div class="comments-navi">
<div class="alignleft"><?php previous_comments_link('') ?></div>
<div class="alignright"><?php next_comments_link('') ?></div>
</div>

 

修改為以下代碼：

 

<div>
<?php paginate_comments_links('prev_text=上一頁&next_text=下一頁');?>
</div>

 

如此即可實現自帶評論分頁的功能了，這樣是不是就能解決你的留言頁面落落長的困擾呢？並且又能少裝一個插件、減少資料庫的負擔囉！

如果想要美化你的評論分頁樣式，請開啟 style.css 樣式檔案，將以下樣式代碼加入，記得要將樣式顏色和框線改為符合你主題的樣式喔！

 

/* 評論分頁 */
.comments-navi  {
float:left;
font-size:12px;
line-height:22px;
width:100%;
margin-bottom: 10px;
text-align: center;
}
.comments-navi a {
text-decoration:none;
margin: 2px 6px 2px 0;
background:#fff;
border:1px solid #e5e5e5;
border-radius: 3px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
color:#2F8CAB;
padding:2px 5px 2px 5px;
text-decoration:none;
float:center;
}
 
.comments-navi a:hover {
background: #8391A7;
border:1px solid #fff;
color:#fff;
}
 
.comments-navi span.current {
background: #21BEDE;
border:1px solid #e5e5e5;
border-radius: 3px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
color:#fff;
font-family: inherit;
font-style: inherit;
font-weight: inherit;
font-size:12px;
padding:2px 5px 2px 5px;
}

 

接下來繼續跟大家分享「Ctrl+Enter快速留言發送」的功能，請按底下分頁 2 翻頁繼續閱讀。

【歷史上的今天】

相關文章外掛 for WordPress, Blogger...
, , , ,
本文目前有 6 則回應
  1. 2010 年 05 月 31 日 23:36:16
    pazz7ven

    要是没有这个函数 改怎么办呢 就说怎么评论不分页来着

  2. 2010 年 05 月 25 日 13:30:35
    A.shun

    现在用过的是willin Kan的Ajax评论代码，很威武
    自带了这个功能，不用折腾了

    • 2010 年 05 月 25 日 17:00:51
      Carrie

      willin Kan 最新一版的 Ajax 評論代碼應該是沒有包含這個功能的，還是要額外加入，因為我之前有問過他，我也是使用他的 Ajax 評論代碼呢！

  3. 2010 年 05 月 25 日 13:29:27
    A.shun

    Ctrl+Enter 应该是必备功能