WordPressテーマ THE THOR
別ブログのZMASAa.blogは、WordPressテーマ THE THOR（ザ・トール）を使って構築しています。
今回、WordPressテーマ THE THOR（ザ・トール）でAmazonアソシエイトバナー表示する際の注意点についてまとめてみました。
Amazonアソシエイトバナー サイズ300 x 250
Amazonアソシエントバナーには色々なサイズが用意されています。
自分が好んでよく使うAmazonアソシエントバナーは、下記の「Amazonアソシエイトバナー サイズ300 x 250」です。
WordPressテーマ Cocoonで構築したこのMASAa.netのサイドカラムエリアに設置させて頂いております。
WordPressテーマ THE THORでのAmazonアソシエイトバナー表示
「Amazonアソシエイトバナー サイズ300 x 250」の表示をパソコンで確認すると、下記の様に問題無く表示されます。
なお、スマートフォンで「Amazonアソシエイトバナー サイズ300 x 250」の表示を確認すると、1カラム表示となり問題無く表示されます。
iPadでWordPressテーマ THE THORで構築したブログ表示
WordPressテーマ THE THOR（ザ・トール）で構築したブログをiPadで表示させると、パソコンと同じようにメインカラムとサイドカラムが表示されます。
但し、メインカラムとサイドカラムの横幅サイズがアンバランスで窮屈感を感じてしまいます。
iPadを横にしたZMASAa.blogの表示はこちらになります↓
iPadを縦にしたZMASAa.blogの表示はこちらになります↓
iPadを横で表示した場合はまだ良いのですが、iPadを縦で表示した場合、そのアンバランス感がかなり出ています。
WordPressテーマ THE THORでのAmazonアソシエイトバナー表示問題
パソコンやスマートフォンでは正常に「Amazonアソシエイトバナー サイズ300 x 250」が表示されるのですが、iPadで確認すると「Amazonアソシエイトバナー サイズ300 x 250」がサイドカラムエリアからはみ出している状態です。
なお、iPadを横にした場合でも同様に「Amazonアソシエイトバナー サイズ300 x 250」がサイドカラムエリアからはみ出しています。
WordPressテーマ THE THORでのAmazonアソシエイトバナー表示問題対応
今回、WordPressテーマ THE THOR（ザ・トール）で「Amazonアソシエイトバナー サイズ300 x 250」をサイドカラムエリアで表示するのは諦めました。
なお、WordPressテーマ Cocoonでは、iPadなどのタブレット用の設定として、1カラム表示設定やサイドカラムエリアをメニュー化にする設定項目が有り、このような問題は発生しません。
WordPressテーマ THE THOR（ザ・トール）でiPadなどのタブレットで表示した際、「Amazonアソシエイトバナー サイズ300 x 250」がサイドカラムエリアからはみ出す原因として、サイドカラムエリアの横幅が狭すぎることが原因です。
WordPressテーマ Cocoon同様に、今後WordPressテーマ THE THORにもタブレット用の設定として、1カラム表示設定やサイドカラムエリアのメニュー化にする設定が設けられることを期待します。
と言う事で、「Amazonアソシエイトバナー サイズ300 x 250」をサイドカラムエリアに設定すると、はみ出してしまうことが有るので注意が必要です。
WordPressテーマ THE THORでのAmazonアソシエイトバナー表示問題の代替案
「Amazonアソシエイトバナー サイズ300 x 250」の設置は諦めたのですが、その代わりに「Amazonアソシエイトバナー サイズ120 x 600」を設置することにしました。
この「Amazonアソシエイトバナー サイズ120 x 600」にすると縦に長くなりますが、サイドカラムエリアからはみ出すことは無くなります。
そのまま貼り付けると「Amazonアソシエイトバナー サイズ120 x 600」は右側に表示されるので、下記のエントリー記事に書いた設定を使って中央表示に設定しています。
コメント