前提・実現したいこと
ワードプレスでレスポンシブ対応のキャストの一覧表を作っています。
現在
http://creatornote.nakweb.com/wp-pagenavi_archive/
のブログを参考に
wp_pagenavi プラグインを入れて、カスタム投稿タイプkrc_castのページャー設置まではできたのですが、
パソコンで表示される件数
スマホで表示される件数
を別にしたいと思います。
具体的には
パソコンで表示される件数は件数設定なし
スマホで表示される件数20件程度
スマホの場合は20件以降はgoogleモバイルページのようにページネーションではなく無限スクロールにしたいと考えています。
無限スクロールはinfinite-scrollを実装したいと考えていますが、それができるのかどうかも知識不足で判断が付きません。
無限スクロールをするにもまずはページを分けることが必要なのではないかと思い、wp_pagenavi プラグインを入れ件数毎に「次へ」を表示させている格好です。
ご教授お願い致します。
発生している問題・エラーメッセージ
該当のソースコード
<div class="cssgrid"> <?php $args = array( 'paged' => $paged, 'post_type' => 'krc_cast', 'posts_per_page' => 50, ); $my_query = new WP_Query($args); if ($my_query->have_posts()) : while ($my_query->have_posts()) : $my_query->the_post(); ?> <div class="item"> <?php $cast_fields = get_post_custom(); //カスタムフィールドを全部取得 $cast_screens = json_decode( $cast_fields[ '_krc_cast_screens' ][ 0 ] ); //画像配列を用意 $cast_type_terms = get_the_terms( $post->ID, 'krc_type' ); //タイプタクソノミーを取得 $cast_grade_terms = get_the_terms( $post->ID, 'krc_grade' ); //グレードタクソノミーを取得 $cast_new_terms = get_the_terms( $post->ID, 'krc_new' ); //新人区分タクソノミーを取得 ?> <a href="<?php the_permalink(); ?>"> <div> <div><img src="<?PHP echo esc_url($cast_screens[0]); ?>" alt="<?php echo esc_html($cast_fields['_krc_name'][0]); ?> "/> </div> <div> <?php echo esc_html($cast_fields['_krc_name'][0]); ?> <?php echo esc_html($cast_fields['_krc_age'][0]); ?>歳</div> <div> <?php if ( attend_schedule(get_the_ID()) ) : ?>本日出勤中 <?PHP endif; ?> </div> <div><span class="tbwh">T<?php echo esc_html($cast_fields['_krc_tall'][0]); ?>B<?php echo esc_html($cast_fields['_krc_bust'][0]); ?>(<?php echo esc_html($cast_fields['_krc_cups'][0]); ?>)W<?php echo esc_html($cast_fields['_krc_waist'][0]); ?>H<?php echo esc_html($cast_fields['_krc_hips'][0]); ?></span> </div> <div> <?php echo esc_html($cast_type_terms[0]->name); ?> </div> <div> <?php echo esc_html($cast_grade_terms[0]->name); ?> </div> <div> <?php echo esc_html($cast_new_terms[0]->name); ?> </div> <?php singlecalendar2(get_the_ID()); //スケジュール表示 ?> </div> </a> </div> <?php endwhile; ?> </div> <!-- .グリッドレイアウト終了タグ追加 在籍--> <?php wp_reset_query();endif; ?> <?php if(function_exists('wp_pagenavi')) wp_pagenavi(array('query' => $my_query));?>
試したこと
補足情報(FW/ツールのバージョンなど)
元はTCD様のテーマファイルです。
http://tcdwp.info/tcd056/
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/10/29 00:25