賢威でトップページのメニュー下にメルマガ登録フォームなどのコンテンツを設置する方法


今回は賢威7と賢威6.2のトップページのメニュー下、以下の画像赤枠の場所にメルマガ登録フォームなどのコンテンツを配置する方法を解説します。

<賢威7>賢威7 トップページ メニュー下

<賢威6.2>1

この場所は、僕たちのブログを開いたユーザーの目に止まりやすい場所ですので、ブログレイアウトの中でも宣伝効果の高い位置です。

ただ、宣伝効果が高いとはいえ、現在、画像の赤枠の場所にアドセンス広告を掲載することは、アドセンスの広告配置ポリシーで禁止されています。

なので、上記画像の赤枠の場所はアドセンス広告以外の宣伝に活用します。

また、PCで見た時とスマホで見た時とで、表示を切り替えることも可能ですので、その方法も合わせて解説します。

賢威7のトップページのメニュー下にコンテンツを設置する方法

賢威7のトップページのメニュー下に、コンテンツを設置するには、

ワードプレスのダッシュボード→外観→テーマの編集→メインインデックスのテンプレート(index.php)

の順にクリックし、以下の画面を開きます。

賢威7 index.php メニュー下

上記赤枠で囲った場所に、設置したいコンテンツのHTMLコードを挿入することで、コンテンツの設置をすることができます。

例えば、

・メルマガの登録フォームを設置したい場合は、メルマガの登録フォームのHTMLコードを挿入します。

・物販系商品の広告を表示させたい場合は、物販系商品の広告コードを挿入します。

このように、表示させたい任意のコンテンツのHTMLコードを挿入することで、そのコンテンツを賢威7のトップページのメニュー下に配置することが可能です。

※メルマガの登録フォームや広告コードは、各メール配信スタンドやASPから取得します。

今回は一例として、画像を挿入して解説します。

挿入が完了したら、『ファイルを更新』のボタンをクリックします。

すると、以下のように表示されます。

賢威7 メニュー下 コンテンツ挿入

賢威6.2のトップページのメニュー下にコンテンツを設置する

続いて、賢威6.2で同様の設定をする方法について解説します。

賢威6.2の場合も同様に、

ワードプレスのダッシュボード→外観→テーマの編集(エディター)→メインインデックスのテンプレート(index.php)に行きます。

そしたら、次の場所を探して下さい。

2

この部分にアドセンスコードを差し込めば、OKです。

3

このようになります。

※今回は便宜的に画像を挿入しています。青いラインの部分があなたの設置するコンテンツのHTMLコードの部分になります。

また、上の画像では、中央寄せのタグを使用しています。

<div align=”center”>ココに挿入したいコンテンツのHTMLコードを入れる</div>

<br />は改行のためのコードです。必ずコードの結びは</div>で閉じてください。

『”center”』と書かれている部分は、コンテンツの表示を中央寄せにする意味があり、『”center”』の部分を

・left

・right

などにすることで、コンテンツの配置を左寄せにしたり、右寄せにしたりすることが可能です。

できたら、『ファイルを更新』ボタンをクリックして、トップページに戻ってみます。

4

この様になっていればOKです。

※上の画像は、例としてアドセンス広告の画像を表示させていますが、先に解説した通り、現在、この位置にアドセンス広告を掲載することは、アドセンスの広告配置ポリシーで禁止されています。

設定自体はこれで完了なのですが、現在はスマホからのサイトのアクセスが増えているので、スマホ用とPC用で表示させるコンテンツを変更した場合があります。

例えば、

『スマホは画面サイズが小さいので、スマホで見た時は小さめな広告やコンテンツを表示させたい。けど、PCは画面サイズが大きので、PCで見る人にはもっと大きな広告やコンテンツを表示させたい』

という具合です。

そんな時は簡単なコードでスマホとPC用の広告を切り替える方法があります。

スマホとPCで広告などの表示を変える方法

その前に、上の方法では例として画像を貼り付けましたが、実際この様に貼り付けると、読み込むソースコードの量も増えるので、サイトの表示速度も遅くなります。

なので、「Adsense Manager」というプラグインを使って、コードを短くします。

このプラグインの使い方の説明は割愛しますが、簡単に言えば、ソースコードの引き出しをつくるプラグインです。引き出しの中に広告コードを入れておいて、その引き出しの名前をPHPのプログラムで読み込み、中のコードをサイトに反映させることができます。

