関連記事の表示が編集できる WordPress Related Posts の導入

 

 

 

 

 

WordPress Related Posts のインストールと有効化。

 

Dismiss and go to setting へをクリック。

 

Emailを入力すると、アップデートの情報やニュースレターが送られて来るらしい。関連記事の表示タイトルと、表示個数を入力。10個表示することにした。

 

Advance settings を開き、表示レイアウトを決定する。関連記事のサムネイルを表示するにチェックを入れ、記事の抜粋文を 70文字 表示する事にした。

 

次に、記事に画像がない場合に表示するディファルトの画像を指定し、関連記事の表示から除外するカテゴリーにチェックを入れ、自動的に関連記事を表示するにチェックを入れ、保存して完了。

 

次のように、記事のすぐ下に表示されるようになった。

 

このプラグインの良さは、管理者ユーザーでログインしている状態で、記事にアクセスすれば、関連記事の編集ボタンが表示される点だ。

 

編集ボタンをクリックすると、表示する関連記事が直接指定でき、表示順序も変更できる。これで、関連記事の精度が悪いと感じた時、自分で修正することができる。

 

この機能があると最初から分かっていれば、下記のような苦労はせずに済んだのに・・・。

 

 

 

 

 

 

アイキャッチ画像を有効にする記述
add_theme_support('post-thumbnails');
は、既にあったので、
作成するサムネイルのサイズを指定する
add_image_size('thumb100',100,100,true);
のみ追加。

 

 

アイキャッチ画像が、サムネイルとして表示されることになるので、Regenerate Thumbnails というプラグインをインストールし、アップロード済みの全画像からサムネイルを再作成。

 

インストールすると、ツールバーに Regen Thumbnails が現れる。

 

すべてのサムネイルを再生成する。

 

719個画像があり、1時間30分近く掛かった。

 

 

related-article.php という名前（好きな名前でよい）で作成し、wordpress のディレクトリー wp-content.themes.twentysixteen 直下にアップロードする。この後は、ダッシュボードの『外観』→『テーマの編集』で編集可能となる。

 

 

style.cssの最後辺りに、 関連記事表示用のスタイルを記述。

 

 

single.php の関連記事を挿入したい場所に、related-article.php を呼び出すコードを追記。

 

記事に画像がない場合に表示するディファルトの画像を、ディレクトリー wp-content.themes.twentysixteen 直下にアップロードする。

 

個々の記事にアイキャッチ画像が設定されていなければ、設定する。