How to Make HTML Element Not Loop Inside Loop In WordPress - php

Question

is this possible to make the post list like this in WordPress?
<div class="large-image">
<img src="http://example.com">
<h1>Title</h1>
</div>
<div class="post-row"><!-- this is not a loop -->
<div class="post-item"><!-- this is a loop -->
<img src="http://example.com">
<h1>Title</h1>
</div>
<div class="post-item"><!-- this is a loop -->
<img src="http://example.com">
<h1>Title</h1>
</div>
</div>
I have try with this code below, but the <div class="post-row"> always included in the loop.
<?php
if ( have_posts() ) : $post_count = 0;
while ( have_posts() ) : the_post();
if ( $post_count = 0 ) { ?>
<div class="large-image">
<img src="http://example.com">
<h1>Title</h1>
</div>
<?php } ?>
<div class"post-row">
<?php if ( $post_count > 0 ) { ?>
<div class="post-item"><!-- this is a loop -->
<img src="http://example.com">
<h1>Title</h1>
</div>
<?php } ?>
</div><!-- /post-row -->
<?php
endwhile
endif;
?>
What I wanted is <div class="post-row"> not looping.
I have try some answer in stackoverflow, but the post-row always looping.
Hope I get best answer.

Answer 1

You must move the post-row div above the while loop, you just missed placed it that's all
<?php if ( have_posts() ) : $post_count = 0;
if ( $post_count == 0 ) { ?>
<div class="large-image">
<img src="http://example.com">
<h1>Title</h1>
</div>
<?php } ?>
<div class"post-row">
<?php
while ( have_posts() ) : the_post();
if ( $post_count > 0 ) { ?>
<div class="post-item"><!-- this is a loop -->
<img src="http://example.com">
<h1>Title</h1>
</div>
<?php }
$post_count ++;
endwhile; ?>
</div><!-- /post-row -->
<?php endif; ?>