前提・実現したいこと
ページネーションとSNSシェアボタンの位置を変更したい。
発生している問題・エラーメッセージ
エラーは出ていないです。 PCで表示する時は画面サイズが大きいので違和感がないのですが、 スマホで表示すると表示され方が変わるので、 メインページ⇒サイドバー⇒ページネーション&SNSシェアボタンの順になってしまいます。 なお、該当のソースコードはページネーションについての方です。 ※SNSシェアボタンの方は別でコードがありますが、根本は同じなのでここには載せてないです。
該当のソースコード
<?php if($abc_theme_option['blog_sidebar_position']=='right'): ?> <?php if($abc_theme_option['layout_section_post_one_column']==false): ?> <div class="col-md-4 col-sm-4 col-xs-12 <?php echo esc_attr($abc_theme_sidebar); ?>" > <?php get_sidebar(); ?> </div> <?php endif; ?> <?php endif; ?> <?php $paged = (get_query_var('page')) ? get_query_var('page') : 1; $args = array( 'posts_per_page' => 10, 'paged' => $paged, 'post_type' => array( 'post', ), ); $the_query = new WP_Query($args);?> <?php if ($the_query->have_posts()) :while ($the_query->have_posts()): $the_query->the_post(); ?> <?php endwhile; endif; ?> </dl> <?php if(function_exists('wp_pagenavi')) { wp_pagenavi(array('query'=>$the_query)); } ?> <?php wp_reset_postdata(); ?> /* Wp-Pagenavi */ .wp-pagenavi { clear: both; text-align:center; } .wp-pagenavi a, .wp-pagenavi span { color: #fff; background-color: #1C181A; border: 1px solid #1C181A; padding: 5px 12px; margin: 0 2px; white-space: nowrap; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; text-align: center; text-decoration: none; } .wp-pagenavi a:hover{ color: #FFF; background-color: #9400d3; border-color: #9400d3; } .wp-pagenavi span.current{ color: #777; background-color: #CFD5DA; border-color: #CFD5D; font-weight: bold; }
試したこと
「get_sidebar()」の前にページネーションのコードを移動させてみましたが、 そうするとスマホでは違和感なく表示されますが、PCで見たときにサイドバーが下の方に押しやられます。
補足情報(FW/ツールのバージョンなど)
ここで質問させていただく前にいろいろ調べてトライしましたが解決しないため、 質問させていただいております。よろしくお願い致します。
あなたの回答
tips
プレビュー