web-dev-qa-db-ja.com

ページ区切り付きポストの目次の複製

非常に長い記事を掲載した技術ブログがあります。コンテンツを複数のページに分割するために(<! - 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]を追加します。頂上近くに置きます。完了しました。

1
RadianDynamics

投稿コンテンツを<!--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>';
}
1
nmr