無痛使用 WordPress – nextpage標籤篇

關於單篇文章過長,想要將文章分成好幾頁來展示,例如max在WordPress 外掛程式 Lightbox2這一篇文章裡,將文章分成兩頁來描述(圖一紅色箭頭所指),這時候可以使用的標籤是<!--nextpage-->

nextpage
(圖一)


在編輯發表文章的時候,在你想要分頁的地方插入<!--nextpage-->即可,十分容易,有興趣的可以試試。

(註)上文提的的這個分頁標籤<!--nextpage-->,可能在有些佈景主題上沒有反應,這個時候如果還是想要使用這個標籤的話,可以檢查佈景主題裡的index.php跟page.php這兩個檔案,看看是否有<?php wp_link_pages(); ?>這一句語法,如果沒有的話,將它補上,這樣<!--nextpage-->這個分頁標籤才能正常運作。通常分頁的顯示以max的網站來說它是出現在文章的下方,所以<?php wp_link_pages(); ?>就要加在含有 <?php the_content(); ?> 這個語法的整段下方。

例如:
<?php the_content(); ?>
<?php wp_link_pages(); ?>

About The Author

max

使用 WordPress 架設網站不再是一件痛苦的工作。這裡跟大家分享使用WordPress的相關問題與研究。 並且提供有關WordPress外掛程式,佈景主題等等的使用經驗分享。 幫助想要建立網站的朋友,可以簡單,快速,無痛苦的建立與使用網站。

