スポンサーリンク

STINGER・AFFINGERカスタマイズ

【AFFINGER4】アドセンスのリンクユニットをサイドバーと記事下に設置する方法

投稿日:2017年8月29日 更新日:



Googleアドセンスの広告といえば、「テキスト広告とディスプレイ広告」が一般的ですが、その中にある「リンクユニット」というものをご存知ですか?

現在、AFFINGER4を利用している当ブログでは、サイドバーの広告の下と...

記事下のカテゴリーとタグの下に、いずれもレスポンシブサイズのリンクユニットを設置しています。

こんな時に限って英語のイマイチなテキストが表示されていますが(笑)、リンクユニットは頻繁にデザインが変更されている印象です。

少し前までは、ランキング形式のこのような表示になっていました。
日本語テキストで関連性の高い内容が表示されています。

アドセンスのリンクユニットは、クリック後に表示される広告を再度クリックされた場合に収入が発生する仕組みですが、サイトの利便性や収益性アップのために設置してみてはいかがでしょうか。

スポンサーリンク

リンクユニットのコードを取得

Googleアドセンスにアクセス→左側のメニューの「広告の設定」→「+新しい広告ユニット」→「テキスト広告とディスプレイ広告」を選択します。

広告に名前をつけて、広告サイズは「リンク広告」を選択。

レスポンシブリンク(自動サイズ)を選択→必要に応じて「テキスト広告のスタイル」でカラーを設定→「保存してコードを取得」をクリックです。

サイドバーの広告の下にリンクユニットを設置する方法

当ブログの設置方法です。

WordPressダッシュボード→外観→ウィジェット→「サイドバートップ」内に「カスタムHTML」をドラッグ&ドロップ→アドセンス広告の下に取得したリンクユニットのコードを追加します。

下記のように、広告とリンクユニットの間に改行コードを入れています。

余談となりますが、パソコンではラージスカイスクレイパーで表示される、サイドバーのレスポンシブサイズのアドセンス広告をレクタングル表示に変更する方法は、下記ページで説明しています。

1,379view
アドセンスのレスポンシブ広告で表示されるラージスカイスクレイパーをレクタングルに変更する方法

当ブログのサイドバートップには、アドセンスのレスポンシブサイズの広告を設置しています。 レスポンシブサイズのアドセンスをサイドバーに設置すると、パソコン表示では自動的に大きな広告(ラージスカイスクレイ ...

記事下のカテゴリーとタグの下にリンクユニットを設置する方法

子テーマの作成

こちらのカスタマイズは「single-type1.php」と「style.css」、さらに必要に応じ「single.php」を編集します。

style.cssは、あらかじめ子テーマが用意されていますが、テーマのアップデートによってカスタマイズ内容が消えてしまわないように、必ず「single-type1.php」と「single.php」の子テーマを作成してください。
「single.php」は、初回カスタマイズのみ編集が必要になります。
他のカスタマイズで既に作成済みの場合は、新たに作成する必要はありません。

AFFINGER4で初めて「single-type1.php」の編集をされる方はこちらの項目をご確認の上、必ず「single.php」の「TEMPLATEPATH」を「STYLESHEETPATH」に修正してください。
5,205view
WordPressのカスタマイズ ~子テーマ利用のメリットとデメリット・各テーマファイルの子テーマ作成方法~ - ゼロからのWordPress入門【18】

前ページでは、WordPressのファイルとデータベースのバックアップ方法をご紹介しました。 もしものトラブルに備えてバックアップ方法をマスターしたら、次のステップはテーマのカスタマイズです。 ご自身 ...

single-type1.phpにコードを追加

WordPressダッシュボード→外観→テーマ→テーマの編集→「single-type1.php」(子テーマ)を開きます。

パソコンの「Ctrlキー」+「F」で表示される検索欄に、tagst と入力してマークされる下記部分を探してくださいね。

上記コードのすぐ下に、下記コードを追加します。

【リンクユニットのコード】の部分は、あらかじめ取得しておいたコードに書き換えてください。

style.cssにコードを追加

WordPressダッシュボード→外観→テーマ→テーマの編集→「style.css」(子テーマ)を開きます。

最下部に下記コードを追加してカスタマイズ完了です。

※リンクユニットの下に20pxの余白を指定(数値はお好みで変更可能です)

子テーマのstyle.cssに追加したコードが反映されない場合は、キャッシュをクリア及び、追加場所を先に入力しているコードの前に変更して再度お試しください。

以上、AFFINGER4のサイドバーと記事下にアドセンスのリンクユニットを設置する方法をご紹介しました。

最後までお付き合いくださりありがとうございます。

この記事が気に入ったら
いいね!しよう

Twitter で

Facebook・Twitterへ最新記事をお届けします

スポンサーリンク

-STINGER・AFFINGERカスタマイズ

Copyright© Kanamii , 2024 All Rights Reserved Powered by AFFINGER5.