我的博客主页上有一个英雄部分，我想成为main post 之后，更多具有不同风格的帖子，请参见下面的布局：
.
我不知道如何真正做到这一点，需要一些指导，以最好的方式将其移植到WordPress中。这是我到目前为止在index.php 文件我已成功输出以下帖子hero 但不知道如何接近英雄/飞溅部分的主要岗位。
<div id="main">
<!-- hero starts here -->
<div class="hero">
<div class="hero-wrapper">
<div class="article-info">
<p class="topic"><a href="">Culture</a></p>
<h1 class="hero-title"><a href="">Title</a></h1>
</div>
</div>
</div>
<!-- Hero end here -->
<div class="main-container">
<!-- Posts starts here -->
<div class="posts">
<div class="posts__post">
<article>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<a class="posts__post--preview" href=""><img src="https://placeimg.com/470/310/tech" /></a>
<a class="posts__post--tag" href=""><p>Motivation</p></a>
<a class="posts__post--title" href="" ><h1>A Good Autoresponder, some more text here</h1></a>
<p class="posts__post--meta"> 10 days ago</p>
</article>
<?php endwhile; else : ?>
<p><?php _e( \'Sorry, no posts matched your criteria.\' ); ?></p>
<?php endif; ?>
</div>
</div>
<!-- Posts ends here -->
<!-- Main ends here -->
Things i\'m thinking about:
<如果我添加一个新的主帖子会怎么样？之前的帖子会被推到下面吗
SO网友:Krystian Kupiec
下面的代码循环浏览帖子，找到ID==1的帖子，然后打印出来。第二个循环显示最近的6个帖子（由于if阻塞，英雄帖子将不再显示）
<div id="main">
<!-- hero starts here -->
<?php
global $post;
$args = array("posts_per_page" => -1);
$the_query = new WP_Query($args);
while ( $the_query->have_posts() ) : $the_query->the_post();
if ($post->ID == 1 ): ?>
<div class="hero">
<div class="hero-wrapper">
<div class="article-info">
<p class="topic"><a href=" ">Culture</a></p>
<h1 class="hero-title"><a href="">Hero post: <?php the_title(); ?></a></h1>
</div>
</div>
</div>
<?php endif; ?>
<?php endwhile;
wp_reset_postdata(); ?>
<div class="main-container">
<!-- Posts starts here -->
<div class="posts">
<div class="posts__post">
<?php $args = array("posts_per_page" => 6);
$the_query = new WP_Query($args);
while ( $the_query->have_posts() ) : $the_query->the_post();
if($post->ID !== 1): ?>
<article>
<a class="posts__post--preview" href=" "><img src="<?php the_post_thumbnail_url(); ?>"></a>
<a class="posts__post--title" href="" ><h2>Non hero: <?php the_title(); ?></h2></a>
<p class="posts__post--excerpt"><?php the_excerpt(); ?></p>
<?php echo "<p>post ID: " . $post->ID . "</p>"; ?>
</article>
<?php endif;
endwhile; ?>
</div>
</div>
</div>
</div>
抱歉，我误解了你的问题，现在应该可以了。P、 S.2您不应该编辑“index.php”文件，如果您想这样做，请阅读有关模板层次结构等的有用方案：
SO网友:cjbj
如果您使用sticky 功能，允许您标记一个或多个要向上推堆栈的帖子。通过管理员中的复选框，您可以确定哪个帖子必须是“英雄”。
然后使用一个简单的循环输出所有帖子。当你添加新帖子时，粘胶条也将始终保持在顶部。
如果您设置width:100%; 在贴子上贴上贴纸width:48%; float:left; 在其他帖子上，您拥有所需的设置。
使现代化
如果希望将html部分分开，则需要一个不同的循环，只返回第一篇粘性文章，如下所示(docs):
$sticky = get_option( \'sticky_posts\' );
$query = new WP_Query( array( \'p\' => $sticky[0] ) );
if ( $query->have_posts() ) {
while ( $query->have_posts() ) {
$query->the_post();
... do loop stuff ..
}
wp_reset_postdata(); // resetting for the main query
}
SO网友:Andy Macaulay-Brook
标准的主页循环将把任何粘性帖子放在第一位，因此您可能不需要为英雄帖子使用特殊的HTML，只需要针对它的CSS。
此代码位于插件或函数中。php将确保只有一篇文章是粘性的：
add_action( \'post_stuck\', \'wpse239911_only_one_sticky\' );
function wpse239911_only_one_sticky( $post_id ) {
remove_action( \'post_stuck\', \'wpse239911_only_one_sticky\' );
// prevent loop
delete_option( \'sticky_posts\' );
stick_post( $post_id );
}
每当帖子被设置为粘滞状态时，该函数就会启动，清除粘滞帖子列表，然后再次将触发该操作的帖子设置为粘滞状态。
删除操作可确保调用stick_post 不会让我们陷入永恒的深渊。
