Black Coffee

マサラタウンて何処よ

【Wordpress】PCとスマホの条件分岐タグ

wp_is_mobile()でPCとスマホを振り分け

htmlで作成したclass(pc,sp)でレスポンシブ対応にしていたが、
wordpressだと条件分岐で解決できる。

まずは、htmlに記述しているclass="pc",class="sp"を削除したのち

<?php if ( wp_is_mobile() ) : ?>
 // スマホ・タブレットで表示させたい内容
<?php else: ?>
 // PCで表示させたい内容
<?php endif; ?>

を記述し、htmlをそれぞれにわける。

wp_is_mobile()はタブレットも含まれるため、タブレットをPCと同じ表示にしたい時は
下記をfunction.phpに記述する

function is_mobile() {
    $useragents = array(
        'iPhone',          // iPhone
        'iPod',            // iPod touch
        '^(?=.*Android)(?=.*Mobile)', // 1.5+ Android
        'dream',           // Pre 1.5 Android
        'CUPCAKE',         // 1.5+ Android
        'blackberry9500',  // Storm
        'blackberry9530',  // Storm
        'blackberry9520',  // Storm v2
        'blackberry9550',  // Storm v2
        'blackberry9800',  // Torch
        'webOS',           // Palm Pre Experimental
        'incognito',       // Other iPhone browser
        'webmate'          // Other iPhone browser
    );
    $pattern = '/'.implode('|', $useragents).'/i';
    return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);
}

参考:WordPressでPCとスマートフォンで表示を切り替える方法【条件分岐タグ】 | Handy Web Design

wordpressってすごいペカッ