Wordperss佈景製作教學系列(七)：WordPress佈景分頁導覽製作

2012 年 06 月 29 日 by: 阿湯 in: Wordpress 教學, Wordpress 佈景 19 Comments



在上一次介紹完Single.php之後，其實整體的架構已經差不多，剩下的頁面在製作時就可以參照既有的檔案直接修改，所以在這之前我們需要開始將一些細節先做好，之後的頁面在製作時就會快很多，而首先我們要講到的就是WordPress佈景分頁的導覽製作，所謂分頁導覽是指在首頁如果設定每頁顯示5篇文章，而下方就會有導覽列讓我們切到下個5篇或上個5篇，另外還有在文章的部份，如果太冗長時我們也會將文章分段，這分段的連結也是分頁導覽，往下我們就來看怎麼製作吧。12123

如果你是突然看這篇的朋友，建議可以往前先回顧這系列的前文。

Wordperss佈景製作教學系列：

在頁面上加入分頁導覽：

這意思是像每頁顯示2篇文章，那下面可以換頁的導覽，首先在index.php裡加入以下語法，可以加在endif下面，這二行很明顯的一個是往前，一個是往後。

   1: <div class="nav-previous"><?php next_posts_link('&larr; 之前的文章'); ?></div>

   2: <div class="nav-next"><?php previous_posts_link('較新的文章 &rarr;'); ?></div>

然後加一下CSS語法，讓他分左右二邊。

   1: .nav-previous{

   2: float:left;

   3: }

   4: .nav-next{

   5: float:right;

   6: }

03

然後回到首頁來看，下方就有往舊文或新文的導覽連結囉，如果你是要顯示1.2.3.4的方式，可以利用外掛，WP內建並沒有這函式可以直接用，不過以後阿湯還是會寫到修改教學。

02

內頁分頁導覽：

當一篇文章很冗長時，你可能就會將文章切八段，讓人閱讀時更方便一些，而內頁要顯示這些分頁連結，則可以找到the_content，在下方加入以下語法：

   1: <div class="link_pages">

   2: <?php wp_link_pages('before=<p>頁次：&after=</p>&next_or_number=number&pagelink=%'); ?>

   3: </div>

04

然後再加一下CSS，讓他有間隔並置中。

   1: .link_pages{

   2: padding:20px 0;

   3: text-align:center;

   4: }

05

再到文章裡設定分頁符號，隔開文章。

06

回到文章內頁來看，就可以看到文章被切段而且有顯示頁數囉。

07

