あなたのカラダの悩みからガジェットノウハウまで。ハイブリッドに情報発信するマニアックブログ

HAYAMIZ BLOG

AFFINGER

AFFINGER 5(WING)でバナー広告の調整方法で困っている。見た目はわりと重要です。

AFFINGER 5(WING)でバナー広告の調整方法で困っている。見た目はわりと重要です。

沢山の方のブログを拝見しますが、バナー広告が左右に寄ってしまっている場合があります。

ブログは見た目がすべてではありませんが、見た目が気になる読者がまったくいないわけではありません。

 

はや
見た目が悪いだけで離脱されるユーザー、実は多いんです。

 

今回はバナー広告(バナー画像)が左右に寄ってしまっている原因とキレイに見せる解決方法を紹介します。

 

バナー広告が左右に寄っているとかっこ悪い

ワードプレスを利用している場合、ウィジェット(おもにサイドバー)を使ってASPから配布されているあなた専用のURLを貼り付けてブログに表示していますよね。

たしかにそれだけで、広告は表示することができます。

ですが、サイズが縦長(120×600)などの場合、バナーが下の画像のようにかたよってしまうことがあります。

 

パソコン

 

モバイル

 

ブログは見た目がすべてではありませんが、ユーザーの見易さも考慮したバナーの張り方も熟知しておくとよいでしょう。

 

設定方法はタグを追記するだけ

まずはタグを記述していない場合のウィジェットです。

 

これだけで広告は表示されますが、上述したように、広告は左寄せになってしまいます。

 

そこで、上記のタグに<Center></Center>タグでバナー広告のタグを囲います。

 

中央に揃えば見た目もバッチリ

パソコン、モバイルでそれぞれ中央表示になったか確認します。

 

パソコン

 

モバイル

 

はや
バッチリできました!

 

注意点(まとめ)

この手法はさまざまなテーマで使用できる手軽なテクニックです。

しかし、テーマによっては位置が強制されている場合も考えられます。

AFFINGER 5は強制されていません。

 

タグを設定しても変化がない場合、ブラウザキャッシュ、ワードプレスのプラグインのキャッシュ(キャッシュプラグインを使用している場合)をクリアして再度表示してみてください。

それでも改善されない場合は、テーマで強制されている可能性があります。

 

 

参考になれば幸いです。

関連コンテンツ

-AFFINGER
-ワードプレステーマ

Copyright© HAYAMIZ BLOG , 2019 All Rights Reserved.