WordPressでPCとスマホを切り替える方法

2020.12.082021.08.27

悩んでいる人

PCとスマホで別の表示をさせたいの。助けて

本記事では、WordPressでPCとスマホの表示を変える方法についてご紹介します。

依頼を受けた内容

先日このような依頼を受けました。

悩んでいる人

WordPressで投稿数をPCの時は9件表示で、スマホの時は3件表示にさせたいの。

一緒にしてくれよと思いながら、調べると便利な関数がありました。

wp_is_mobile()を使えば、簡単に上記の依頼を解決してくれます。

実装したコード

<?php
      if (wp_is_mobile()) {
        $posts_per_page = 3;
      } else {
        $posts_per_page = 9;
      }
      $args = array(
        'post_type' => 'post',
        'posts_per_page' => $posts_per_page,
        'orderby' => 'date',
        'order' => 'ASC'
      );

      $the_query = new WP_Query($args);
      if ($the_query->have_posts()) :
        while ($the_query->have_posts()) : $the_query->the_post();
?>

条件文としては、もしもスマホで見るときには3件表示、それ以外は9件表示となります。

※タブレットはPC扱いになります。

タブレットをスマホ扱いにするには、is_mobile()という条件分岐タグを定義する必要があるようですね。