19 Comments

  2. BTJIM -  2015 年 01 月 25 日 - 17:48:45 (Your Comment is Under Moderation)

    讚^^ 我喜歡^^

    回覆
  3. 威客 -  2015 年 01 月 12 日 - 11:26:03 (Your Comment is Under Moderation)

    正在学习中，一起加油吧

    回覆
  4. steven -  2014 年 05 月 01 日 - 13:29:25 (Your Comment is Under Moderation)

    請教問題：
    我也是無法切段，插入繼續閱讀不懂意思???
    在主頁 新舊文章都能切換，但進入內頁卻沒顯示，不知道是那程序搞錯

    回覆
  5. 呂笨笨 -  2013 年 07 月 18 日 - 15:20:43 (Your Comment is Under Moderation)

    請教您一個問題
    我安裝好部落格後，有匯入另一個部落格的文章，但是新部落格的文章部分無法輸入文字，輸入文字的地方好像變成一張圖，無法使用，請問是沒安裝好嗎？還是設定上哪邊有問題？

    回覆
    • 阿湯 -  2013 年 09 月 30 日 - 13:17:55 (Your Comment is Under Moderation)

      換一個瀏覽器試試

      回覆
  6. ki1418 -  2013 年 06 月 27 日 - 11:56:36 (Your Comment is Under Moderation)

    看來我必須慢慢爬文才看得懂

    回覆
    • 阿湯 -  2014 年 04 月 18 日 - 23:50:35 (Your Comment is Under Moderation)

      加油

      回覆
  7. Kevin -  2013 年 03 月 20 日 - 12:04:41 (Your Comment is Under Moderation)

    阿湯站長：
    你好~我是個Wordpress新手，遇到了些問題想要請教您^^

    http://www.showfun.com.tw/
    這是我們公司的網站(進入公司之前就已經做好了)
    最近在修改首頁的一些資訊，但問題出現了!
    我用IE開起時上方的FB登入與下方的七個選項都向右偏移了，但是在GOOGLE Chrome開啟又是正確的，實在不知道是那裡出了問題!

    但在修改時完全未動到任何語法，只有使用FTP修改圖片內容與刪除多的選項。

    謝謝版主!

    回覆
    • 阿湯 -  2013 年 03 月 21 日 - 15:38:22 (Your Comment is Under Moderation)

      表示你們有一些CSS語法在IE上不相容吧

      回覆
  8. 小霍 -  2013 年 03 月 11 日 - 16:26:51 (Your Comment is Under Moderation)

    我有４個問題，還想請教您！

    我已經幫網站申請　google analytics　和　webmaster！
    也安裝了外掛　Google Analyticator　＆　Google XML Sitemaps！

    １
    我想問　Google Analyticator外掛我設定好了後，下面卻出現！
    You have not authenticated with Google - you cannot use dashboard widgets! Reset the plugin to authenticate..
    （　但是回到google analytics看　狀態：已安裝追蹤功能　）應該是正常的阿！

    ２
    然後　Google XML Sitemaps外掛，我也設定好了，我照著香腸炒魷魚的教學，應該不用在裡面調整什麼吧？？（我的意思是，其他設定是不是默認就可以？）
    外掛裡面顯示這樣：
    已經成功地通知 Google 您網站的更新。
    已經成功地通知 Bing 您網站的更新。

    ３
    這兩個設定好之後，我安裝了PuSHPress，又在＂更新服務ping service＂新增了提供的服務！
    如果安裝　PuSHPress　又新增　ping service，這樣會不會跟上面的google analytics　和　webmaster衝突？
    還是都有意義，可以同時存在？

    ４
    使用webmaster功能後，然後安裝了Google XML Sitemaps，還有必要主動去跟ｇｏｏｇｌｅ和ｂｉｎｇ提交網站嗎？

    非常謝謝您！！

    回覆
  9. 小霍 -  2013 年 02 月 21 日 - 21:49:54 (Your Comment is Under Moderation)

    站長你好
    我有一個問題想要請教您!
    國外的 Themes 有些沒有辦法在文章內顯示標籤，所以在原始碼裡面也找不到ＴＡＧ，但是在寫文章的時候，確實有填寫標籤，而且我也確定標籤是成功填寫的！
    因為我安裝ＳＥＯ外掛，有把＂將標籤當成關鍵字＂打勾，所以看原始碼，確實有出現輸入的標籤在keyword裡面，所以標籤是成功輸入的，但是卻不能顯示ＴＡＧ！

    有兩個問題
    1. 如果是這種問題，有沒有辦法改善，就是讓文章可以裡面顯示ＴＡＧ，有沒有辦法用外掛的方式達到？或是其他方法？
    2. 如果是確實有成功標籤，但是像我說的佈景主造成無法顯示ＴＡＧ，這樣會不會影響ＳＥＯ呢？

    謝謝版主！

    回覆
    • 阿湯 -  2013 年 02 月 24 日 - 00:17:07 (Your Comment is Under Moderation)

      1。改佈景
      2。SEO 部份不回答，謝謝

      回覆
  10. 研習 -  2013 年 01 月 09 日 - 01:19:29 (Your Comment is Under Moderation)

    感謝大大分享，
    學習中^^

    回覆
  11. 王煜傑 -  2012 年 10 月 15 日 - 12:32:47 (Your Comment is Under Moderation)

    阿湯站長：
    請問文章『切段』是否需至後台設定，因為我發了一篇文章(大約20行)，可是他還是全都顯示出來，沒有內文分頁的效果?

    不好意思在問一個問題，『Wordpress 入門基礎』我全都看完了，是否有比較推薦的書藉能夠在研究的。

    打擾了

    謝謝~~

    回覆
    • 阿湯 -  2012 年 10 月 17 日 - 10:03:25 (Your Comment is Under Moderation)

      切段要插入繼續閱讀

      回覆
      • 王煜傑 -  2012 年 10 月 18 日 - 23:32:29 (Your Comment is Under Moderation)

        謝謝您!!

        知道問題點出在哪了。

        感謝百忙中抽空回覆~~

        回覆
  12. 小Y -  2012 年 07 月 12 日 - 13:30:09 (Your Comment is Under Moderation)

    我剛加入blog行列2個多月了
    看原始碼看得霧煞煞
    還有好多要學習的地方

    回覆
    • 阿湯 -  2012 年 07 月 16 日 - 11:29:51 (Your Comment is Under Moderation)

      加油

      回覆

Leave A Comment

Your email address will not be published. Required fields are marked (required):

下載最新的Wordpress

下載最新的Wordpress

FaceBook粉絲團

Back to Top