WordPressで書く連載記事のナビメニューで現在の記事のリンクだけを消す条件分岐

＜WordPress＞で5回に分けて連載記事を書いたと仮定します。

この時、各記事に全ての連載記事へのリンクが付いたナビメニューを書いておくのが定番だと思います。
↓このような感じの。(下の例のリンク先は全てこのページです)

• 1. はじめに
• 2. 第一回
• 3. 第二回
• 4. 最終回
• 5. おわりに

このメニューを、

このように変更していきたいと思います。

初期状態のナビメニューのソースは以下とします。
リンク先などなど各自で書き換えて下さい。

<ul>
<li><a href="#">1. はじめに</a></li>
<li><a href="#">2. 第一回</a></li>
<li><a href="#">3. 第二回</a></li>
<li><a href="#">4. 最終回</a></li>
<li><a href="#">5. おわりに</a></li>
</ul>

WordPressの条件分岐タグを使用します。

条件分岐タグ – WordPress Codex 日本語版

条件分岐タグの「is_single() 」の中から「!is_single() 」というものを利用します。

上の2つの違いは「!」が付いているかどうかです。

「is_single() 」では、()の中に＜投稿ID＞を記入することで「特定の1つの記事」を判断することができます。
こうしておくと「この時はこう」「その時はそう」と条件分岐させて使うことができます。

「特定の記事」であるかどうかを判断し「特定の記事ならタグで囲んだ中身を表記しない」という条件にするために「!」のついた「!is_single() 」を使用します。実際に書くタグは以下のものです。

<?php if(!is_single(投稿ID)): ?> 第一回 <?php endif; ?>

このように書くことで、投稿IDが一致した時に＜第一回＞という文字を表記しないようになります。

これでリンク用のタグを全て囲んでしまえば良いというわけです。

<ul>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>1. はじめに<?php if(!is_single(投稿ID)): ?></a><?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>2. 第一回<?php if(!is_single(投稿ID)): ?></a><?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>3. 第二回<?php if(!is_single(投稿ID)): ?></a><?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>4. 最終回<?php if(!is_single(投稿ID)): ?></a><?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>5. おわりに<?php if(!is_single(投稿ID)): ?></a><?php endif; ?></li>
</ul>

見づらいですが、<a href=”#”> と </a> をそれぞれ<?php if(!is_single(投稿ID)): ?> ～ <?php endif; ?>で囲んでいます。

＜投稿ID＞の調べ方ですが、WordPress管理画面の「投稿一覧」などから調べたい記事の上にマウスを持って行くとブラウザの下などにアドレスがでます。

例えばGoogle Chromeでは画面の左下あたりにでます。
そのURLの中に投稿IDがあります。

「post=」の後にある数字がその記事の＜投稿ID＞です。上記の画像では「4078」です。

「4078」と指定する場合　<?php if(!is_single(4078)): ?>　と記入します。

今度は逆に「特定の投稿IDでだけ表記する」ようにしてみます。

この場合、「is_single() 」を使います。先程とほぼ同じですが中身はこのようになります。

<?php if(is_single(投稿ID)): ?> ← 今ここ<?php endif; ?>

これで＜投稿ID＞が一致した時だけ、中身の「← 今ここ」が表記されます。

<ul>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>1. はじめに<?php if(!is_single(投稿ID)): ?></a><?php endif; ?><?php if(is_single(投稿ID)): ?> ← 今ここ<?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>2. 第一回<?php if(!is_single(投稿ID)): ?></a><?php endif; ?><?php if(is_single(投稿ID)): ?> ← 今ここ<?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>3. 第二回<?php if(!is_single(投稿ID)): ?></a><?php endif; ?><?php if(is_single(投稿ID)): ?> ← 今ここ<?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>4. 最終回<?php if(!is_single(投稿ID)): ?></a><?php endif; ?><?php if(is_single(投稿ID)): ?> ← 今ここ<?php endif; ?></li>
<li><?php if(!is_single(投稿ID)): ?><a href="#"><?php endif; ?>5. おわりに<?php if(!is_single(投稿ID)): ?></a><?php endif; ?><?php if(is_single(投稿ID)): ?> ← 今ここ<?php endif; ?></li>
</ul>

大変見づらいですがこれまでを全て書くと上のようになります。
＜投稿ID＞、＜リンク先URL＞、＜記事名＞などを書き換えればそのまま使用できます。

今回の例では「5つの連載記事」があるという設定にしています。

単純に＜5ページ分の記事＞があるとして、5ページ全てに上記のナビメニュー用コードを書いてしまうと後々変更を加えたい時に＜1箇所修正するために5ページ分の該当箇所を全て書き直す＞ことになり大変面倒です。

また、今回はソース自体がごちゃごちゃしているのでスペルミスや修正忘れなど思わぬトラブルを招きかねません。

こうした煩わしさを避けるために、ナビメニューは「独立したPHPファイル」として1つだけ用意し、各記事はそこからソースを読み込むようにします。こうしておけば修正する際は＜元のナビメニュー用コード1つ変えるだけ＞で済みます。

これを実現するには＜WordPress＞の記事内に「PHPファイル」を読み込む必要があります。
以前書いた記事にその内容がありますので、以下のリンクよりご確認下さい。
「functions.php」に追記することで実装しています。

上記リンクより「functions.php」への追記が終わったと仮定して進めていきます。

■ ナビメニュー用に書いた <ul> から </ul> までのコードを全てコピーします。
■ テキストエディタを新規作成で開いて、コピーした内容を貼り付けます。

テキストエディタは文字コードを「UTF-8N」で指定できるものを使用しましょう。
私は＜Tera Pad＞を使っています。

拡張子phpで名前をつけて保存します。ファイル名は仮に「navi-menu.php」とします。

「FFFTP」などのFTPソフトを使ってサーバにアップロードします。
アップロードの方法は何でも構いません。場所は「functions.php」で指定したところへアップして下さい。

アップロードした際、「navi-menu.php」のパーミッションが「700」かどうか確認しましょう。
また、所有者がサーバの実行ユーザ(apacheやnginxなど)になっているかも確認します。

変更はFFFTPで行ってもい良いですし、コンソールを叩いて変更してもOKです。

例としてコンソールで＜所有権＞と＜パーミッション＞を確認します。
＜cd＞コマンドで「navi-menu.php」をアップロードしたディレクトリに移動し、

と

で、所有者とパーミッションを変更しておきます。
例では nginx ですが、サーバが apache の場合は所有者を apache にして下さい。

確認用のコマンドは以下のとおりです。

上記までの作業が終われば、あとは投稿記事内のナビを表示したいところへ「ショートコード」で

[myphp file="navi-menu"]

と書くだけで読み込んでくれます。

これで、ナビメニューを修正したい時は「navi-menu.php」の中身を編集するだけでOKになりました。

なお、どうしてこんなことになってしまうのかというと「WPtouch」はデバイスがスマホやタブレットだと判断した時に＜従来使用しているテーマ＞ではなく、＜Wptouchが用意している独自のテーマ＞でページを構成するプラグインです。このテーマには「funcsions.php」が読み込まれないために起こる現象です。

これを解消するためには「functions.php」に記入した内容をそのままプラグイン化してしまいます。
プラグイン化したら有効にする前に「functions.php」の記述は削除しておきましょう。

自分で書いた「VPSへの引っ越しシリーズ」の中で使用しています。
上記ソースのナビを使っていますのでデモ代わりに動作確認としてご確認ください。
↓↓↓↓↓

全8回分の記事の上下に配置しているので16個存在するナビメニューを1つのソースで管理しています。
ナビメニューはCSSで装飾しています。