36 Comments

  1. ANDY

    感謝max兄的教學,真是好用的標籤。

  2. skyfate

      有一點須注意的是,如果佈景主題不支援的話,效果無法正常顯示。

    謝謝skyfate提醒,文章我會補上說明。
    max

  3. qkenting

    你好:
    請問我在page.php中有找到
    Pages: ‘, ‘after’ => ”, ‘next_or_number’ => ‘number’)); ?>

    是否就代表說有分頁標籤了,
    但是在撰寫文章時,卻無看到分頁標籤!

    使用環境為WordPress 2.5-RC2佈景主題為【WordPress Default】
    謝謝!

  4. max

    qkenting 你好,你找到的那段語法是代表可以使用next page這個標籤,所以當你在編寫文章時,還是需要在文章要分頁的地方輸入<!--nextpage-->這個標籤語法。
    另外,這篇文章提到的”標籤”,不是編寫文章時,在文章編輯區塊上方的工具列標籤,請查閱。

  5. 流星

    在page.php中,找到了<?php the_content(“__(‘Read the rest of this page »’)”); ?>這句,於是在它下方添加了代碼。

    然後回到日誌編輯,切換到源代碼,在需要分頁的地方,手工輸入,結果回到正常觀看狀況,本來想被分到第二頁的文字消失了。

    或者說,是必須在index.php和page.php中,都要保證有<?php the_content(“__(‘Read the rest of this page »’)”); ?>這句?
    可我使用的主題Illacrimo 1.1 by Design Disease,裡面只有page.php有這句,而index下面的那句,則是用來顯示“閱讀全文”的。

    不知道這個問題如何解決。

  6. max

    流星
    你好,如果你要在單篇文章使用下一頁這一個分頁標籤,以你使用的佈景主題來說,是要修改single.php這個檔案,在<?php the_content("<p>Read the rest of this entry &raquo;</p>"); ?>之後加上<?php wp_link_pages(); ?>

  7. 流星

    o(∩_∩)o…問題搞定,感謝你的解決方案哈。
    我加了你的友鏈,估計以後會有不少時間跑過來找你問問題

  8. 小白

    想請問一下max兄:
    1.看了您的教學後,我現在單篇文章已經可以換頁了
    但是在換到第二頁後,顯示的卻是整篇文章
    無法再有分頁功能回到上一頁@@
    請問我該怎麼做呢?

    2.怎麼做才可以把語法紀錄在文章中,而不會被使用呢?

  9. max

    小白
    你好,nextpage標籤是用在single.php上,請確定你的佈景主題有支援。
    另外文章要出現語法,你在編輯文章時,上方工具列有一code按鈕,就是程式碼編輯功能。

  10. 小白

    max兄:
    後來我昨天晚一點看分頁就正常了..哈
    多謝你的回答唷^^

  11. 小白

    max兄:
    我在程式碼編輯的功能寫文章,輸入如下
    下一頁:
    結果文章就有下一頁的功能,而且文章中只出現 下一頁:
    請問這個功能跟佈景主題有沒有關係@@

  12. max

    小白
    你好,如果換成<pre></pre>這樣子包住語法可以嗎?
    例如:<pre>下一頁: <!--nextpage--></pre>
    另外,如果你的文章經常需要帶入程式的語法,建議你使用外掛程式。
    到WordPress官網的外掛程式區輸入Syntax,你可以找到許多相關的外掛程式。

  13. 小白

    max兄:
    後來測試了一下
    不行 ==> <code><pre></pre></code>
    可以 ==> <code><pre lang="LANGUAGE" line="1">
    </pre></code>

    改成下面這樣不行
    <code><pre lang="LANGUAGE" line="1">
    <!--nextpage--></pre></code>

    —nextpage-->這個語法不知道是不是wordpress專屬使用的@@

  14. 小白

    忘記說了,我有下載Syntax才測試的,
    不過上面那些語法在max兄這都可以用出來…

  15. max

    小白
    你好,—nextpage-->這是WordPress的專屬語法沒錯,不過回到你的問題,如果想要在文章裡面顯示語法的原樣,當然還是建議你使用外掛程式會比較輕鬆。
    至於—nextpage-->這個比較特別的地方是--,你可以參閱skyfate的文章有提到如何正確顯示--,文章的網址:http://blog.beyes.tw/308。

  16. 小白

    多謝max兄:
    問題算是解決了,多謝你撥空且熱心的回答
    以後可能還會多多來麻煩你^^ 感謝囉

  17. max

    小白
    不用客氣,很歡迎你一同來討論使用WordPress的任何問題。

  18. Raei

    Max 您好,
    我將頁面寫入後,
    右側欄會整個移至文章下方,foot則跑到了右側欄位置,想請問是否哪做錯了?
    WP:2.8
    THEME:inove1.45
    修改部分:
    1.index.php自行加入了和
    2.page.php補上
    3.single.pgp同樣補上了
    4.文章頁面插入
    我試過如果拿掉,頁面則會正常顯示~
    煩請MAX診斷一下,謝謝!

  19. Raei

    啊!sorry!沒注意到語法= =”
    以下省略<>
    寫入nextpage後,
    1.index.php自行加入了php the_content()和php wp_link_pages()
    2.page.php補上php wp_link_pages()
    3.single.pgp同樣補上了php wp_link_pages()
    4.文章頁面插入nextpage,側欄就跑掉了>”<
    麻煩您了~

  20. max

    Raei
    你好,如果想要在這個佈景主題使用nextpage,請在index.php第30行<?php the_content(__(‘Read more…’, ‘inove’)); ?>下面加上<?php wp_link_pages(); ?>(31行)。page.php第17行<?php the_content(); ?>下面加入<?php wp_link_pages(); ?>(18行)。在single.php第25行<?php the_content(); ?>下面加入<?php wp_link_pages(); ?>(26行)。以上修改不會造成側邊欄走位,請留意是不是在添加語法時多了不該出現的字元或是空格。

  21. Raei

    先謝謝max回答~
    我按照您的步驟重新做了一次,
    前面行的用搜尋,後面需加入的利用上面範例先複製到記事本後再貼上,但還是一樣的情況..T_T

  22. max

    Raei
    你好,是不是方便把你的網誌網址給我,讓我連過去看看。
    如果不方便在這裡秀出網址,那麼請mail給我。

  23. Raei

    Blog才剛架上去空空如也:)
    歡迎文HELLO是沒有使用nextpage的,
    食記那篇在義大利麵下方插入了nextpage。
    感謝Max!!!

  24. max

    Raei
    你好,剛剛連過去你的網誌,使用firefox3,IE7,google chrome,Safari等瀏覽,都沒有發現側邊欄有跑掉的情況發生。
    (更正)首頁沒有跑掉,單篇文章版面有錯誤,還需要點時間查證一下。
    Raei 側邊欄錯誤跟nextpage好像沒有關係,問題出在微笑圖案,請將微笑圖案關閉試試。

  25. Raei

    圖案外掛關掉了~似乎還是一樣哩~
    真是不好意思讓MAX費神了(感動ing)

  26. max

    Raei
    你好,請你先這樣測試看看,將原先發表的文章先關閉,然後重新發表新的文章,內容請先手動輸入幾個文字,然後插入nextpage,看看是不是也會發生側邊欄跑掉的情況,我模擬了你的狀況測試了全新安裝使用與你相同的佈景主題,並沒有發生側邊欄跑掉的問題,所以推測不是佈景主題的關係,只好請你從文章方面來檢視看看。

  27. Raei

    Max:
    我重裝WP2.8,也依您的方法重新另PO新文章,的確就正常了~
    沒想到是文章的問題….冏..
    再請問一下,可以更改”頁次”的字體大小和顏色嗎?謝謝~
    (害你這麼好心的測試了一堆,不好意思啊!)

  28. max

    Raei
    你好,字體大小應該是跟著文章內容字體大小而定的。
    單獨修改它的大小應該是可行的,但是我還沒有實做過,不能給你確定的答案。

  29. SEVEN

    我是把WP做成影音站的,也經常用到nextpage標籤,網站上都提供影片可以分段或全集收看的,所以我都會使用nextpage來分頁,可是nextpage的顯示方式是「Pages: 1,2,3」的,這樣不適合我的網站,我想顯示為「分段或全集: Part 1, Part 2, Full」,我現在的做法是自己在每篇文章中用HTML寫,但更新好麻煩,而且如果數量多的話會很容易亂。

    所以想請教一下,有沒有方式或插件能做到我的要求呢?提供一個網址給你看看,我就是想弄到想他這樣的,他應該不會是用HTML自己寫的吧,這樣會很累耶!

    http://sugoideas.com/prince-princess-2-episode-01/9/

  30. max

    SEVEN
    你好,根據你提供的網址看來好像不是使用WordPress架設的,所以無從判斷它的方法。如果想要自訂下一頁的語法或是稱呼,你可以試試Multi-page Toolkit這個外掛程式:http://wordpress.org/extend/plugins/multi-page-toolkit/。

  31. SEVEN

    那個網站是用WP架設的,真的做得很棒,你可以看看他的原始檔,我有發現他應該也有用到你說的插件,可是我怎樣弄都弄不到他那樣的顯示樣式,我提供我的網址給你看看,第二行那個就是用插件顯示出來的。例如如果我想看Part 3的話,就必須按到Part 2,之後才會出現Part 3,他只固定有三格,只是內容會變動而已,這樣好不方便喔,有沒有辦法把所有頁都顯示出來呢?這樣就可以直接按自己想看那個。

    http://video.joeyyungforum.com/joey-yung-perfect-10-live-2009/

  32. max

    SEVEN
    你好,有沒有試過不要使用Multi-page Toolkit管理介面的設定,自行在佈景主題裡面加上顯示語法。

  33. SEVEN

    都有試過呀,可是都一樣耶,請問這類的插件還有沒有其他的呢?唉,如果找不到好的解決方法,我唯有向以前那樣逐一用HTML寫了。><

  34. peteryeh

    你好,我是 WordPress 官方的使用者(沒有升級),並非自己架設。

    目前遇到一個問題,就是〝more〞。可否讓點選「繼續閱讀」進入下一頁後,並不是從截斷後的部分開始,而是回到整個頁面。由於我沒有升級,所以無法修改程式碼,所以想問有什麼不需要修改程式碼的方法?

  35. max

    peteryeh
    你好,測試了幾個方式,都必須對程式做部分的修改,很遺憾沒能幫上你的忙。
    另外補充,如果你可以新增外掛程式的話,可以在新增外掛程式搜尋more,有一些外掛程式,也許可以符合你文章閱讀的需要。

  36. peteryeh

    感謝你的答覆,沒有關係~
    之前有自己架設過 wordpress,也修改過程式碼
    但因為我申請的空間都是國外的免空,所以常常出問題,我也就沒再架設過了

    總之感謝你!!

網站架設

WordPress 虛擬主機免費安裝設定