Luxeritasの関連記事リストにインフィード広告を表示(プラグイン不要)

Luxeritas(ルクセリタス)は、人気のWordPress無料テーマです。

Luxeritasでは、各記事の下に『関連記事』のリストが表示されるようになっています。

この記事では、この関連記事リストの最後に、Googleアドセンスのインフィード広告を表示する方法を紹介します。

インフィード広告とは?

『インフィード広告』とは、関連記事や人気記事のリスト(フィードといいます)の中にさりげなく紛れ込んでいる広告です。

上の画像ので言うと、一番下がインフィード広告になります。

まるで記事のひとつであるのように、広告のデザインが溶け込んでいますよね。

Luxeritasで『関連記事』にインフィード広告を入れる手順

手順1:アドセンスのインフィード広告を作成

まずは、Luxeritasの関連記事リストに入れるインフィード広告を作成します。

Googleアドセンスにログインし、メニューの『広告の設定広告ユニット』を開き、『+新しい広告ユニット』をクリックします。

↑のように、作成する広告の種類を選択する画面が表示されますので、この中からインフィード広告を選択します。

 

↑インフィード広告の作成方法を選ぶ画面が表示されます。

自動と手動がありますが、とりあえず『自動で広告スタイルを作成する』を選択。

そして、自分のブログのURLを入力します。

ここで入力するURLは、ブログのトップページではなく、関連記事リストが表示される個別記事のURLです。

なお、PCモバイルを選択できますが、私のブログはアクセスのおよそ7割がモバイルからですので、モバイルを選択しました。

入力を終えたら、ページをスキャンをクリックします。

 

・・・少し待つと、自分のブログとインフィード広告のプレビューが表示されます。

左側の自分のブログのデザインの中から、関連記事リストに表示されているリンクのどれかをクリックすると、その部分が赤い点線で囲まれます。

この囲まれた部分のデザインが、作成されるインフィード広告のスタイルの基になります。

 

次へをクリックすると、↓のとおりインフィード広告のプレビューが表示されます。

『広告ユニット名』を適宜入力、『選択したディスプレイ広告を許可する』無効にし、『保存してコードを取得』をクリックします。

なお、この画面のグローバルオプションから、色やフォントなど広告の細かいデザインを調整できますが、とりあえずデフォルトのままで良いでしょう。

次の画面に表示される広告表示用のコードをクリップボードにコピーし、インフィード広告作成は終了です。

手順2:related.phpを子テーマのフォルダにコピー

Luxeritasの親テーマフォルダに、related.phpというファイルがあります。

このrelated.phpは、関連記事リストの表示にかかわるファイルです。

関連記事リストにインフィード広告を入れるためには、このrelated.phpに、先ほどコピーした広告表示用コードを追加する必要があります。

 

まずは、このrelated.phpファイルを、Luxeritasの子テーマフォルダにコピーします

 

通常、Luxeritasの親テーマフォルダのパスは

/wp-content/themes/luxeritas/

です。

このフォルダに入っているrelated.phpを、子テーマフォルダ

/wp-content/themes/luxech/

の中にコピーします。

手順3:related.phpに広告表示用コードを追加

子テーマフォルダにrelated.phpをコピーしたら、WordPressの管理画面にログインします。

左メニューの『外観テーマの編集』をクリック、

編集するテーマを選択』から『Luxeritas Child Theme』を選択します。

↑右側のテーマファイルの一覧に、先ほどコピーしたrelated.phpが表示されているはずです。

このrelated.phpをクリックすると、中央の白背景の『選択したファイルの内容』ボックスに、related.phpの内容が表示されます。

このrelated.phpの記述内容を一番最後まで見ていくと、以下のコードで終わっていると思います。

コード
wp_reset_postdata();
?>
</div>

この一番最後の</div>の直前に、以下のコードを追加します。

追加するコード
<div class="toc clearfix">
インフィード広告表示用コード
</div>

念のため、完成形は以下のようになります。

完成形コード
wp_reset_postdata();
?>
<div class="toc clearfix">
インフィード広告表示用コード
</div>
</div>

なお、『インフィード広告表示用コード』の部分は、手順1の最後にアドセンスのサイトで取得したコードに置き換えます。

コードを追加したら、『ファイルを更新』をクリックし、作業完了です。

 

ちなみに、上記は関連記事の最後にインフィード広告を入れる場合ですが、関連記事の一番上に表示するには、related.phpの18行目に、

<div id=”related”>

という記述がありますので、この直後に上記の追加コードを入れてやればOKです。

なお、インフィード広告の表示が安定するまでには、ある程度の時間がかかるようです。

以上、無料のWordPressテーマ『Luxeritas』の関連記事リストに、Googleアドセンスのインフィード広告を表示する方法でした。

Luxeritasで記事ごとにnoindexを設定する方法(プラグイン不要) Luxeritasの「見出し・引用」をカスタマイズ(H2・H3・blockquote)

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です