アドセンス広告を横2列に表示する

a-02

記事の下にアドセンス広告などを横2列に並べているサイトを結構見かけますよね。我がブログもやっているのですが、どうやらクリック効果が期待できると言う嘘か誠か分かりませんが、アドセンス広告はクリック保証型なので一応試してみています。

横に並べて表記することを【ダブルレクタングル】と言うそうな。

表示させる方法を考えてみたが、子テーマの個別ページ【single.php】に直接記入するのはいいとして、それでは縦に表示されてしまう・・・

やはりスタイルシートの記述が必要で、半端者の私にはよくわからない。試行錯誤の末、Google先生を頼る事にしました。

スポンサーリンク

テーブルタグを使う

おお!これは楽・・・だ??

ん?

私が貼ろうとしているのは、アドセンス広告なので、これはまずい。

レスポンシブなテンプレートなので、ブラウザを縮めるとサイドバーのコンテンツに重なってしまう。これは規約違反!

私の環境では、思いっきり突き刺さってしまう・・・ なんてこったい

スマホで見ても表は表なのでそのまま横並びで表記される。まあ、スマホだけ条件分岐させて別の広告を貼ればいいだけなのだが・・・

アドセンスには向かないと判断、別の方法を探すことにしました。

一応こんな感じで、任意の場所に貼ればいいだけ。

後は表の枠線を白くするなりするだけで完成。ノンレスポンシブなら良いかもね。

single.phpとスタイルシートを使う

やはりこの方法が安心かな?

Google先生の向こう側にはちゃんとした先生たちがいますね。感謝です。

人によっては【single.php】以外で使いたいかも知れないが、私は記事直下に使用したいので、そのことを前提に書いて行く。

<nav class=”nav-single”>を探してその上に記述する

これは、記事の下にあるページ送りの直上に広告を配置したいからです。

設置していく

まずは、【single.php】から

これで、OKなはずです。PCの場合は2つの広告、スマホは1つの広告になります。

タブレットには対応したやり方ではありません。タブレットだと広告1つになるはずです。これも条件分岐できますが、現在はやっておりませんので、割愛。

スタイルシートで調整

このままでは、広告が縦並びなので、横並びにしていきたいと思います。

これで、完成・・・なはず。

と言うのは、chromeで見るときちんと横並びであるが、他のブラウザで見てみると、縦のまま・・・

修正する気はありません。縦2つでも効果が高いそうなのでそのままにしておきます。面倒になっただけなんだけどね。

関連記事のプラグイン【Yet Another Related Posts Plugin】を入れていると、関連記事下になってしまうが、設定で、自分でコードを挿入できるので、入れ替えは可能。自作できれば自作の方が良いんだけどね。

スポンサーリンク

シェアする

フォローする

スポンサーリンク