i make a code that can fill bootstrap grid structure i used while and for loop in my code but the issue is for loop repeat its value in 2nd row
the above picture tells you column 2 and 3 of first row and column 1 and 2 of second row has same value here is my code
<div class="row">
<div class="col-xs-12">
<div class="rst-mediagrid">
<?php
global $post;
$loop = new WP_Query( array( 'posts_per_page' => 9,'orderby'=>rand) );
$posts = array();
while ( $loop->have_posts() ) :
$items = array();
$items['link']=wp_get_attachment_url( get_post_thumbnail_id( $post->ID ));
$items['Image'] = get_the_post_thumbnail($loop->the_post());
$items['LinkPost']=get_permalink($post->ID);
$items['Title']=get_the_title($post->ID);
$items['PostTime']=get_the_time('M d,Y', $post->ID);
array_push($posts, $items);
endwhile;
for($i = 1; $i< count($posts); $i++){
?>
<?php
if($i==1){
?>
<div class="div">
<div class="rst-col rst-col-50">
<div class="rst-postpic">
<a href="<?php echo $posts[$i]['LinkPost']; ?>"><img src="<?php echo $posts[$i+1]['link']; ?>" alt="" style="height: 385px;width: 770px"/></a>
<?php echo $i+1; ?>
</div>
<div class="rst-postinfo">
<a href="#"><span>Sport</span></a>
<h6><a href="<?php echo $posts[$i]['LinkPost']; ?>"><?php echo $posts[$i]['Title']; ?></a></h6>
<time><i class="fa fa-clock-o"></i><?php echo $posts[$i]['PostTime']; ?></time>
</div>
</div>
<?php //endif; ?>
<div class="rst-col rst-col-25">
<div class="rst-postpic rst-postvideo">
<a href="<?php echo $posts[$i+1]['LinkPost']; ?>"><img src="<?php echo $posts[$i+2]['link']; ?>" alt="" style="height: 385px;width: 770px"/></a>
<?php echo $i+2; ?>
</div>
<div class="rst-postinfo">
<a href="#"><span>Sport</span></a>
<h6><a href="<?php echo $posts[$i+1]['LinkPost']; ?>"><?php echo $posts[$i+1]['Title']; ?></a></h6>
<time><i class="fa fa-clock-o"></i><?php echo $posts[$i+1]['PostTime']; ?></time>
</div>
</div>
<div class="rst-col rst-col-25">
<div class="rst-postpic">
<a href="<?php echo $posts[$i+2]['LinkPost']; ?>"><img src="<?php echo $posts[$i+3]['link']; ?>" alt="" style="height: 385px;width: 770px"/></a>
<?php echo $i+3; ?>
</div>
<div class="rst-postinfo">
<a href="#"><span>Sport</span></a>
<h6><a href="<?php echo $posts[$i+2]['LinkPost']; ?>"><?php echo $posts[$i+2]['Title']; ?></a></h6>
<time><i class="fa fa-clock-o"></i><?php echo $posts[$i+2]['PostTime']; ?></time>
</div>
</div>
<div class="clear"></div>
</div><!-- end first row-->
<?php } //end if ?>
<?php
if($i == 2 ){
?>
<div class="div">
<div class="rst-col rst-col-25">
<div class="rst-postpic">
<a href="<?php echo $posts[$i]['LinkPost']; ?>"><img src="<?php echo $posts[$i+1]['link']; ?>" alt="" style="height: 385px;width: 770px"/></a>
<?php echo $i+1; ?>
</div>
<div class="rst-postinfo">
<a href="#"><span>Sport</span></a>
<h6><a href="<?php echo $posts[$i]['LinkPost']; ?>"><?php echo $posts[$i]['Title']; ?></a></h6>
<time><i class="fa fa-clock-o"></i><?php echo $posts[$i]['PostTime']; ?></time>
</div>
</div>
<div class="rst-col rst-col-25">
<div class="rst-postpic rst-postvideo">
<a href="<?php echo $posts[$i+1]['LinkPost']; ?>"><img src="<?php echo $posts[$i+2]['link']; ?>" alt="" style="height: 385px;width: 770px"/></a>
<?php echo $i+2; ?>
</div>
<div class="rst-postinfo">
<a href="#"><span>Sport</span></a>
<h6><a href="<?php echo $posts[$i+1]['LinkPost']; ?>"><?php echo $posts[$i+1]['Title']; ?></a></h6>
<time><i class="fa fa-clock-o"></i><?php echo $posts[$i+1]['PostTime']; ?></time>
</div>
</div>
<div class="rst-col rst-col-50">
<div class="rst-postpic">
<a href="<?php echo $posts[$i+2]['LinkPost']; ?>"><img src="<?php echo $posts[$i+3]['link']; ?>" alt="" style="height: 385px;width: 770px"/></a>
<?php echo $i+3; ?>
</div>
<div class="rst-postinfo">
<a href="#"><span>Sport</span></a>
<h6><a href="<?php echo $posts[$i+2]['LinkPost']; ?>"><?php echo $posts[$i+2]['Title']; ?></a></h6>
<time><i class="fa fa-clock-o"></i><?php echo $posts[$i+2]['PostTime']; ?></time>
</div>
</div>
<div class="clear"></div>
</div><!--end second row-->
<?php
}//end if
}//end for loop ?>
</div>
</div>
</div>
the issue i was facing is that i upload 6 post and when i increase the value of loop like for($i=1;$i
this loop give me unique value but last two columns has no images but when i upload two more post in wordpress and total number of posts = 8 in database then image appear tell me whats the issue in my looping
The code logic inside the loop is really confusing, here is what happening:
$i = 1
)$posts[$i+1]['link']
) with the link of the first post ($posts[$i]['LinkPost'];
)$posts[$i+2]['link']
) with the link of the second post ($posts[$i+1]['LinkPost']
)$posts[$i+3]['link']
) with the link of the third post ($posts[$i+2]['LinkPost']
)$i = 2
)$posts[$i+1]['link']
) with the link of the second post ($posts[$i]['LinkPost'];
)$posts[$i+2]['link']
) with the link of the third post ($posts[$i+1]['LinkPost']
)$posts[$i+3]['link']
) with the link of the fourth post ($posts[$i+2]['LinkPost']
)This is why you get two time image 3 and 4.