WordPress PCとスマホで表示を切り替える
PCでは記事一覧5件、スマホでは3件表示するようにしたいです。
条件分岐タグを使って、PCとスマートフォンで記事の一覧表示を切り替える方法がうまくいきませんでした。
https://handywebdesign.net/2017/11/wp-is-mobile/
改造前のコード（問題なく表示できました）
<ul>
<?php
$latest_posts = get_posts( array(
'posts_per_page' => 5, // 表示する記事の数
'category_name' => '投稿ID',// 投稿IDを取得
'fields' => 'ids',
) );
foreach( $latest_posts as $post ):
setup_postdata( $post );
if( has_post_thumbnail() ) {
$post_thumb = get_the_post_thumbnail( '', 'post_thumbnail' ); // アイキャッチがあるときはアイキャッチを表示
} else {
$post_thumb = '<img src="' . get_template_directory_uri() . '/img/noimage.gif" width="100" height="100" alt="デフォルト画像" />'; // アイキャッチがないときは《noimage.gif》を表示
}
$post_categories = get_the_category(); // カテゴリーを取得
$post_content = wp_trim_words( get_the_content(), 30, '…' ); // 30字分を抜粋
?>
<li <?php post_class(); ?>>
<a href="<?php the_permalink(); ?>">
<div class="blogListimg">
<?php echo wp_kses_post( $post_thumb ); ?>
</div>
<!-- アイキャッチここまで -->
<p class="post-time blogDt"><?php the_time('Y.m.d'); ?></p>
<p class="post-categories blogCt"><?php echo esc_html( $post_categories[0]->name ); ?></p>
<h3 class="post-title"><?php the_title(); ?></h3>
<p class="post-content blogBf"><?php echo esc_html( $post_content ); ?></p>
</a>
</li>
<?php
endforeach;
wp_reset_postdata();
?>
</ul>
PCとスマートフォンで記事の一覧表示を切り替えるコード
参考サイトを参考にfunctions.phpにfunction is_mobile() コードを追加。
トップページのphpに以下を改造。
<?php if ( is_mobile() ) : ?>
<?php
$latest_posts = get_posts( array(
'posts_per_page' => 5, // 表示する記事の数
'category_name' => '投稿ID',// 投稿IDを取得
'fields' => 'ids',
) );
foreach( $latest_posts as $post ):
setup_postdata( $post );
・
・
・
<?php else: ?>
<?php
$latest_posts = get_posts( array(
'posts_per_page' => 3, // 表示する記事の数
'category_name' => '投稿ID',// 投稿IDを取得
'fields' => 'ids',
) );
foreach( $latest_posts as $post ):
setup_postdata( $post );
・
・
・
<?php
endforeach;
wp_reset_postdata();
?>
</ul>
結果は真っ白になってしまいました。
HTMLソースも真っ白です。
空白はSublime Textのテキストエディターを使っていますので、確認しております。
どこが違うか、教えてくださいますか？
よろしくおねがいします。
