web-dev-qa-db-ja.com

サイドバーをテンプレートに追加すると、サイドバーと同じサイズの水平方向の間隔が作成されます。

私は自分自身でこれを理解しようとして自分を殺してきました。そして私の人生のために私は私の問題を引き起こしているものを把握することはできません。

紹介ページ用のテンプレートを作成し、コンテンツを入力するためにカスタム投稿タイプを使用しました。私がサイドバーを追加するまですべてが素晴らしく見えます、それからそれは最初の紹介文と2番目のものの間にサイドバーの長さの大きなギャップを作り出します。それからフォーマットを開始し、それぞれの間に正しいスペースを入れて表示します。

HTMLできれいに見せることはできますが、一度ワードプレスに取り込むと正しくフォーマットしたくありません。これを引き起こす可能性があるものについての任意のアイデア?よろしくお願いします。

スクリーンショット:1つ目は、 "作業中"のhtmlページです。2つ目は、wordpressページのギャップがあるように見えるものです。

screenshot of html

screenshot of wordpress

get_header();
 ?>
 <?php $loop = new WP_Query ( array ( 'post_type' => 'testimonials', 'orderby' => 'post_id', 'order' => 'ASC') ); ?>
    <?php while ( $loop->have_posts() ) : $loop->the_post() ?>
    <section>
      <div class="container">
        <div class="row">
          <div class="col-12 col-md-8">
            <!-- Testimony -->
            <div class="row testimonials">
              <div class="col-10">
                <h5>
                  <?php the_content(); ?>
                  <cite>&mdash; <?php the_title();?></cite>
                </h5>
              </div>
            </div>
          </div>
          <div class="col-md-4">
            <?php get_sidebar(); ?>
          </div> <!-- col -->
        </div> <!-- row-->
      </div> <!-- container -->
    </section>
 <?php endwhile;wp_reset_query(); ?>
 <?php get_footer();
1
LBos11

ループ内のget_sidebar()が問題を引き起こしていると思います。ループの外側にあるはずです。

今のように、一つの投稿が表示され、それからサイドバーのものを表示するget_sidebar()コードを呼び出し、そしてループは次の投稿に続きます。

get_sidebar()をループの外側に移動します。

0
Rick Hellewell

それで、これは私がそれを私が望んだ方法のように機能させるためにそれを変更したコードです:) Rickに感謝します!

get_header();
 ?>

 <div class="container">
        <div class="row">
            <main class="col-md-8">

        <?php $loop = new WP_Query ( array ( 'post_type' => 'testimonials', 'orderby' => 'post_id', 'order' => 'ASC') ); ?>

           <?php while ( $loop->have_posts() ) : $loop->the_post() ?>
            <div class="testimonials">
             <h5>
               <?php the_content(); ?>
               <cite>&mdash; <?php the_title();?></cite>
             </h5>
             </div>
             <?php endwhile;wp_reset_query(); ?>

            </main>

            <!-- SIDEBAR
            ================================================== -->
            <aside class="col-md-4">
                <?php get_sidebar(); ?>
            </aside>
        </div><!-- #primary -->
    </div><!-- .container -->

 <?php get_footer(); ?>
0
LBos11