如何在wordpress頁面上以不同格式顯示第一篇文章？

Question

我希望我的第一篇文章有​​不同的風格，並且位於當前文章的上方。我只喜歡在定製風格的設計中獲得第一篇文章，其餘的文章就像以前一樣。頂帖寬度將爲1188px。如果有人知道如何做到這一點，我會很高興。謝謝。

下面是我想要的圖片，第一張圖片顯示了當前情況，下一張圖片顯示了我想要實現的內容。

我當前的PHP項目在這裏：

<?php get_header(); ?> 
<!-- Begin Content --> 
<div id="content-a"> 

<?php if (have_posts()) : ?> 
<?php while (have_posts()) : the_post(); ?> 
<div class="post"> 
<div class="imgdiv"><a href="<?php the_permalink() ?>"><img src="<?php echo catch_that_image() ?>" width="250"></a></div> 
<div class="p-heading"><h1><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1></div> 
<div class="p-content"> 
<?php the_excerpt(); ?> 
</div> 
<div class="p-info"><?php the_time('j.m.Y') ?> | <?php the_category(', '); ?> | <img src="http://www.virmodrosti.com/wp-content/uploads/comments.png" alt="Komentarji" width="26" height="12"><?php $totalcomments = get_comments_number(); echo $totalcomments; ?></div> 

</div> 

<?php endwhile; ?> 

<div class="navigation"> 
<div class="alignleft"><?php next_posts_link('Naslednja stran') ?></div> 
<div class="alignright"><?php previous_posts_link('Prejšnja stran') ?></div> 
<div class="clear"></div> 
</div> 

    <?php else : ?> 

</div> 
<div id="content"> 

<div class="post"> 
<div class="p-heading"><h1 class="center">Ni najdeno</h1></div> 
<div class="p-content"><p class="center">Oprostite, ampak iščete nekaj kar ni tukaj.</p> 
</div> 
</div> 
    <?php endif; ?> 

     </div> 

<!-- End Content --> 
<?php get_sidebar(); ?> 
<?php get_footer(); ?> 

Answer 1

<?php $i=1; ?> 
<?php if (have_posts()) : ?> 
<?php while (have_posts()) : the_post(); ?> 
<?php if ($i == 1){ 

// here do the custom look you want to give to 1st post, i am sorry i dont know html 
<div class="post"> 
<div class="imgdiv"><a href="<?php the_permalink() ?>"><img src="<?php echo catch_that_image() ?>" width="250"></a></div> 
<div class="p-heading"><h1><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1></div> 
<div class="p-content"> 
<?php the_excerpt(); ?> 
</div> 
<div class="p-info"><?php the_time('j.m.Y') ?> | <?php the_category(', '); ?> | <img src="http://www.virmodrosti.com/wp-content/uploads/comments.png" alt="Komentarji" width="26" height="12"><?php $totalcomments = get_comments_number(); echo $totalcomments; ?></div> 

</div> 
<?php } else { ?> 

<div class="post"> 
<div class="imgdiv"><a href="<?php the_permalink() ?>"><img src="<?php echo catch_that_image() ?>" width="250"></a></div> 
<div class="p-heading"><h1><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1></div> 
<div class="p-content"> 
<?php the_excerpt(); ?> 
</div> 
<div class="p-info"><?php the_time('j.m.Y') ?> | <?php the_category(', '); ?> | <img src="http://www.virmodrosti.com/wp-content/uploads/comments.png" alt="Komentarji" width="26" height="12"><?php $totalcomments = get_comments_number(); echo $totalcomments; ?></div> 

</div> 
<?php } $i++; ?> 
<?php endwhile; ?>