スマホとpcで表示を変えたい時って必ずでてきますよね?
例えば広告のサイズをpcでは大きめのサイズに、スマホでは画面にはみ出すので画面の収まるサイズ
そういった、作業をするのに役立つ、使う条件分岐タグ。
このワードプレスで、スマホとpcで表示内容を変える条件分岐のタグ
<?php if(wp_is_mobile()): ?>を広告を例えて説明をすると
スマホとPCで違う広告を表示したい場合
<?php if(wp_is_mobile()): ?>
ここにスマホに表示したい広告のコードを書く
<?php else: ?>
ここにPCに表示したい広告のコードを書く
<?php endif; ?>
これで、スマホとpcで広告の内容を変えれます。
他にもスマホのみ表示させる場合は
<?php if(wp_is_mobile()): ?>
ここにスマホに表示したい広告のコードを書く
<?php endif; ?>
それと
PCのみ表示させる場合は
<?php if(!wp_is_mobile()): ?>
ここにPCに表示したい広告のコードを書く
<?php endif; ?>
これで広告をスマホとpcで変える事ができます。
因みにのタブレットはスマホに含まれています。
そしてこの条件分岐タグが必須になるのがダブルレクタングル
普通のpcで2つ横に並べてしまうと、スマホでは縦に2つ並んでしまって、ポリシー違反に!
なのでこの条件分岐タグを使い広告をだしわける
アドセンスの基本広告3つまでなのでアドセンスの場合で説明すると
1つの広告枠は普通に使って
次にスマホのみ表示させpcのアドセンス枠を1つあける
<?php if(wp_is_mobile()): ?>
ここにスマホに表示したい広告のコードを書く
<?php endif; ?>
そしてスマホとPCで違う広告を表示するタグで
<?php if(wp_is_mobile()): ?>
ここにスマホに表示したい広告のコードを書く
<?php else: ?>
ここにPCに表示したい広告のコードを書く(ダブルレクタングル)
<?php endif; ?>
これでスマホに普通に3つ
pcにダブルレクタングルを含め3つ無事貼れるわけです。
ついでにダブルレクタングルの方法
<table>
<tr>
<td>1個目のアドセンスタグ(左側)</td>
<td>2個目のアドセンスタグ(右側)</td>
</tr>
</table>
これだと、広告を枠で囲んでいやだったんで僕はこれにしてます。
<div style="float:left;width:300px;">
広告タグ1
</div>
<div style="float:left;width:300px;margin-left:10px;">
広告タグ2
</div>
<div style="clear:both;"></div>
テンプレートの違いでうまく表示されるかわかりませんが
以上が条件分岐タグとダブルレクタングルの説明でした。