エントリーアーカイブのページ分割

エントリーアーカイブのページ分割

Posted at November 15,2005 11:57 PM
Tag:[Customize, Entry, MovableType, MTPaginate, Plugin]
 1  |  2  |  3  |  4  | All Pages

MTPaginate プラグインを利用したページ分割はかなり普及していますが、このプラグインはひとつのエントリーをさらにページ分割することも可能です。

ということで、エントリーアーカイブ(個別エントリーアーカイブ)のページ分割をご紹介します。エントリーが長文になる場合の分割はもちろん、例えばアフィリエイトで Movable Type を利用している場合、カテゴリーアーカイブに複数の商品を紹介してエントリーアーカイブではひとつの商品を表示するというのが一般的と思われますが、エントリーアーカイブで複数の商品をすっきりと表示することも可能になります。

1ページ目を表示まず画像を使って完成イメージをご説明します。
左のサンプルはデフォルトテンプレートを使ったページ分割イメージです。上がタイトル、その下にカスタマイズで追加された分割ページのリンクがあり、その下が本文です。サンプルでは計3ページ(3段落)に分割されており、1ページ目の「段落1」という本文を表示している状態です。
2ページ目を表示「2」という2ページ目のリンクをクリックすると、分割された「段落2」という本文に切り替わります。
全ページ表示「All Pages」をクリックすると全ての段落が表示されます。この状態が通常の1エントリー表示と同じです。

このエントリーも実験台としてページ分割を施しています。ページリンクはエントリーの上下に設置しています。エントリー先頭がナビゲーションだらけになってるとかいうツッコミはおいといて、エントリーのページ分割を体感頂ければ幸いです。

次にカスタマイズ方法です。

1.プラグインファイルのダウンロード

MT Extensions より MTPaginate をダウンロード(ページ上の方にある「Download」をクリック)。ファイルは任意のフォルダ(デスクトップ等)に保存します。

2.プラグインファイルのアップロード

ダウンロードしたファイルを解凍し、その中の MTPaginate.pl を plugins ディレクトリにアップロードします。

注:この情報はバージョン1.28のものです。
ダウンロードしたファイルを解凍し、その中の MTPaginate ディレクトリを下記のディレクトリ構成になるように plugins ディレクトリに丸ごとアップロードします。

plugins/MTPaginate/lib/MTPaginate.pm
plugins/MTPaginate/MTPaginate.pl

3.(3.2以降の場合)アーカイブURL/アーカイブ・パスの設定

管理メニューの「設定」→「公開」にある「アーカイブの設定」のチェックボックスをチェックします。チェックするとその下に「アーカイブURL」「アーカイブ・パス」の項目が表示されるので、下記のように設定します。

  • アーカイブURL:サイトURL/archives/
  • アーカイブ・パス:サイト・パス/archives

サイトURLとサイト・パスは同じページに表示されている「サイトURL」「サイト・パス」の内容をそのままあてはめてください。例えばサイトURLが http://www.koikikukan.com/ であれば、アーカイブURLは

http://www.koikikukan.com/archives/

となります。
なおこれらはページ分割を行わない場合も設定することをお勧めします。

4.ファイル名の変更

3.1x まで:管理メニュー左の「ウェブログの設定」→「アーカイブの設定」の下にある「アーカイブ」欄の「アーカイブの種類」が「個別」の「アーカイブ・ファイルのテンプレート」のテキストボックス欄に下記を設定。
3.2x 以降:管理メニュー左の「設定」→「公開」で「アーカイブ・マッピング」欄の「アーカイブ種類」が「エントリー」の「出力フォーマット」のテキストボックス欄に下記を設定。

<$MTArchiveDate format="%Y/%m/%d/%H%M%S"$>.php

上記はMTタグを利用したものですが、3.2x 以降はフォーマットの簡略化が可能になっていますので下記の設定でもOKです。

%y/%m/%d/%h%n%s.php

設定フォーマットは「年/月/日/時分秒.php」というファイルを出力するようになっていますが、エントリーIDを利用した設定、

<$MTEntryID pad="1"$>.php

でも問題ありません(3.2 以降の簡略化フォーマットであれば "%e.php" )。フォーマットの詳細は公式サイトのユーザーズマニュアル・日付タグのフォーマットを参照ください(2005.11.15現在ではMTタグ用のフォーマットのみ記載されています)。

設定したら「変更を保存」をクリックしてください。

5.XML宣言の修正

ページを XHTML文書、例えば XHTML1.0 として適合させている場合、前項と同じ画面の「テンプレートの内容」の1行目に、

