单循环中的多列和多行中的帖子

时间:2015-01-25 作者:Nibbers

我对创建自己的主题还很陌生,我似乎陷入了困境,如果有人能帮助我,我会非常感激。我搜索并找到了一些建议,但没有找到真正符合我需要的。

Problem 1

主博客(主页)给我带来了一些问题,因为我知道一定有更好的方法来编写更高效的代码,但我无法让它跨单独的列div工作。

如果您查看下面的图像,您将看到页面当前的呈现方式以及表面上的呈现方式,一切看起来都很好,但这些都是使用多个循环的自定义帖子类型,因为每一行都是独立的。我最初尝试使用“for”循环,但我无法使其工作,因此每一行都是最后一行的延续。它要么呈现所有相同的缩略图,要么将所有帖子依次呈现(以页面上的30个小缩略图结尾)

enter image description here

任何建议都可以将其转化为更精简的代码,这将是非常棒的!

Problem 2

页面底部的“旧”导航显示的“第2页”与主页完全相同。我想为所有有旧帖子的后续页面创建一个自定义模板,但我似乎找不到如何使用其他模板。我看到了this post 了解它的工作原理,但似乎无法使主页正常工作。

Here 是显示循环1的索引页的代码,您还可以看到if语句试图为旧帖子和here 是内容中三个较小缩略图行循环的代码。php。

如果我的任何术语不太正确,我很抱歉,但希望有人知道我的意思,我真的很感谢人们抽出时间来帮助解决这个问题。

EDIT

抱歉,这是索引的代码。php

<?php get_header(); ?>
<section class="row main_content"> 
<div class="small-12 large-4 large-push-8 columns">
    <?php get_sidebar( $name ); ?>
</div>      

