SWELLでバナー広告を中央に貼れない!と悩んでいる人が多いみたいなので、解決策を共有します。
カスタムHTMLブロックを使って、バナーを中央に揃える方法を紹介していきます。
前書きはこの辺にして、早速解決策を紹介していきます!
SWELLのカスタムHTMLのバナーを中央に配置する方法
結論は、HTMLの中に中央に配置するためのコードを追加するだけ。
HTML
<div style="text-align: center;">
~ここにHTMLのコード~
</div>
赤太文字の部分はコピーしてメモ帳などのファイルで皆さんのPCのデスクトップに貼り付けておきましょう!
実際にバナーを貼って実践してみますね。
使用するバナーは私も使用しているサーバーのConoHa WINGのものです。
普通に貼るとこんな感じ
カスタムHTMLブロックを使って普通に貼ると、左に寄ります。
コードとしては、以下の通り。(そのままコピペしただけ)
HTML
<a href="https://px.a8.net/svt/ejp?a8mat=●●●●●" rel="nofollow">
<img border="0" width="200" height="120" alt="" src="https://www21.a8.net/svt/bgt?aidxxxxxxxx&wid=001&eno=01&mid=sxxxxxxxxxxxxx&mc=1"></a>
<img border="0" width="1" height="1" src="https://www15.a8.net/0.gif?a8mat=●●●●●" alt="">
中央に配置するコードを追加します
はい、中央に配置できました。
HTMLコードは以下の通り。(ASPからコピペしたものを指定のコードで挟み込む)
HTML
<div style="text-align: center;">
<a href="https://px.a8.net/svt/ejp?a8mat=●●●●●" rel="nofollow">
<img border="0" width="200" height="120" alt="" src="https://www21.a8.net/svt/bgt?aidxxxxxxxx&wid=001&eno=01&mid=sxxxxxxxxxxxxx&mc=1"></a>
<img border="0" width="1" height="1" src="https://www15.a8.net/0.gif?a8mat=●●●●●" alt="">
</div>
最初と最後に追記しているだけです。
SWELLじゃなくても、どんなテーマを使っていてもできます
SWELLで困っている人が多いみたいだったのでSWELLで書きましたが、この方法はどんなテーマを使っていても活用できます。
HTML
<div style="text-align: center;">
~ここにHTMLのコード~
</div>
ちょっと手間はかかりますが、見栄えが良くなるので是非使ってみてください。
ブログのカスタマイズで役立つ記事が他にもあるので、色々見てもらえると嬉しいです!