WordPress

AFFINGER5をカスタマイズ!バナーの位置を中央に表示させたい【重要】

AFFINGER5をカスタマイズ!バナー広告は中央配置で見た目をカッコよく

はや@ブログ専門家

▶ブログ開設のプロが運営 ▶ 寝る暇さえあればブログを研究 ▶ A8.netブラックランク達成 ▶ こんな情報が欲しいんだけど?という人は「お問い合わせフォーム」からお気軽にどうぞ!▶ ハヤブロはあなたの悩みを瞬時に解決することをモットーに運営しています!

 

アフィリエイト広告を貼っているんだけど、バナーが左側によってしまう…。コツを知りたい。
悩む男子

 

こんな悩みを解決します。

 

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

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

 

実際ぼくは見た目気になりますし、あまりに雑な感じがすると「信用できない」とすら感じます。

 

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

 

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

 

AFFINGER5をカスタマイズ!バナー広告が左右に寄っているとかっこ悪い

AFFINGER5をカスタマイズ!バナー広告が左右に寄っているとかっこ悪い

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

 

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

 

  • ASPと、バナー広告を貼り方についてはこちら

【入門】ブログで収益化をする方法!ワードプレスとASPの併用がかなり稼げます

 

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

 

  • パソコンでの表示例

 

  • スマホでの表示例

 

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

 

バナーを中央に表示する方法はタグの追記のみ

バナーを中央に表示する方法はタグの追記のみ

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

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

 

そこで、広告のコードの前後に、<Center></Center>(実際は半角英数字で入力)タグでバナー広告のコードを囲います。

 

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

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

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

 

  • パソコンでの表示

 

  • スマホでの表示

 

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

 

AFFINGER5をカスタマイズ!バナー広告は中央配置で見た目をカッコよく(まとめ)

AFFINGER5をカスタマイズ!バナー広告は中央配置で見た目をカッコよく

この手法はAFFINGER5をはじめどんなテーマでも使える基本的なテクニックです。

 

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

 

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

 

最後までお読みいただきありがとうございました。

 

関連する記事の一覧

  • この記事を書いた人

はや@ブログ専門家

▶ブログ開設のプロが運営 ▶ 寝る暇さえあればブログを研究 ▶ A8.netブラックランク達成 ▶ こんな情報が欲しいんだけど?という人は「お問い合わせフォーム」からお気軽にどうぞ!▶ ハヤブロはあなたの悩みを瞬時に解決することをモットーに運営しています!

-WordPress
-, ,