« »

投稿を複数ページにわたって書く

WordPressカスタマイズ


 ページを分割する時、『前へ 1 2 3 次へ』のように、ページ分割するのは、
 <?php wp_link_pages();?> では、少し難しいです。

どうしても、『前へ 1 2 3 次へ』のように、分割したい場合は、プラグインの
「Number My Post Pages」 を利用するとよいでしょう。

<!–nextpage–>で投稿した記事を『前へ 1 2 3 次へ』と表示する

  まずは、「Number My Post Pages」のプラグインをインストールして「有効化」しましょう。
そして、管理画面の「設定」「Number Post Pages」で設定していきます。

設定画面です。このように選択してください。 次のように設定してください。

Number My Post Pages」のプラグインを使って分割する場合は、 
<?php wp_link_pages();?> ではなく専用のモノを挿入する必要があります。

※記述部分をダブルクリックすると記述が全て選択されます。右クリックで保存して貼り付けてください。

<?php mysinglepages(wp_link_pages('before=&after=&echo=0')); ?>

 この記述を<?php wp_link_pages();?> が入っていた場所にいれてください。

後はCSSの設定だけです。 次の記述をコピペしましょう。

※記述部分をダブルクリックすると記述が全て選択されます。右クリックで保存して貼り付けてください。

/* 分割した記事へのリンク */
#wp_page_numbers ,#wp_page_numbers ul, #wp_page_numbers li, #wp_page_numbers a {
  font-size: 100%}
#wp_page_numbers {  clear:both;
  margin:0;
  background:#FFF;
  width: 100%;
  display:inline;
  text-align:center;
  background: transparent;
  padding:0}
#wp_page_numbers ul {  width: 100%;
  margin:0;
  margin-bottom: 10px;
  padding:0}
#wp_page_numbers li {  display:inline;
  margin: 2px;
  padding:0px}
#wp_page_numbers a {  padding: 3px;
  padding-left: 5px;
  padding-right: 5px;
  margin-left: 2px;
  margin-right: 2px;
  margin-bottom: 5px;
  color: #333;
  display:inline;
  text-align:center;
  border: 1px solid #d6dfe0;
  background-color:#FFF}
#wp_page_numbers li a:hover {  border-color: #00468b;
  text-decoration: underline;
  background: #f7e29e}
#wp_page_numbers li.active_page a {  border-color: #047ff8}
#wp_page_numbers li.active_page a:hover  {  color: black; /* IE fix */
  text-decoration: underline;
  border-color: #00468b}
#wp_page_numbers li.page_info {  display:inline;
  padding: 3px;
  padding-left: 5px;
  padding-right: 5px;
  margin-right: 2px;
  color: #666;
  font-size: 11px;
  border: 1px solid #bfbfbf}

以上で設定は完了です。

 使い方は同じで、<!–nextpage–>を追加するだけです。

※記述部分をダブルクリックすると記述が全て選択されます。右クリックで保存して貼り付けてください。

<!--nextpage-->

(HTMLエディタモードで記入する必要があります。)  

このようにナビゲーションが表示されます。 ページナビが表示され、分割されます。

 

« »

この記事へのコメント

  • Pingback: ページ分割するべきか否か? | 比較評判の口コミを実践レビュー『チェレンジ!』()

  • Pingback: 導入予定プラグイン | 翻訳家になろう()

  • Pingback: 1つの投稿を複数に分ける | wordpressいろいろ()

  • Pingback: ページ分割するべきか否か? | PC、SEO、WPのちょい便利PC、SEO、WPのちょい便利()

  • cherry

    色々な記事をいつも参考にさせてもらっています。質問なのですが、Number My Post Pagesで何ページか作った場合、最終ページのみコメント欄を表示させたい場合は、かなりコードを書かないと難しいのでしょうか?初心者のため、あまりよくわからないのですが、とりあえず質問させていたきました。

    • Number My Post Pagesなどの、<!–nextpage–> を利用してページを分割する場合、最終ページのみコメント欄を表示することは、ムズかしいと思います。

      コメント欄を表示するための<?php comments_template();?>は、
      記事部分から独立して独自にテンプレートに組み込まれていますので、記事の最終ページと判断して、表示と非表示を切り替えるのは、

      WordPressやphpなどの専門知識があり、自身がテンプレートを作れるぐらいの技術力がないと作れないと思います。

      すべてのページにコメント表示されるのがイヤなら、雑談掲示板みたいなコメント専用のページを作るのが良いかもしれません。

      このサイトの、http://bit.ly/JpMlbQ の「コメント機能をつける」のページの「おまけ Disqusのコメント機能で掲示板を作る」というところで、掲示板専用ページをコメント機能を使って作る方法を説明しています。

      私が思いつく対処法はコレくらいでしょうか。参考になれば幸いです。

      • cherry

        やはり、そうですか。私も掲示板みたいなページを作ろうか、どうしようかと考えていた所でした。どうもありがとうございます。

  • Pingback: 【WordPress】 nextpageでページ分割 | WordPress | 正貢堂 パティスリーショウコウドウ()

  • Pingback: プラグイン セレクト | ニワトリの備忘録()

【コメントの投稿の仕方について】

   このサイトでは、「Disqus」と呼ばれるコメント機能を使っています。
  ツイッターやフェイスブックなどにアカウントをお持ちの方は、ログインすることで
  自分の各プロフィールでコメントすることが出来ます。
  なんのアカウントもない人もメールアドレスさえ入力すればコメントできます。
  (入力したメアドはコメント投稿には表示されません。)
  また、コメント欄には画像を張ることも出来ます。


ひと言コメントや、記事の質問や感想など お気軽にお書きください。
  なにか書いていただけると管理人が嬉しがります。