如何在Wordpress / PHP的同一循环中显示2列数据

时间:2019-03-14 06:38:22

标签: php wordpress

我想在WordPress中发布while循环,前1个帖子将显示在bootstrap的6列中,而6个帖子将显示在Bootstrap 6列中。我的代码

   <div class="row">
        <div class="col-xl-6">
            <div class="single-large-post">
                <div class="slp-thumb">
                    <a href=""><img src="<?php echo get_template_directory_uri();?>/img/image-32231-1551194958-660x400.jpg" alt=""></a>
                </div>
                <div class="slp-text">
                    <h3 class="large-post-title"><a href="">রাজধানীতে নারীদের জন্য অ্যাপভিত্তিক পরিবহন সেবা</a></h3>
                    <div class="large-post-content">
                        <p>নির্দিষ্ট সময়ে ও নির্দিষ্ট রুটে পিক-আপ এবং ড্রপ-অফ সেবা প্রদান করছে শাটল। সকাল সাড়ে ছয়টা থেকে শুরু<a href=""> বিস্তারিত</a></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-6">
            <!--single-mini-post-start -->
            <div class="single-mini-latest-post">
                <div class="sml-post-thumb">
                    <a href=""><img src="<?php echo get_template_directory_uri(); ?>/img/oscar-2019.jpg" alt=""></a>
                </div>
                <div class="sml-post-text">
                    <h5><a href="">৯১তম অস্কারের ইতিবৃত্ত</a></h5>
                    <p><span>February 27 2019</span></p>
                </div>
            </div>
            <!--single-mini-post-end -->
        </div>
    </div>

我已经尝试过这种方式,并且一直在使用jQuery,但是没有用

$(".cb-news-list-2nd-design").first().insertBefore('<div class="col-xl-6 amar">');
$(".cb-news-list-2nd-design").last().after('</div>');

我已经尝试过这种循环

<div class="row"> 

    <?php 
    $i = 0;
    $news_paper_cat = new WP_Query(array(
        'post_type'         => 'post',
        'posts_per_page'    => 6
    ));
    if($news_paper_cat->have_posts()) : while($news_paper_cat->have_posts()) : $news_paper_cat->the_post();
        $i++;
    ?>
    <?php if($i ==1) : ?>
    <div class="col-xl-6">
        <div class="single-large-post"> 
            <div class="slp-thumb"> 
                <a href=""><img src="<?php echo get_template_directory_uri();?>/img/image-32231-1551194958-660x400.jpg" alt=""></a>
            </div>
            <div class="slp-text"> 
                <h3 class="large-post-title"><a href="">রাজধানীতে নারীদের জন্য অ্যাপভিত্তিক পরিবহন সেবা</a></h3>
                <div class="large-post-content"> 
                    <p> সকাল সাড়ে ছয়টা থেকে শুরু1 <a href=""> বিস্তারিত</a></p>
                </div>
            </div>
        </div>
    </div>
    <?php else : ?>                             
        <!--single-mini-post-start -->
        <div class="single-mini-latest-post cb-news-list-2nd-design"> 
            <div class="sml-post-thumb"> 
                <a href=""><img src="<?php echo get_template_directory_uri(); ?>/img/oscar-2019.jpg" alt=""></a>
            </div>
            <div class="sml-post-text"> 
                <h5><a href="">৯১তম অস্কারের ইতিবৃত্ত</a></h5>
                <p><span>February 27 2019</span></p>
            </div>
        </div>
        <!--single-mini-post-end -->

<?php endif; endwhile; endif; ?>
</div>

在每个帖子中,都会进行6列引导,例如: 这是屏幕截图http://prntscr.com/mw58t0

我想这样发生

http://prntscr.com/mw59o3

2 个答案:

答案 0 :(得分:1)

这可能不是最好的方法,但是我建议您进行两个循环。第一个循环仅显示一个帖子,而第二个循环则在查询参数中添加“'offset'=> 1”以跳过一个帖子。只是一个建议:)

答案 1 :(得分:0)

尝试在while循环中使用增量变量来分隔块。如果变量值为1,则运行第一个块,否则运行第二个块并增加变量值。 请尝试下面的代码。

<div class="row">
    <?php
    if( $the_query->have_posts() ):
        $i = 1;
        while( $the_query->have_posts() ) : $the_query->the_post();
            if ($i == 1) :
    ?>

                    <div class="col-xl-6">
                        <div class="single-large-post">
                            <div class="slp-thumb">
                                <a href=""><img src="<?php echo get_template_directory_uri();?>/img/image-32231-1551194958-660x400.jpg" alt=""></a>
                            </div>
                            <div class="slp-text">
                                <h3 class="large-post-title"><a href="">রাজধানীতে নারীদের জন্য অ্যাপভিত্তিক পরিবহন সেবা</a></h3>
                                <div class="large-post-content">
                                    <p>নির্দিষ্ট সময়ে ও নির্দিষ্ট রুটে পিক-আপ এবং ড্রপ-অফ সেবা প্রদান করছে শাটল। সকাল সাড়ে ছয়টা থেকে শুরু<a href=""> বিস্তারিত</a></p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-6">
            <?php 
            else : 
            ?>
                        <!--single-mini-post-start -->
                        <div class="single-mini-latest-post">
                            <div class="sml-post-thumb">
                                <a href=""><img src="<?php echo get_template_directory_uri(); ?>/img/oscar-2019.jpg" alt=""></a>
                            </div>
                            <div class="sml-post-text">
                                <h5><a href="">৯১তম অস্কারের ইতিবৃত্ত</a></h5>
                                <p><span>February 27 2019</span></p>
                            </div>
                        </div>
                        <!--single-mini-post-end -->
            <?php
            endif;
        $i++; 
        endwhile;
    endif; 
    ?>
    </div>
</div>