僕がブログ収益化に利用している、主な広告がgoogleアドセンスですが、
これと並行して状況に応じて配置しているのが楽天アフィリエイトですね。
恐らく、ブログ収益化をされている方々の中でもアドセンスと楽天アフィリエイトの組合せで収益化をされている方は多いと思います。
で、今回紹介するのは、楽天アフィリエイトの画像商品リンクの中央揃えの方法です！
それでは、ご覧ください！
楽天アフィリエイトの商品リンク(画像バナー)の中央揃え方法！【ワードプレス/HTML】
まず大前提として、この方法は「HTML」での方法です。
僕の場合は、ワードプレス（WordPress）でHP作成していますのでそのベースとなる言語がそれになりますね。
そして、恐らくこのページに辿り着かれた方は、実際の作業でリアルタイムで困ってしまった方かと思います！
そのためまずは要点だけ、早速、解説していきたいと思います！
HTMLでの楽天広告バナー中央配置方法
実施いただきたいのは以下のHTMLコードを追加してあげることです！
<div align="center">
楽天広告バナー
</div>
もしくは、
<center>
楽天広告バナー
</center>
※コピーしてお使いください！
…
ということで、たったこれだけで完了です！
あっさりですね～(笑)
早速、ご自身のサイトで実施し確認してみてください！
と、
言いつつも、念のため実例を紹介しておきますね！
楽天アフィリ商品リンク(画像バナー)のHTML中央寄せの実践例！
お分かりかもしれませんが、どこに貼り付けるかというと、記事作成画面のテキストですね！
ワードプレスだとビジュアルエディタとテキストエディタがありますからお間違いなきよう！
そして、実際の記載方法はこんな感じになります！
コード入力前の画像バナー配置
楽天アフィリサイトで広告コードをそのまま貼り付けた場合、以下のような左寄せの状態で配置されます。
テキストエディタでのコード入力<div>
上で紹介した中央寄せコード<div>を広告バナーソースの前後に入力します。
※以下画像の黄色マーカー部
テキストエディタでのコード入力<center>
上で紹介した中央寄せコード<center>を広告バナーソースの前後に入力します。
※以下画像の黄色マーカー部
コード入力後の画像バナー配置
真ん中に配置されました！
という具合で画面中央への配置が超簡単に出来るようになります！
とは言え、実はこのコードに辿り着くまでには、色々と試練がありまして…
いくつかの方法でトライしたのですが、中央揃えが出来そうな方法でもそうならない事例もあったんですよね。
最後にそういった事例を紹介して終わりにしたいと思います！
【失敗例】楽天広告バナーの中央配置はこの方法じゃできなかった…
ここでは、中央揃えしたいときに思い浮かぶ簡単そうな手法でトライして中央に配置できなかった事例を2つ紹介します！
ワードプレス / ビジュアルエディタでのダイレクト指示
ビジュアルエディタ上で画像をクリックすると出てくる配置コマンドをクリックしても何も起きませんでした…
原理が分かっていれば、納得できるのかもしれませんが、その理解は残念ながら出来ていません…
ワードプレス / 画像詳細設定
上記の詳細画面で選択しても何も起きませんね。
最初に中央表示する為に思いつくことはこのあたりかな、と思いますが、残念ながらそう簡単に行かないところに多少の難しさを感じます。
ですが、これは知っているか、知らないかの話ですから、知識を積み重ねていけば全然簡単なことだと思います！
ブログ作成作業で楽になる方法は、この繰り返しも重要ですね！
