Taka's Life

Mac、iPhoneを中心としたTAKAの雑記帳

今日の人気記事

【WordPress】is_mobileを使ってスマホとPC表示を分ける方法

      2015/02/15

Stinger5 01 20150123 223446

TAKA(@TakasLife)です。

STINGER5でウィジェットを好きな場所へ追加する方法を書きました。このブログのヘッダー下に「今日の人気記事」を表示させています。

これは「WordPress Popular Posts」というプラグインを使用し表示ささせていますが、スマホでは3個の表示・それ以外では5個表示させています。

WordPressでは「is_mobile」という関数を使うことで簡単にスマホとそれ以外での表示を分けることが出来ます。今回はその方法をご紹介します。

スポンサーリンク

モバイル表示用のウィジェットを追加

前回の記事のfunction.phpへスマホ表示用のウィジェットを追加する枠を1つ追加します。

上記のように追記、修正してください。

今回追加した6個目のウィジェットへ追加したプラグインがスマホで表示されるようになります。

is_mobileを使うための準備

function.phpに下記をコピペしてください。

ちなみにSTINGER5は最初から設定されています。

is_mobileを使ってみよう

is_mobileは下記のように使います。

実際の使い方

私はこのように使っています。

「今日の人気記事」をこの様にスマホとPCで振り分けしています。各ウィジェットにはそれぞれに「WordPress Popular Posts」を入れて、

      
  • スマホ表示用:3記事表示
  • タブレット・PC表示用:5記事表示

となるように設定しています。

Is mobile 01 20150124 230144

よって、この様にスマホでは3記事表示に

Is mobile 01 20150124 231259

タブレットやPCで5記事表示になります。

さいごに

is_mobileはとっても便利な条件分岐タグです。私のブログではAdSense広告の出し分けにも使っています。覚えるととっても便利なタグですよ。

 - テーマカスタマイズ , ,

スポンサーリンク

  関連記事