WordPressの条件分岐でスマートフォンとタブレットを分ける方法

前回WordPressにアドセンスを設置する方法を紹介しましたが、条件分岐を使って「スマートフォン」と「PC」の表示を分けながら設置しました。

しかしながら前回紹介した「wp_is_mobile」という関数を使って条件分岐すると「PCページ」と「スマートフォン&タブレット」という分け方になってしまいます。

タブレットって横幅があるのでタブレットでの表示はPCと同じにしたい！という訳でスマートフォンとタブレットを分ける条件分岐をしていこうと思います。結果的に「PC&タブレット」と「スマートフォン」に分ける条件分岐にするって事です。

Amazonや楽天のアフィリエイトは「もしもアフィリエイト経由」がおすすめの理由

Amazonや楽天のアフィリエイトは認知度も高いので初心者におすすめのアフィリエイトです。 Amazonや楽天のアフィリエイトから始める方は非常に多いので...

affiliate150.com

2019.12.31

functions.phpで新しい条件分岐を作る

子テーマのfunctions.phpに記述をしていきますが、テーマによっては既にこの記述はあるかもしれないので確認しておくこと（同じ記述を子テーマに記述するとエラーがでるかも）。Stinger系のテーマは既に記述されていますので不要です。

それと初めてfunctions.phpを作成する場合には注意が必要なのでこの記事を参考に。
⇒子テーマにfunctions.phpを追加する時の注意点

functions.phpに追加するのは次のコードです。

//スマホ表示分岐
function is_mobile(){
    $useragents = array(
        'iPhone', // iPhone
        'iPod', // iPod touch
        'Android.*Mobile', // 1.5+ Android *** Only mobile
        'Windows.*Phone', // *** Windows Phone
        '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']);
}

参考：【WP初心者向け】is_homeとis_mobileを使ってカスタマイズの幅を広げよう！｜Naifix

この記述で「is_mobile」という関数を作成してモバイル端末には「iPhone」「Android」「iPod」・・・を含めるという設定をしておきます。これで準備はOK。

後は前回アドセンスの設置で利用した「wp_is_mobile」という部分を「is_mobile」に修正すれば「PC&タブレット」と「スマートフォン」を分けることができるという訳です。

例えばこういう条件分岐。

<?php if ( wp_is_mobile() ) : ?>
  // モバイル用コンテンツ
<?php else: ?>
  // PC用コンテンツ
<?php endif; ?>

これの「wp_is_mobile」という部分を「is_mobile」に修正してこんな感じにする訳ですね。

<?php if (is_mobile()) : ?>
  // スマートフォン用コンテンツ
<?php else: ?>
  // PC・タブレット用コンテンツ
<?php endif; ?>

これで修正は完了。PCとタブレットで同じ広告が表示されて、スマートフォンと分けることができます。

• ⇒Googleアドセンスの始め方。申請や審査から設置までのまとめ
• ⇒アフィリエイトで稼ぐ方法まとめページ
• ⇒初心者でも迷わないWordPressの始め方や使い方まとめ！