非常に長い記事を掲載した技術ブログがあります。コンテンツを複数のページに分割するために(<! - nextpage - >を介して)ページ付けを使用しています。
私は手動で私の記事の一つの各ページの上部に目次(TOC)を追加します(以下は一つの記事の例です。内容は投稿ごとに変わります):
<table class="noborder"><tr><td><ol>
<li class="highlight"><a href="http://www.website.com/tutorials/raspberry-pi-i2c-and-spi/1/">Introduction</a></li>
<li class="nohighlight"><a href="http://www.website.com/tutorials/raspberry-pi-i2c-and-spi/2/">I2C Fundamentals</a></li>
<li class="nohighlight"><a href="http://www.website.com/tutorials/raspberry-pi-i2c-and-spi/3/">I2C on the Raspberry Pi</a></li>
<li class="nohighlight"><a href="http://www.website.com/tutorials/raspberry-pi-i2c-and-spi/4/">Enabling I2C on Raspberry Pi</a></li>
<li class="nohighlight"><a href="http://www.website.com/tutorials/raspberry-pi-i2c-and-spi/5/">I2C Transactions Using Python</a></li>
<li class="nohighlight"><a href="http://www.website.com/tutorials/raspberry-pi-i2c-and-spi/6/">Raspberry Pi to AVR I2C Communication</a></li>
</ol></td></tr></table>
投稿の各ページについて、どのページが表示されているかをユーザーに示すために、上記のCSSリストクラスを(「ハイライト」または「nohighlight」に)変更します。上記のリンクの1つに移動することで、私が意味することをよりよく理解することができます。
だからここに事がある。ページの構造、目次のタイトルなどを変更するたびに、各ページのHTMLコードを複製して編集する必要があります。これは、20ページ以上の投稿がある場合には大変な痛みです。
これを自動化する方法はありますか?私は、記事の上部にあるすべてのTOC htmlフォーマットとページタイトルを定義するショートコード、そしてhtmlコードをロードするためのインデックスでTOCを呼び出すことができるだけでなく、クラス値を "指定されたインデックス値に基づいて、 "または" nohighlight "を強調表示します。
これは可能ですか?複数のショートコードにまたがってデータを「保存」できますか?あるいは、TOCデータをカスタムフィールドに保存してから、アクセス時に条件付きでそのデータを変更することはできますか。
少しの方向性をお願いします。ありがとう
EDIT
Nmr(下記参照)の助けを借りて、私は自分のサイトに適したカスタムフィールドを使った実用的なソリューションを投稿しています。あなた自身の目的のためにそれを適応させるためにあなたはcssとhtmlを修正する必要があるでしょう。
ステップ1)functions.phpに以下を追加してください。
function paginated_toc_function() {
global $numpages;
$post_link = get_permalink();
$page_number = get_query_var('page');
if ($page_number == 0) {
$page_number = 1;
}
$toc_list = get_post_custom_values($key = 'toc');
$toc = explode(PHP_EOL, $toc_list[0]);
array_unshift($toc, "");
$post_link .= substr($post_link, -1) == '/' ? '' : '/';
$html = '<table class="noborder"><tr><td><ol>';
for ($i = 1; $i <= count($toc) && $i <= $numpages; ++$i) {
$highlight = ($i == $page_number) ? 'highlight' : 'nohighlight';
$html .= '<li class="' .$highlight. '"><a href="' . $post_link . $i . '">' . htmlspecialchars($toc[$i]) . '</a></li>';
}
$html .= '</td></tr></table></ol>';
return $html;
}
add_shortcode('paginated_toc', 'paginated_toc_function');
ステップ2)投稿に新しいカスタムフィールドを作成します。それに 'toc'という名前を付けて、それぞれ新しい行にコンテンツヘッダのテーブルのリストを追加します。例えば:
Introduction
I2C Fundamentals
I2C on the Raspberry Pi
Enabling I2C on Raspberry Pi
I2C Transactions Using Python
Raspberry Pi to AVR I2C Communication
ステップ3)記事の各ページ番号付きページに[paginated_toc]
を追加します。頂上近くに置きます。完了しました。
投稿コンテンツを<!--nextpage-->
で複数のページに分割するので、現在のページ番号を取得するには$page_number = get_query_var( 'page' )
を使用し、現在の投稿のページ数を取得するにはグローバル変数$numpages
を使用できます。
目次を表示する:
global $numpages;
$post_link = get_permalink();
$page_number = get_query_var( 'page' );
$toc = [
1=>'Introduction',
'I2C Fundamentals',
'I2C on the Raspberry Pi',
'Enabling I2C on Raspberry Pi',
'I2C Transactions Using Python',
'Raspberry Pi to AVR I2C Communication'];
$post_link .= substr($post_link, -1) == '/' ? '' : '/';
$html = '';
for( $i = 1; $i <= count($toc) && $i <= $numpages; ++$i) {
$highlight = ($i == $page_number) ? 'highlight' : 'nohighlight';
$html .= '<li class="' .$highlight. '"><a href="' . $post_link . $i . '">' . $toc[$i] . '</a></li>';
}