最新情報 & コラム
WordPressのカスタム投稿でPCとスマートフォンの表示件数を変える方法
ALLWeb制作
WordPressでレスポンシブデザインのホームページを制作する場合、特定のカスタム投稿でPCとスマートフォンで投稿の表示件数を変える方法をご紹介します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <?phpif( wp_is_mobile() ){ $num = 20;} else { $num = 30;} $args = array( 'paged' => $paged, 'post_type' => 'ポストタイプ', 'posts_per_page' => $num, ); $my_query = new WP_Query($args); if ($my_query->have_posts()) : while ($my_query->have_posts()) : $my_query->the_post();?><div><a href="<?php the_permalink(); ?>"><div>//表示したい内容</div></a></div><?php endwhile; ?></div><?php wp_reset_query();endif; ?><?php if(function_exists('wp_pagenavi')) wp_pagenavi(array('query' => $my_query));?> |
上記はスマホとタブレットを判別しない場合です。
関数リファレンス/wp is mobile
スマホとタブレットを判別する場合はis_mobile()を使用します。
functions.phpに以下のコードを追記
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | 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']);} |
これでis_mobileがtureの時はスマートフォン、falseの時はタブレットとPCという判別ができます。
1 2 3 4 5 | if(is_mobile()){ //スマートフォンの時}else{ //タブレット or PCの時} |