<?xml version="1.0" encoding="<$MTPublishCharset$>"?>

という XML 宣言が記述されているケースがあります(記述されていなければこの項目はスキップしてください)が、php ファイルに変更するとサーバではこの行をPHPスクリプトとして誤認識してしまい、PHPエラーとなります。エラーが発生するとページが正常に生成されないため、結果的に真っ白なページが表示される可能性があります。

このような場合、下記のようにPHPスクリプトとして動作するように修正します。

<?php echo('<?xml version="1.0" encoding="<$MTPublishCharset$>"?>') ?>

6.テンプレートの修正

エントリーアーカイブテンプレートにページ分割用タグを設定します。
エントリーを分割するには分割するためのキーワード(セパレータ)が必要ですが、ここでは

  • HTML要素
  • エントリー内の文字列
  • セパレータ

の3種類を使った分割方法について説明します。

6.1 HTML要素でページ分割する

エントリーアーカイブの MTEntryBody の前後に下記の青色部分を追加します。リストはデフォルトテンプレートの場合です。

<MTPaginate>
<h3 class="entry-header"><$MTEntryTitle$></h3>
<div class="entry-content">
   <MTPaginateIfMultiplePages>
   <div class="paginate">
   <MTPaginateIfPreviousPage_>
   <a href="<$MTPaginatePreviousPageLink$>" title="前のページへ">&#65308;</a>
   </MTPaginateIfPreviousPage_>
   <$MTPaginateNavigator format_all="All Pages" place_all="after"$>
   <MTPaginateIfNextPage_>
   <a href="<$MTPaginateNextPageLink$>" title="次のページへ">&#65310;</a>
   </MTPaginateIfNextPage_>
   </div>
   </MTPaginateIfMultiplePages>
   <MTPaginateContent max_words="1" section_start_tag="p">
   <div class="entry-body">
      <$MTEntryBody$>
   </div>
   <div id="more" class="entry-more">
      <$MTEntryMore$>
   </div>
   </MTPaginateContent>
</div>
</MTPaginate>

3.2-ja 公開テンプレートの場合は下記の通りです。HTMLは若干異なっていますがページ分割用タグの挿入位置は同じです。

<!-- エントリータイトル -->
<MTPaginate>
<h3 class="entry-header">●<$MTEntryTitle$></h3>
 
<!-- エントリー -->
<div class="entry-content">
   <MTPaginateIfMultiplePages>
   <div class="paginate">
   <MTPaginateIfPreviousPage_>
   <a href="<$MTPaginatePreviousPageLink$>" title="前のページへ">&#65308;</a>
   </MTPaginateIfPreviousPage_>
   <$MTPaginateNavigator format_all="All Pages" place_all="after"$>
   <MTPaginateIfNextPage_>
   <a href="<$MTPaginateNextPageLink$>" title="次のページへ">&#65310;</a>
   </MTPaginateIfNextPage_>
   </div>
   </MTPaginateIfMultiplePages>
   <MTPaginateContent max_words="1" section_start_tag="p">
   <div class="entry-body"><$MTEntryBody$></div>
 
   <!-- 追記 -->
   <MTEntryIfExtended>
   <div id="more" class="entry-more"><$MTEntryMore$></div>
   </MTEntryIfExtended>
   </MTPaginateContent>
</div><!-- /entry-content -->
</MTPaginate>

上記リストの15行目(公開テンプレートのリストは18行目)にある、

section_start_tag="p"

が分割対象のタグを指定する部分です。赤色の p は p 要素を示しており、つまりこの例では p 要素で分割する設定になっています。この部分にセパレータにしたい任意のHTML要素名を設定してください。

p 要素はエントリーの編集画面の下にある「改行設定(3.1x以前は「テキストフォーマット」)」で「改行を変換する」という指定になっていれば、空行が p 要素に変換されます。したがって手動で付与する必要はありませんが、上記リストの設定では空行がページ分割のセパレータとなりますので、分割ページに空行を含む場合は他のHTML要素を指定するか、6.2項または6.3項の設定をお勧めします。

また section_start_tag 属性でページ分割する場合、max_words 属性(または max_bytes 属性)の設定が必須のようです。また max_xxx の設定が section_start_tag より優先されるため、これらに大きな値を設定していると、section_start_tag で指定したHTML要素が含まれていても、そこでページ分割されない可能性があります。
本来は両者を使ってページ分割を制御するようですが、とりあえずここでは最小値("1")を設定して常にHTML要素でページ分割される設定にしています。

