WordPressでこんな記事も読まれています!を表示させる方法!

スポンサーリンク
sadgirl1 000-ブログ運営

googleアドセンス 審査落ち3回目中です。

1発で審査を通過する方もおられますが、何回審査を受けても通過できない方もおられる様です。

私は、果たして無事に審査に通ることができるのか・・・とても心配です。
すでに、心が折れて、この世界から去ってしまいたくなっております。

さて、審査が落ちる度に1つづつ何かを、改善しながら再申請するというのが定番になってきております。

今回は、改善策の1つである「WordPress」に「こんな記事も読まれています」を表示させる方法を初心者ブロガーにも分かりやすく、必要最低限の情報で記載します。

まず完成イメージは、下の図になります。


完成イメージ

実際に必要な作業は、次のとおりとなります。

①レンタルサーバーの設定変更(借りているサーバーによります。)

②プラブインをインストールし有効化する(YARPP)

③プラブインを設定する

④カスタムCSSコードを追加する

⑤プラグインのコードを一部修正する
※これをしないとサムネイル画像の縦横比がずれます。

①mixhost(レンタルサーバー)の設定( phpMyAdmin )変更

借りているサーバーにもよりますが、「mixhost」の場合は、必要でした。

以下「mixhost」の場合ですが、他のレンタルサーバで表示されない場合も、概ね同等の作業が必要になると考えてください。

「mixhost」の管理画面にログインし、「cPanel」にアクセスします。


phpMyAdminを選択

「phpMyAdmin」にアクセスします。
左の画面枠から、

「〇〇〇_posts」という項目を探します。
プルダウンを開いて、「CTR+F」で、検索窓を開き「posts」で、検索すれば見つけやすいかと思います。

「〇〇〇_posts」を見つけたら、それを選択し、画面上の方の「操作ボタン」を押します。


〇〇〇_postsを見つけよう

中断あたりの「ストレージエンジン」を「innoDB」から「MylSAM」へ変更し、保存します。

ストレージエンジンを変更します

ストレージエンジンを「MylSAM」に変更します

これで、レンタルサーバーの設定変更は終了です。

②プラグイン(YARPP)のインストールです。

お馴染みの画面ですが、WordPressの管理画面で、プラグインの新規追加で、「YARPP」を検索し、「イントール」し、「有効化」します。


お馴染みの画面です

③プラグイン(YARPP)の設定

WordPressnoの管理画面で、設定内の「YARPP」を選択します。

フィルター設定については、画面の説明のとおりに、入力すればOKです。


とりあえず、そのままでもOK

関連スコア設定は、重要です。

表示する最低関連スコアは、数字が高くなるとヒット率が厳しくなります。
沢山表示させたいときは、「1」にしておきましょう。
反対に、あまり表示させたくないときは、数字を大きくすればOKです。

「タイトル」、「内容」、「カテゴリー」、「タグ」は、
「検討する」、「検討しない」等が選択できますが、「検討しない」にすると検索範囲が広がる為、表示されやすくなります。

分からない時は、下図のとおりに設定して、表示される具合を確認してください。


記事が少ないうちは、緩めに設定しよう

次に表示設定ウェブサイト用の設定です。
今回は、サムネル表示させたいので、下の図の様に設定してみてください。
サムネイルではなく、リスト表示が良ければ、リスト表示を選択してください。


この画面のとおり設定してもOK

ヘッダーには、「関連記事」や「こんな記事も読まれています」等好きな文言を入力します。

関連記事がない時のメッセージは、「<P>~</P>」の間に、「関連記事はありません」と入力すればOKです。

何故か、「関連記事がない時のメッセージ」の方だけ、「タグ」があるのかは、不明です。

次に、表示設定 RSS/Atom フィールド用の設定です。
今回は、サムネル表示させたいので、下の図の様に設定してみてください。
サムネイルではなく、リスト表示が良ければ、リスト表示を選択してください。


この画面のとおり設定してもOK

関連記事表示を囲むタグには、「<h3>~</h3> 」の間に、「関連記事」や「こんな記事も読まれています」等好きな文言を入力します。

スポンサーリンク

関連記事がない時のメッセージは、「<P>~</P>」 の間に、「関連記事はありません」と入力すればOKです。

最後に変更を保存します。

これで、初期設定は完了ですので、

最後に、設定画面の上の方にある、「Create fulltext indexes」を選択して、プラブインの設定は完了です。



ブログランキングにご協力ください!
ブログランキング・にほんブログ村へ

さて、ここで、実際に表示される画面を「ブラウザのキャッシュをクリアしてから」確認してみましょう。

サムネイルに表示される「アイキャッチ画像の縦横比」が変になっているかと思いまので、最後にこれを直します。


サムネイルの縦横比がおかしい・・・

スポンサーリンク

④カスタムコードの追加

次のコードをカスタムCSS又は、子テーマを導入している場合は、子テーマの「stylec.ss」 に追加します。


これは、子テーマの画面です

/*--関連記事--*/
.yarpp-thumbnail > img, .yarpp-thumbnail-default {
height: auto !important; /*--高さを自動調節にし、サムネイル画像の縦横比を保持します--*/
}
.yarpp-thumbnails-horizontal .yarpp-thumbnail-title {
max-height: 5.5em !important; /*--高さ最大値を固定し、タイトル表示幅を確保します--*/
}
.yarpp-related .yarpp-thumbnail-title {
font-size: 70% !important; /*--タイトルのフォントサイズを縮小します--*/
}


⑤プラグインのコードを一部修正


※これをしないとサムネイル画像の縦横比がずれる合があります。

①のレンタサーバーの設定変更と同様に「cPanel」にアクセスします。

ファイルマネージャを選択します。



「public_html」
 ↓
「それぞれのドメイン」
 ↓
「wp-contents」
 ↓
「plugins」
 ↓
「yet-another-related-posts-plugin」
 ↓
「includes」

と階層を進め、「template_thumbnails.php」を探します。
このファイルの記述を変更しますので、念のために、バックアップを取ってださい。


念のためにバックアップは取っておこう

下の様に37行目前後の記述を変更します。


変更前

変更後

$post_thumbnail_html = get_the_post_thumbnail(null, $dimensions['size'], array('data-pin-nopin' => 'true') );



$post_thumbnail_html = get_the_post_thumbnail(null, 'thumbnail', array('data-pin-nopin' => 'true') );




「$dimensions[‘size’]」を「’thumbnail’」に変更します。

サムネイルの縦横比が直っていればOK

これで、サムネイル表示の縦横比も直っているかと思います。
お疲れさまでした。

まとめ

①レンタルサーバーの設定変更(借りているサーバーによります。)

②プラブインをインストールし有効化する(YARPP)

③プラブインを設定する

④カスタムCSSコードを追加する

⑤プラグインのコードを一部修正する



ブログ開設に必要なドメイン取得、サーバーレンタル、ASPの登録等は、こちらのサイトから!

コメント

タイトルとURLをコピーしました