<div class="hero">  
    <div class="small-12 large-8 large-pull-4 columns">

        <!-- /////////////////////-Start of THE LOOP-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->
        <?php 
        $args = array( \'post_type\' => \'blog\', 
                       \'post_status\' => \'publish\',
                       \'showposts\' => 1,
                       \'&paged=\'.$paged); 
        $featuredPost = new WP_Query($args); //This is a global query

        if ($featuredPost->have_posts()) :

        while ($featuredPost->have_posts()) : $featuredPost->the_post(); 
        ?>

        <!--Start of the FEATURED post image-->
        <div class="hero_img"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a></div>
        <!--End of the FEATURED post image-->

        <div class="thumbpost-text">
            <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
            <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
        </div>
        <?php 

        endwhile; 
        else : ?>
            <p><?php _e( \'Sorry, no posts matched your criteria.\' ); ?></p>
        <?php endif;
         ?>
        <!--/////////////////////-End of THE FIRST LOOP-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->
        <?php rewind_posts(); ?>
    </div>
</div>
<!-- End of the Main image post -->

</section>


<?php 
wp_reset_query();

if ( $featuredPost->is_home() ) {
// This is a homepage
// Do your fancy loop here with extra bells and whistles
get_template_part(\'content\');       
} else {
// This is not a homepage (i.e. paginated page)
// Do a stripped down version of your loop above with no bells and whistles
}
?>


<div class="row subcontent">
<div class="small-12 medium-12 large-12 columns">
        <?php // save the original $wp_query object
        $temp = $wp_query;
        // create a new $wp_query object
        $wp_query = new WP_Query($args);
        while($wp_query->have_posts()): $wp_query->the_post();
        // output your data here
        endwhile;
        // display previous and next links
        previous_posts_link(\'Newer\');
        next_posts_link(\'Older\');
        // restore the global $wp_query object
        $wp_query = $temp; ?>

</div>
</div>

<?php get_footer(); ?>
。。。这是内容的代码。php


        <?php 
        $args = array( \'post_type\' => \'blog\', 
                       \'post_status\' => \'publish\',
                       \'showposts\' => 3,
                       \'&paged=\'.$paged,            
                       \'offset\' => 1); 
        $firstRowThumbs = new WP_Query($args);

        if ( $firstRowThumbs->have_posts() ) : while ( $firstRowThumbs->have_posts() ) : $firstRowThumbs->the_post(); ?>

        <div class="small-12 medium-4 large-4 columns"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a>
            <div class="thumbpost-text">
                <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
                <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
            </div>
        </div>
        <?php endwhile; else : ?>
            <p><?php _e( \'Sorry, no posts matched your criteria.\' ); ?></p>
        <?php endif; ?>     
        <?php rewind_posts(); ?>

    </div>
    <!--/////////////////////-End of the Top Thumbnail Row-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->

    <!--/////////////////////-Start of the Middle Thumbnail Row-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->        
    <div class="row sub_content">

        <?php 
        $args = array( \'post_type\' => \'blog\', 
                       \'post_status\' => \'publish\',
                       \'showposts\' => 3,
                       \'&paged=\'.$paged,            
                       \'offset\' => 4); 
        $secondRowThumbs = new WP_Query($args);

        if ( $secondRowThumbs->have_posts() ) : while ( $secondRowThumbs->have_posts() ) : $secondRowThumbs->the_post(); ?>

        <div class="small-12 medium-4 large-4 columns"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a>
            <div class="thumbpost-text">
                <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
                <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
            </div>
        </div>
        <?php endwhile; else : ?>
            <p><?php _e( \'Sorry, no posts matched your criteria.\' ); ?></p>
        <?php endif; ?>     
        <?php rewind_posts(); ?>

    </div>
    <!--/////////////////////-End of the Middle Thumbnail Row-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->

    <!--/////////////////////-Start of the Bottom Thumbnail Row-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->        
    <div class="row sub_content">

        <?php 
        $args = array( \'post_type\' => \'blog\', 
                       \'post_status\' => \'publish\',
                       \'showposts\' => 3,
                       \'&paged=\'.$paged,            
                       \'offset\' => 7); 
        $thirdRowThumbs = new WP_Query($args);

        if ( $thirdRowThumbs->have_posts() ) : while ( $thirdRowThumbs->have_posts() ) : $thirdRowThumbs->the_post(); ?>

        <div class="small-12 medium-4 large-4 columns"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a>
            <div class="thumbpost-text">
                <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
                <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
            </div>
        </div>
        <?php endwhile; else : ?>
            <p><?php _e( \'Sorry, no posts matched your criteria.\' ); ?></p>
        <?php endif; ?>     

    </div>
    <!--/////////////////////-End of the Bottom Thumbnail Row-\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\-->

    <?php wp_reset_postdata(); ?>       

UPDATE

在Pieter的大力帮助和建议下,我已经将首页的设置从最初的静态设置更改为正常版本,并使用了下面他回答的代码,但是我仍然存在问题,因为测试帖子12呈现了两次,这会导致行的布局变差。

UPDATE - SOLVED

Pieter帮了我无数次,这里是使事情完美运行的最终代码。请注意:函数functions.php 与下面帖子中列出的内容相同。

here is the final index.php

    <section class="row main_content"> 

        <div class="small-12 large-4 large-push-8 columns">
            <?php get_sidebar( $name ); ?>
        </div> 

        <div class="hero">  
            <div class="small-12 large-8 large-pull-4 columns">

                <?php 

                    if( have_posts() ) {

                        while( have_posts() ) {
                            the_post();

                            get_template_part( \'content\', \'home\' );

                        }
                        ?>
                        </div>
                        <div class="row sub_content">
                            <div class="small-12 large-12 columns">
                        <?php
                        previous_posts_link(\'Newer\');
                        next_posts_link( \'Older\' );
                        ?>
                            </div>
                        </div>
                        <?php

                    }else{ ?>

                        <p>
                            <?php _e( \'Sorry, no posts matched your criteria.\' ); ?>
                        </p>

                    <?php }
                ?>

    <?php get_footer(); ?>

and here is the final content-home.php

    <?php

    if( $wp_query->current_post == 0 ) { ?>

                <!--Start of the FEATURED post image-->
                <div class="hero_img"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a></div>
                <!--End of the FEATURED post image-->

                <div class="thumbpost-text">
                    <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
                    <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
                </div>

            </div>

        </div>

    </section>

    <?php  }else{//End of the Main image post


        if( $wp_query->current_post == 1 ){
            echo "<div class=row sub_content>"; 
        }
        ?>  
        <div class="small-12 medium-4 large-4 columns">
            <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a>
            <div class="thumbpost-text">
                <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
            </div>
        </div>
        <?php
        if ( $wp_query->current_post == 3 ){
            echo "</div><div class=row sub_content>";
        }

        if ( $wp_query->current_post == 6){
            echo "</div><div class=row sub_content>";
        }

    } ?>

2 个回复
最合适的回答,由SO网友:Pieter Goosen 整理而成

您可以在一个循环中完成此操作,而无需作为自定义查询。有几个聪明的函数可以让你达到目的

因此,让我们来看一个解决方案。第一件事第一。为了便于阅读和组织,我建议在这里完全分离代码。回滚中的更改content.php 并仅对所有其他模板使用此模板。为主页创建一个单独的模板,我们将其称为content-home.php.

暂时把模板放在一边,但要记住它。让我们看看索引。主页的php模板。您的大多数代码都是冗余的,不需要,因此您可以在此处删除大部分部分。您的索引。php应该看起来像

<?php get_header(); ?>

<section class="row main_content"> 

    <div class="small-12 large-4 large-push-8 columns">
        <?php get_sidebar( $name ); ?>
    </div> 

    <div class="hero">  
        <div class="small-12 large-8 large-pull-4 columns">

            <?php 

                if( have_posts() ) {

                    while( have_posts() ) {
                        the_post();

                        get_template_part( \'content\', \'home\' );

                    }

                    previous_posts_link(\'Newer\');
                    next_posts_link( \'Older\' );

                }else{ ?>

                    <p>
                        <?php _e( \'Sorry, no posts matched your criteria.\' ); ?>
                    </p>

                <?php }
            ?>

<?php get_footer(); ?>
默认情况下,自定义帖子类型不包括在主查询中,但在分类法页面和帖子类型存档页面上除外。要使您的主页显示自定义帖子类型,我们将使用pre_get_posts 将它们添加到主页。Do not 使用自定义查询执行此操作。不要放弃主查询而选择自定义查询。我已经解释过了this post, 所以一定要去读那篇文章和所有链接的文章

好,现在打开函数。php并添加以下代码。这会将您的自定义帖子类型添加到主页。(这段代码使用需要PHP 5.3+的闭包)

add_action( \'pre_get_posts\', function ( $q ) {

    if( $q->is_main_query() && $q->is_home() ) {

        $q->set( \'post_type\', \'blog\' );

    }

});
现在,您的自定义帖子类型显示在主页上,只需放置the_title(); 在里面content-home.php 您至少可以看到自定义帖子类型帖子的标题

现在,让我们回到content-home.php. 您可以在此处使用内置循环计数器,可以通过$wp_query->current_post, 记住,这个计数器从0

我从您的答案中提取了您的代码作为快速参考,并将其与您的content-home.php. 以下是您的content-home.php 应该看起来像

<?php

if( $wp_query->current_post == 0 ) { ?>

            <!--Start of the FEATURED post image-->
            <div class="hero_img"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a></div>
            <!--End of the FEATURED post image-->

            <div class="thumbpost-text">
                <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
                <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
            </div>

        </div>

    </div>

</section>

<?php  }else{//End of the Main image post


    if( $wp_query->current_post == 1 ){
        echo "<div class=row sub_content>"; 
    }
    ?>  
    <div class="small-12 medium-4 large-4 columns">
        <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a>
        <div class="thumbpost-text">
            <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
            <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
        </div>
    </div>

    <?php
    if ( $wp_query->current_post == 3 ){
        echo "</div><div class=row sub_content>";
    }

    if ( $wp_query->current_post == 6){
        echo "</div>";
    }

} ?>
这应该足以让一切正常运转。根据需要扩展和修改

从您的评论中编辑,对于静态首页,事情看起来会有点不同。pre_get_posts 不会在静态首页或页面模板上工作,因此您可以从函数中删除该部分。php。这就是为什么在你的问题中提供正确的信息是如此重要。

这里需要使用自定义查询。在用于静态首页的模板中,粘贴以下代码(我在这里做了一些额外的更改,以适应样式问题

<?php get_header(); ?>

<section class="row main_content"> 

    <div class="small-12 large-4 large-push-8 columns">
        <?php get_sidebar( $name ); ?>
    </div> 

    <div class="hero">  
        <div class="small-12 large-8 large-pull-4 columns">

            <?php 
                //THE LOOOP
                $paged = get_query_var( \'page\' ) ? get_query_var( \'page\' ) : 1;

                $args = array( 
                    \'post_type\' => \'blog\', 
                    \'paged\' => $paged,
                    \'posts_per_page\' => 12
                ); 
                $q = new WP_Query($args);

                if( $q->have_posts() ) {

                    while( $q->have_posts() ) {
                        $q->the_post();

                        get_template_part( \'content\', \'home\' );

                    }

                    previous_posts_link(\'Newer\');
                    next_posts_link( \'Older\', $q->max_num_pages );

                    wp_reset_postdata();

                }else{ ?>

                    <p>
                        <?php _e( \'Sorry, no posts matched your criteria.\' ); ?>
                    </p>

                <?php }
            ?>

<?php get_footer(); ?>
记住,静态首页使用pagepaged 对于[paged][2] 参数

至于样式问题,我从您的答案中复制了一些内容,因此可能存在问题。在中尝试以下操作content-home.php

<?php

if( $q->current_post == 0 ) { ?>

            <!--Start of the FEATURED post image-->
            <div class="hero_img"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a></div>
            <!--End of the FEATURED post image-->

            <div class="thumbpost-text">
                <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
                <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
            </div>

        </div>

    </div>

</section>

<?php  }else{//End of the Main image post


    if( $q->current_post == 1 ){
        echo "<div class=row sub_content>"; 
    }
    ?>  
    <div class="small-12 medium-4 large-4 columns">
        <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a>
        <div class="thumbpost-text">
            <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
            <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
        </div>
    </div>

    <?php
    if ( $q->current_post == 3 ){
        echo "</div><div class=row sub_content>";
    }

    if ( $q->current_post == 6){
        echo "</div>";
    }

} ?>

SO网友:Nibbers

好的,我在小缩略图上的多个循环方面取得了重大突破,并设法找到了问题1的答案。我现在只需要帮助回答问题2!

以下是一个循环中缩略图行的更新代码:

<?php 
    $paged = (get_query_var(\'paged\')) ? get_query_var(\'paged\') : 1;
    $args = array( \'post_type\' => \'blog\', 
                   \'post_status\' => \'publish\',
                   \'showposts\' => 9,
                   \'paged\' => $paged,           
                   \'offset\' => 1); 
    $rowThumbs = new WP_Query($args);
    $myLoop = 0;    

    if ( $rowThumbs->have_posts() ) : 

    while ( $rowThumbs->have_posts() ) : $rowThumbs->the_post(); $myLoop++ ?>
        <?php 
        if($myLoop == 1){
            echo "<div class=row sub_content>"; 
        }
        ?>  
        <div class="small-12 medium-4 large-4 columns">
            <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(\'blog-featured-img\'); ?></a>
            <div class="thumbpost-text">
                <h2 class="thumbpost-titles"><a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a></h2>
                <p class="thumbpost-tags"><?php the_tags( "", ", ", "" ); ?></p>
            </div>
        </div>

        <?php
        if ($myLoop == 3){
            echo "</div><div class=row sub_content>";
        }
        if ($myLoop == 6){
            echo "</div>";$myLoop=0;
        }
    wp_reset_postdata(); 
    ?>

    <?php 
    endwhile; 
    else : ?>
        <p><?php _e( \'Sorry, no posts matched your criteria.\' ); ?></p>
    <?php endif; ?>     

    </div>

结束

相关推荐

CPT while loop not working

我无法从while循环中获得任何东西:<ul> <?php $query_args = array( \'post_type\' => \'Smart panels\', \'posts_per_page\' => 5, \'orderby\' => \'meta_value_num\', \'meta_key\' => \'post_v