赤色で示している div 要素はページ分割機能とは直接関係ありませんが、ページリンク用のスタイルを指定する場合を考慮して設定しています。必要に応じて下記のようなCSSをスタイルシート(styles-site.css)に追加してください。6.2項、6.3項も同様です。

.paginate {
    text-align: center;
    font-size: 9px;
}

6.2 エントリー内の文字列でページ分割する

次にエントリー内の文字列でページ分割する方法です。ここでは section_start 属性を利用します。
6.1項の

<MTPaginateContent max_words="1" section_start_tag="p">

の部分を

<MTPaginateContent max_words="1" section_start="&lt;div class=&quot;section&quot;&gt;">

に置き換えて設定します。赤色部分がセパレータとなります。この例では

&lt;div class=&quot;section&quot;&gt;

がセパレータですが、これは

<div class="section">

と同じで、つまりエントリー内に挿入した、class 属性が "section" という div 要素をセパレータとしてページ分割が行われます。タグの「<」 と「>」およびクォート「"」は文字実体参照にします。他の設定は6.1と同様です。

6.3 page_break で分割する

3つめは、エントリーにページ分割専用のセパレータを挿入する方法です。プラグインはこの特定のセパレータ(文字列)をサーチしてページ分割します。
例えば「=====」という文字列をセパレータにする場合、ページ分割したい段落と段落の間に、

段落1
 
=====
 
段落2

という具合にセパレータを挿入します(ここではセパレータの上下に空行を挿入することとします)。
6.2項と同様6.1項のリストの、

<MTPaginateContent max_words="1" section_start_tag="p">

の部分を、

<MTPaginateContent page_break="&lt;p&gt;=====&lt;/p&gt;">

に置き換えて設定します。赤色部分がセパレータとなります。この例では

&lt;p&gt;=====&lt;/p&gt;

がセパレータですが、エントリー登録時、エントリーの編集画面で「改行を変換する」という設定になっている場合、セパレートには p 要素が付与されて、実際のHTMLページでは

<p>=====</p>

となりますので、page_break 属性にはセパレータ文字列の「=====」と、その前後に文字実体参照にした 「&lt;p&gt;」と「&lt;/p&gt;」で挟んだ形で設定します。

注意点は、エントリーアーカイブでセパレータが設定されたページを一括表示した時、セパレータは表示されませんが、他のアーカイブやメインページ等ではセパレータが表示されます(他のページでは同じカスタマイズを施していないので当然ですが)。これが6.2項との大きな違いです。

ということで、本項の場合は表示されても差し支えないセパレータを付与するようにしてください。なお6.2項と同様にHTML要素を指定すると、エントリーアーカイブの一括表示で指定HTML要素が除去されてしまいますのでご注意ください。

7.ページリンク表示位置の変更

サンプルリストではエントリー本文の先頭にページリンクを表示するようにしていますが、エントリー本文の下に付与する場合、6.1項のリストを例に挙げると下記のように設定します。
<MTPaginate>
<h3 class="entry-header"><$MTEntryTitle$></h3>
<div class="entry-content">
   <MTPaginateContent max_words="1" section_start_tag="p">
   <div class="entry-body">
      <$MTEntryBody$>
   </div>
   </MTPaginateContent>
   <div id="more" class="entry-more">
      <$MTEntryMore$>
   </div>
</div>
   <MTPaginateIfMultiplePages>
   <div class="paginate">
   <MTPaginateIfPreviousPage_>
   <a href="<$MTPaginatePreviousPageLink$>" title="前のページへ">&#65308;</a>
   </MTPaginateIfPreviousPage_>
   <$MTPaginateNavigator format_all="All Pages" place_all="after"$>
   <MTPaginateIfNextPage_>
   <a href="<$MTPaginateNextPageLink$>" title="次のページへ">&#65310;</a>
   </MTPaginateIfNextPage_>
   </div>
   </MTPaginateIfMultiplePages>
</MTPaginate>

6.1項のページリンクの設定を残しておけば上下両方に設定することも可能です。

8.追記を各ページに変更する

これまでの設定では追記もページ分割対象、つまり最後のページの最後に追記が表示されますが、追記の内容を各ページで表示したい場合、6.1項のリストを例に挙げると、

