如何创建第一篇文章,第五篇文章全角,三列中的其余内容,依此类推

我是Wordpress开发的新手, 正在学习如何从头开始制作主题。我不想使用任何插件来实现这一目标。
如何创建第一篇文章/第五篇文章/第九篇文章全宽, 其余三列, 依此类推。
我尝试了这个, 但第一篇文章不再重复

< ?php get_header() ?> < div class="container-fluid"> < div class="row"> < ?php $i = 0; while ( have_posts() ) : the_post(); ?> < ?php if ($i++ == 0) : ?> < div class="col-sm-12 blog"> < div class="row"> < div class="col-sm-8 p-0"> < ?php the_post_thumbnail()?> < /div> < div class="col-sm-4 align-self-center"> < div> < h3> < ?php the_title()?> < /h3> < /div> < div> < ?php the_excerpt()?> < /div> < /div> < /div> < /div> < ?php else: ?> < div class="col-sm-4 blog py-3"> < ?php the_post_thumbnail()?> < div> < h3> < ?php the_title()?> < /h3> < /div> < div> < ?php the_excerpt()?> < /div> < /div> < ?php endif; ?> < ?php endwhile ?> < /div> < /div> < ?php get_footer() ?>

在这里找到我的屏幕
#1你的文字不是很清楚, 但我假设你想拥有1个大职位和3个小职位模式。
为此, 你需要告诉你的代码第一个, 或者当帖子编号除以4而其余为0时, 帖子应该很大。
代码如下:
< ?php get_header() ?> < div class="container-fluid"> < div class="row"> < ?php $i = 0; while ( have_posts() ) : the_post(); ?> < ?php if ($i == 0 || $i % 4 == 0) : ?> < div class="col-sm-12 blog"> < div class="row"> < div class="col-sm-8 p-0"> < ?php the_post_thumbnail()?> < /div> < div class="col-sm-4 align-self-center"> < div> < h3> < ?php the_title()?> < /h3> < /div> < div> < ?php the_excerpt()?> < /div> < /div> < /div> < /div> < ?php else: ?> < div class="col-sm-4 blog py-3"> < ?php the_post_thumbnail()?> < div> < h3> < ?php the_title()?> < /h3> < /div> < div> < ?php the_excerpt()?> < /div> < /div> < ?php endif; ?> < ?php $i++; endwhile ?> < /div> < /div> < ?php get_footer() ?>

#2【如何创建第一篇文章,第五篇文章全角,三列中的其余内容,依此类推】希望对你有帮助。
< ?php get_header() ?> < div class="container-fluid"> < div class="row"> < ?php $i = 0; while ( have_posts() ) : the_post(); ?> < ?php if ($i % 4 == 0) : ?> < div class="col-sm-12 blog"> < div class="row"> < div class="col-sm-8 p-0"> < ?php the_post_thumbnail()?> < /div> < div class="col-sm-4 align-self-center"> < div> < h3> < ?php the_title()?> < /h3> < /div> < div> < ?php the_excerpt()?> < /div> < /div> < /div> < /div> < ?php else: ?> < div class="col-sm-4 blog py-3"> < ?php the_post_thumbnail()?> < div> < h3> < ?php the_title()?> < /h3> < /div> < div> < ?php the_excerpt()?> < /div> < /div> < ?php endif; ?> < ?php $i++; endwhile ?> < /div> < /div> < ?php get_footer() ?>

    推荐阅读