アドセンスのコードをたった1行にできる上、引き出しの中身(広告コード)さえ変えれば、別の広告も表示させることができるので、大変便利です。

以降は、そのプラグインを使った状態で解説して行きます。

コードでスマホとPCの広告をスイッチする

スマホとPCでアドセンス広告の表示を切り替えるには、こちらのコードを使います。

<?php if ( function_exists(‘wp_is_mobile’) && wp_is_mobile() ) :?>

スマホ用の広告コード

<?php else: ?>

PC用の広告コード

<?php endif; ?>

これはどういう仕組みかというと、まずアクセスしてきた人のデバイスがスマホだった場合は、上のコード内に記載されている「スマホ用の広告コード」の広告が表示されます。

次に、アクセスしてきた人のデバイスがPCだった場合、その次の「PC用の広告コード」が反映されてPC用の広告が表示されます。

要は、スマホだったらこの広告、そうじゃなかったらこっちの広告を表示させる、という切り替えスイッチなんです。

賢威7でも賢威6.2でも使えるコードですので、スマホとPCで別のコンテンツを表示させる時に便利です。

今回はこの様にしました。

<?php if ( function_exists(‘wp_is_mobile’) && wp_is_mobile() ) :?>

<?php adsensem_ad(‘sumaho’); ?>

<?php else: ?>

<?php adsensem_ad(‘pc’); ?>

<?php endif; ?>

赤字の部分が、先ほどの「Adsense Manager」によってコードが簡略化している部分です。

「<?php adsensem_ad(‘sumaho’); ?>」にはスマホで表示させたい広告コードが、「<?php adsensem_ad(‘pc’); ?>」にはPCで表示させたい広告がそれぞれ入っています。

そして、これを先ほどイメージ画像を設置した場所に入れてみます。

5

設置したら、「ファイルを更新」ボタンをクリックして、トップページに戻ってみます。

まずはPCで見た時の表示です。

6

分かりやすいように横長のイメージ画像を貼ってみました。

続いて、スマホでアクセスするとこうなります。

7

このようになりました。スマホ用には四角いイメージ画像を挿入してみました。

このように、上記のコードを使用することで、スマホとPCのそれぞれで違うコンテンツを配置することが可能です。

スイッチできるコードの応用

<?php if ( function_exists(‘wp_is_mobile’) && wp_is_mobile() ) :?>

スマホで表示したいコード

<?php else: ?>

PCで表示したいコード

<?php endif; ?>

先ほどの、表示を切り替えるコードですが、「スマホで表示したいコード」の部分を空欄にすると、スマホには何も表示されず、PCだけに「PCで表示したいコード」の部分が反映されます。逆に「PCで表示したいコード」の部分を空欄にすると、PCには何も表示されず、スマホだけに「スマホで表示したいコード」が反映されます。

このように、表示をスイッチできるコードは、広告以外のコードを入れるなど、応用次第でいくらでも活用できるものです。今後さらにスマホからのアクセスが増えることを考えると、覚えておきたい方法です。

次ページ

12次

今回の記事はお役にたてましたでしょうか?

もし、今回の記事を読んで感想や分からない事などありましたら、下のフォームよりお伝え下さい。

些細な事でも構いません。

おそらく、あなたが抱いた疑問は、これからこの記事を読む方も抱く疑問です。

そういった疑問を1つ1つ解決していきます。

コメントして頂ければ気づき次第、すぐに回答いたします。



総合案内

著者情報
著者情報
年収1000万円まで守る2つの事
年収1000万円まで守る2つの事
読者さまの声
読者さまの声
もくじ
もくじ
超初心者講座
超初心者講座
ブログ基礎講座
ブログ基礎講座
トレンドブログ講座
トレンドブログ講座
パワーブログ講座
パワーブログ講座
マインドセット
マインドセット
コピーライティング
コピーライティング
ブログアフィリエイト
ブログアフィリエイト
トレンドアフィリエイト
トレンドアフィリエイト
ネットビジネス
ネットビジネス
SEO
SEO
コラム
Googleアドセンス
Googleアドセンス
与える事に徹する
与える事に徹する
先生の選び方
先生の選び方
Googleアドセンスの始め方
Googleアドセンスの始め方
賢威カスタマイズ
賢威カスタマイズ
このブログについて
このブログについて
女性のブログアフィリエイト
女性のブログアフィリエイト
そもそものステップが違う
そもそものステップが違う
中高年の方はシンプルな方法がお勧め
中高年の方はシンプルな方法がお勧め

このページの先頭へ