<MTPaginate>
<h3 class="entry-header"><$MTEntryTitle$></h3>
<div class="entry-content">
   <MTPaginateIfMultiplePages>
   <div class="paginate">
   <MTPaginateIfPreviousPage_>
   <a href="<$MTPaginatePreviousPageLink$>" title="前のページへ">&#65308;</a>
   </MTPaginateIfPreviousPage_>
   <$MTPaginateNavigator format_all="All Pages" place_all="after"$>
   <MTPaginateIfNextPage_>
   <a href="<$MTPaginateNextPageLink$>" title="次のページへ">&#65310;</a>
   </MTPaginateIfNextPage_>
   </div>
   </MTPaginateIfMultiplePages>
   <MTPaginateContent max_words="1" section_start_tag="p">
   <div class="entry-body">
      <$MTEntryBody$>
   </div>
   </MTPaginateContent>
   <div id="more" class="entry-more">
      <$MTEntryMore$>
   </div>
</div>
</MTPaginate>

という具合に、

</MTPaginateContent>

を追記用タグの前に設定することで可能になります。
追記を利用して各ページ共通の情報を表示するテクニックです。

2005.11.16 追記
6.1項に公開テンプレート用のリストを追加しました。また本文の記述誤りを修正しました。

2005.11.20 追記
3.2-ja 以降用にアーカイブURL/アーカイブ・パスの設定を追記しました。

2007.05.04 追記
プラグインのバージョンアップに伴い、アップロード方法を修正しました。

 1  |  2  |  3  |  4  | All Pages
関連記事
トラックバックURL


トラックバック

検索機能追加 from MediAhead.jp
文字化け対応に少し手こずりましたが、検索機能を追加しました。 次は検索結果を複数... [続きを読む]

Tracked on December 2, 2005 1:11 PM

MTPaginateを使う from Sunflower
MTPaginateには様々な属性を適用させることができます。 使えそうな部分と... [続きを読む]

Tracked on December 3, 2005 7:29 AM

MT4でページ分割をする方法 from Wordpress trial
結論としてはMT4でも使えるよ!と言うことなんですが。 MTでページ分割をする方法としては MT Extensions: MTPaginate 1.28 ... [続きを読む]

Tracked on October 10, 2007 9:43 PM

アーカイブページを分割するプラグイン Paged Archives from CSS Lecture
Paged ArchivesはPHP化せずにアーカイブページを分割する事が出でき... [続きを読む]

Tracked on May 31, 2008 6:39 PM

MTでページの分割を可能にするプラグイン『MTPaginate』 from caraldo.net | WebとiPhoneとロードバイクが大好き!
世には様々なBlogがありますが、こんな感じでページが分割されているのをよく見ませんか? カテゴリー分けされていたり、日付で分けられていたり 確かにそれも... [続きを読む]

Tracked on January 14, 2010 1:11 AM
コメント

はじめまして。いつもカスタマイズの参考に拝見させて頂いております。

ページ分割をして早速エントリーを投稿してみたのですが、
やりたかった事が画像2枚ごとに分割して絵本の様なエントリーにするというもので、
普通に2枚分の画像のソースを書いて分割するだけでは上手く行かず、必ずHTML以外の文字列が含まれていないと分割が上手く行かないという結論に達しました。

現在、↓のページで苦肉の策で画像の後に.(ピリオド)を入れる方法をとっています。
http://abeke.ciao.jp/manga/20060516010714.php

が、見栄えがあまり良くないのでもし画像のみでも分割が行える方法がありましたら
御教え願えないでしょうか?よろしく御願いします。

[1] Posted by アベ : May 18, 2006 9:31 PM

>アベさん
はじめまして。
ご利用ありがとうございます。
ご質問の件について確認したところ、たしかにHTMLタグの記述のみでは分割セクションとみなされないようです。
プラグインに少し手を加えて動作を確認してみます。うまくできそうであればエントリー致しますので少々お時間ください。
それではよろしくお願い致します。

[2] Posted by yujiro : May 19, 2006 2:05 PM
コメントする
greeting

*必須

*必須(非表示)


ご質問のコメントの回答については、内容あるいは多忙の場合、1週間以上かかる場合があります。また、すべてのご質問にはお答えできない可能性があります。予めご了承ください。

太字イタリックアンダーラインハイパーリンク引用
[サインインしない場合はここにCAPTCHAを表示します]

コメント投稿後にScript Errorや500エラーが表示された場合は、すぐに再送信せず、ブラウザの「戻る」ボタンで一旦エントリーのページに戻り(プレビュー画面で投稿した場合は、投稿内容をマウスコピーしてからエントリーのページに戻り)、ブラウザをリロードして投稿コメントが反映されていることを確認してください。

コメント欄に(X)HTMLタグやMTタグを記述される場合、「<」は「&lt;」、「>」は「&gt;」と入力してください。例えば「<$MTBlogURL$>」は「&lt;$MTBlogURL$&gt;」となります(全て半角文字)