PCで表示される広告の場合は、問題のない場合が多いのですが、スマートフォン（モバイル）で表示される広告の場合は、ASPによっては、１画面以内に１つだけしか広告を表示してはいけない場合があります。
しかし、できるだけユーザーの目に留まる場所に広告を設置しようとするとスマートフォンの場合、１画面以内に２つ以上の広告を表示してしまいそうになる場合があります。
それを避けるために、広告の場所を移動させたりするわけですが、あと少し余白があれば、１画面以内に１つの広告表示に収まる場合もあります。
今回の記事では、私のように、ワードプレスにそれほど詳しくない方が、なるべく簡単にスマートフォンで表示される広告の前後に隙間、余白を作る方法について説明していきます。
まあ、正直な話をすると、これは、忘れないための、自分のためのメモ帳代わりでもあります（笑）
今回使用しているワードプレスのテーマは、simplicity2です！
本文中以外では、スマートフォンで表示される広告の位置の微調整はやや難しい
本文中なら、スマートフォンで表示される広告の位置を移動したり位置の微調整をすることは、簡単にできます。
しかし、本文中以外だと、そう簡単にはできません。
無理やり文章やコンテンツを追加することは可能ですが、内容がそぐわない場合がありますし、また、意図的に誤タップを防ぐために間隔をあけたい場合があります。
具体的に図で表すと以下のような感じです（本文中以外）
赤丸の部分に余白を作ってやれば、１画面に１つの広告に収まる場合があります。
また先ほど述べたように誤タップを防ぐ効果もあります。
つまり以下のように余白を作りたいということです！
simplicityでスマートフォンで表示される広告の前後に隙間（余白）を作る
恐らく、上級者ならphpをいじったりすることで、解決できるのでしょうが、あまり詳しくない人からすると敷居が高いです。
また詳しい人の説明は、詳しい人がわかるように説明されているので、初心者の方には、難しい場合もあります。
そこで簡単に余白を作る方法を試してみました
使用しているワードプレスのテーマはsimplicity2です
具体的な方法の前に
まず、simplicityのテーマを使っている場合、初期設定で、各コンテンツやカテゴリーが、スマートフォンで表示される順番をみてみます。
１、本文
ここから本文より下になります
↓
２、投稿SNSボタン上
３、投稿SNSボタン下
４、投稿関連記事
５、次の記事へ、前の記事への移動矢印の表示
ここからサイドバーのコンテンツが表示されます
↓
６、検索欄
７、最近の投稿
８、アーカイブ
９、カテゴリ
・
・
と続きます
スマートフォンで表示される広告の前後に隙間を作る
では、具体的な方法です。
上記で説明したとおり、ワードプレスのテーマは、simplicity2です。
今回は、例としてウィジェットの投稿関連記事下に広告のコードを入力して広告を表示している場合で説明します。
上記の広告の前後に隙間を作ってみます。
※一応、ここからは、自己責任で行ってください！
１、まず、ワードプレスの管理画面を開いて外観→ウィジェットをクリックします
２、例えば、投稿関連記事下に広告を表示させているとします。
おそらくこんな感じで利用していると思います。
３、投稿関連記事下のウィジェット欄に以下のように
クラシックテキストをモバイル用広告を挟むようにドラッグ＆ドロップして一覧から持ってきます。
４、クラシックテキスト欄には以下のように入力します
１で書き込んでいるのは、改行するときのコードです。
このコードを書き込む数を多くすればするほど隙間（余白）が大きくなります
ワードプレスの記事の投稿画面でテキストモードに変更すると見ることができます。
２、自動的に段落を追加するにチェックを入れます
３、忘れずに 保存 をクリックして反映させます
これを上下２つのクラシックテキストで行います。
すると広告の前後に隙間（余白）を作ることが出来るはずです。
ちなみにクラシックテキストを利用する前
クラシックテキストを利用して隙間（余白）作った後
違いがわかると思います。
※注意
上記のようにウィジェットを使って作業を行った場合、すべての記事に反映されますので注意してください
補足１
今回は、１つのウィジェットにクラシックテキストを２つ使いましたが、それ以外の場所でも他のウィジェットの中にクラシックテキストを利用したりすることも可能です。
もちろん広告のコードを利用しているウィジェット以外のウィジェットにクラシックテキストを利用してもいいと思います。例えば、広告を利用しているウィジェットの上下など。
また、サイドバー領域の場合は、クラシックテキストを単独でドラッグ＆ドロップして使えばいいと思います。
例）以下のような感じ
サイドバー領域
検索欄
クラシックテキスト
最近の投稿
クラシックテキスト
アーカイブ
カテゴリ
補足２
ウィジェットを使って広告を一括で貼り付ける場合、利用されているレンタルサーバーによっては、セキュリティ上のシステムで広告のコードを入力してもいつまでたっても保存できない場合があります。
例えば、レンタルサーバーがロリポップの場合
ロリポップにログインして、管理画面から セキュリティ→WAF設定で広告を貼りたいドメインの設定状態を一時的に無効にします。するとウィジェットを使って一括で広告を貼り付けることが出来るようになるはずです。
また、広告の貼り付け作業が終了したら必ず、設定状態を有効に戻すことを忘れずに！
まとめ
恐らく、もっと高等なテクニックがあるのだと思いますが、私のようなワードプレス初心者向けに考えてみました。
広告の前後に適度な隙間があると、スマートフォンで閲覧している際に、間違ってタップしたりすることが少なくなりますので、スマートフォンユーザーにとっては、快適なサイトになるのではないでしょうか？
またサイト運営者にとっても誤タップが少なくなることは、かなりのプラスになるはずです。
それにしてもブログはとても便利ですね！
メモ代わりとして、とても優秀です。例えば、ワードプレで記事を分割する方法がわからなくて調べたとします。メモ帳に記録しておくと、後で、どこにメモしたのか探すのが手間ですし、図解入りでメモするのは、難しいです。
しかしブログなら、後で探しやすいですし、見やすい写真や図解入りで保存しておくことが可能です。便利な時代になりましたね(^^♪