WordPressの無料テーマ『LION MEDIA』について解説しているページです。
今回のテーマは、『LION MEDIA』カスタマイズ【広告設定】の使い方についてです。
『LION MEDIA』では、広告タグを簡単に設定し、広告を配置できる機能が備わっています。
カスタマイズ【広告設定】で広告を配置できる場所
・記事内広告
・アーカイブインフィード広告
・記事下ダブル広告
・AMP用 投稿記事 上部・下部の広告
さらにウィジェットを使えば、広告を配置できる場所が広がります。
参考になる記事
広告について
広告表示の例として、YAHOO! JAPAN のトップページをお借りしました。
赤い線で囲まれているところが「広告」です。
【広告設定】で設定さえしてしまえば、このような広告を自分のWebサイトにも表示することができるのです。それも一度設定してしまえば、あとは自動表示！
じゃぁ、自分のWebサイトに広告を表示するにはどうすればよいのか？
自分のWebサイトに広告を掲載するには、広告を配信・提供している会社と契約を結ぶ必要があり、広告会社ごとに異なる条件や審査があります。
【広告を配信している会社の一例】
・Google AdSense（グーグルアドセンス）
・A8.net （エイハチネット）
・バリューコマース
・もしもアフィリエイト
・楽天アフィリエイト
・Amazonアソシエイト
詳しくは、各広告会社のサイトを見るか、「アフィリエイト」というキーワードで検索すると、たくさん情報が出てきますのでそちらをご参照ください。
記事内広告の設定
記事内広告とは、記事本文内に設置する広告のことです。
ここに、広告タグを貼り付けておけば、記事内でペタペタを貼り付ける必要がなくなります。
ちなみに、見出し「記事内広告の設定」の上に表示されているのが記事内広告です。Googleアドセンスを使っています。
記事内広告を配置すると、「ストライプのボックス」と「Advertisement（広告という意味）」が投稿ページ内にセットされます。このボックス内に広告が配置される仕組みです。「Advertisement」とは広告という意味です。記事内であれば、自分の好きなところに、好きなだけ自由に配置できます。
最近では、記事内に溶け込むような広告が多く、知らずにクリックしてしまい「えっ、広告やったん！ちゃうちゃう、記事が読みたかったのに・・・」って気持ちになってしまったことはありませんか？
最初から「これは広告だ」ってわかっててクリックするのと不本意でクリックするのとでは、気持ち的に全然違いますよね。ちゃんと広告だよって表示させることで訪問者を不快にさせないという対策は、サイトを運営する上では必要なことだと思います。
それでもやっぱり消したいって方は、こちらの記事をお読みください。
『LION MEDIA』『LION BLOG』 広告表示の背景を消す２つの方法
[adsense]と入力しても表示されない
広告タグを入力する上に「記事に[adsense]と記入すると、投稿内にAdSense等の広告が表示できます」と表示されています。
これ、ダメ～！ （どこかの番組みたいですみません）
そのまま入力しちゃうと大変です。文中にバッチリ表示されます。読んだ人はなんのこっちゃです。
入力例
対策その１
［adsense］のかわりに［adchord］と入力する。
対策その２
「ビジュアルエディタ」から「テキストエディタ」に切り替えて記事内広告をクリックする。赤枠のところです。
使い勝手がいい方法でやってみてください。
アーカイブ用インフィード広告
インフィード広告とは、そのサイトに合うスタイルで溶け込むように表示させる広告のことです。
Googleのインフィード広告例
ここでは、アーカイブページに表示させる広告の設定を行います。広告タグを入力しておくだけで自動的に広告が表示されるようになります。
何番目に広告を表示するかを指定する
インフィード広告をどの位置に表示するのかを設定します。
例えば、「２」と指定した場合は、２番目の記事と３番目の記事の間に広告が表示されます。
指定した番号の後ろに広告が設置されるということです。
１ページ目のみ表示する
アーカイブページが複数ページがある場合に、２ページ目以降も広告表示を行うかを設定する項目です。チェックを入れると１ページ目のみ表示され、２ページ目以降は表示されません。
記事下用ダブル広告の設定
投稿ページの記事下に表示する広告の設定を行います。デフォルトは、表示しないになっています。
記事下には、広告を２つ配置することができ、「左」「右」それぞれに別々の広告タグを入力することができます。
配置した例
表示させる場合は、「表示する」に変更し、広告タグを左右それぞれに入力しましょう。１つだけの利用でもOKです。あと、右に表示させる広告はスマホ非表示設定になっています（変更不可）。
Googleアドセンスの広告配置に関するポリシーに反しないようにするため、スマホ非表示となっています。
PCでは横並び表示であっても、スマホの小さな画面では縦に広告が並び、画面全部が広告表示となってしまいます。アドセンスのポリシーでは「スクロールしなければ見えない位置にコンテンツを押しやるレイアウトをしてはいけない」と言っているため違反になってしまうのです。
AMP用広告の設定
カスタマイズ【AMP設定】でAMP機能を有効にした場合に表示する広告の設定です。
AMPとは
AMP(Accelerated Mobile Pages)とはGoogleとTwitterで共同開発されている、モバイル端末でウェブページを高速表示するためのプロジェクト、またはそのためのフレームワーク(AMP HTML)のことです。
参考：SEO HACKS
Googoleアドセンスの広告コードの例
<script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
<!–広告の名前–>
<ins class=”adsbygoogle”
style=”display:block”
data-ad-client=”ca-pub-0123456789″
data-ad-slot=”0123456789″
data-ad-format=”auto”></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
黄色のマーカー部分が必要なところです。入力例に従って入力します。
<amp-ad
width=”300″
height=”250″
type=”adsense”
data-ad-client=”ca-pub-0123456789″
data-ad-slot=”0123456789″>
</amp-ad>
入力はカスタマイズ画面からコピペでOK。
コピペーしたら、「0000000000」（２ヶ所）を黄色のマーカーが引いてある数字に置き換えれば終了です。
記事上、記事下の２ヶ所入力するところがありますが、私は別々のコードを貼っています。
AMP用広告を設定した例
Koharu のこぼれ話
ちゃんと入力例が書いてあるのに、Googleアドセンスのコードをそのままコピペ。その結果、サーチコンソールのエラーとなってしまいました。
みなさんは、入力例どおりやりましょうね。