【PHPでWPカスタマイズ】プラグイン不使用で、テーマに関連記事表示機能を実装しPV・滞在時間を上げる

こんにちは、管理人@SS_mshpです。

今回は、サイトをしっかり見てもらうために、『WordPressサイトに、関連記事表示機能を実装』をやってみます。

適切な関連記事でPVや滞在時間を稼げると、自社サービスを売る他にも、アドセンス広告収益などの面でもメリットが出てきます。プラグインではなくPHPなので少し難しくなりますが、さっそくやってみましょう。

なぜ関連記事があるとよいか？プラグインを使わないメリットは？

読者が興味をもつジャンル関連記事も表示して、PV・滞在時間を増やす

当サイトの場合です。例えば『カテゴリーが音楽理論』という記事を見たときに、読み終わったあと下の部分に『同じカテゴリの音楽理論記事』が、関連記事で出るようになっています。音楽制作に興味があるユーザーの場合、そのほかの同カテゴリ音楽理論記事を見てくれる確率が高くなります。見てもらうとＰＶや滞在時間が増え、サイトの印象をしっかり残すこともできます。

なお、テーマによっては既に実装されていたり、されていなかったりするので、ない場合は『プラグイン』『PHPで作る』などで対応することになります。

プラグインを使用しないことにより、最低限のシンプルなプログラムで動作を軽く

WordPressのプラグインでよくある問題は『いっぱい入れると重くなる』です。表示を速くしたりサーバー負荷を減らすためには、プラグインなしでできることは、なるべくプラグインなしで行うのがベターです。

特に必要な機能だけにしぼってプログラムを作れば、シンプル＆軽くできます（余計な処理はさせないなど）。

PHPで関連記事取得、ループを交えて複数表示を

WP関連記事プログラムで使ったコード

githubのgistに書いてみましたが、こんな感じのコードになりました。記事の下に同じカテゴリー関連記事を出したいから、個別投稿 (single.php)内にこれを入れてみました。テーマによっては、適切な位置を見つけるのが難しいかもしれません。

WP関連記事プログラムのポイント

• get the categoryはカテゴリを配列で返す
• foreachは配列要素を取得する
• if文で記事が入っている場合に、whileでループ処理がスタート（複数の記事を出せる）
• WP Queryは投稿やページのリクエストを扱う、定義済みクラス
• dl・dt・ddは定義リストのタグ（レイアウトを変えたい場合はCSSのクラスを指定）
• if(wp_is_mobile())は、モバイルのときサムネを出したい
• the_post_thumbnail( array( 200, 125 ) );で、サムネサイズ指定した
• タイトルをリンクにするのにthe_permalink();と、the_title();を使用

プログラムのポイントをまとめると、こんな感じでした。PHPの組み込み関数・よく使う文・WP定義済み関数などがいろいろ入ってきますが、一個一個働きを見ていくと大丈夫かと思います（管理人は文系ですが大丈夫でした）。
また、WP Queryは、記事取得とかループでよく使われるようなので、Codex内のサンプルプログラムも見ておくとよいでしょう。

■関数リファレンス/WP Query
http://wpdocs.osdn.jp/関数リファレンス/WP_Query

実際の表示例(スマホPVがやけに多いから、スマホだけサムネが出る)

先日作った、映画やドラマ・コミック情報のサイトにつけてみました。テーマはMaxwellを使っていたのですが、最初、関連記事が出てこなかったのでPHPで作ったわけです。

ＰＣはあまりアクセスがないからサムネ出しませんでした（笑）
記事を読み終わったあとに、同じカテゴリ内の記事がこのように出てきます。サムネを出す場合は、まずどういうレイアウトにするかを検討して、それにあわせたCSSを組んでください。

アクセスが多いスマホの場合は、条件分岐でサムネが出るようにしたのでこんな風になります。中央寄せをしたい場合はCSSを調整すればokです（ここまでやったら、あとはCSS調整とかになります）。

あとがき・まとめ

少しややこしい感じでしたが、無事に関連記事機能を実装することができました。これによってPV・滞在時間拡大ができるようになってきました（もちろんアドセンス収益も少しずつ上がっています笑）

関連記事機能がないテーマをお使いの場合は、ライバルに遅れを取らないよう、導入を検討してみてください。