How to fix the loop statement

Question

From my loop statement, I get same image return twice but other content is returning different properties like the title, date and etc.

Variables declared

<?php
    $options = thrive_get_theme_options();

    $featured_image_data = thrive_get_post_featured_image(get_the_ID(), $options['featured_image_style']);
    $featured_image_data_2 = thrive_get_post_featured_image(get_the_ID(), $options['featured_image_style']);
    $featured_image = $featured_image_data['image_src'];
    $featured_image_2 = $featured_image_data_2['image_src'];
    $featured_image_alt = $featured_image_data['image_alt'];
    $featured_image_title = $featured_image_data['image_title'];

    $post_format = get_post_format();

    if (isset($options['meta_post_date']) && $options['meta_post_date'] == 1 && isset($options['meta_post_date_type'])) {
        $post_date = thrive_get_post_date($options['meta_post_date_type'], $options['relative_time']);
    }

?>

below is the list displaying the various blog post left and right on the index page.

<ul>
<?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) == 0) : $wp_query->next_post(); else : the_post(); ?>
<?php tha_entry_before(); ?>
<li class="post post-r post-single">
<?php tha_entry_top(); ?>
<?php if ($options['featured_image_style'] == "wide" && $featured_image && $post_format != 'gallery' && $post_format != 'video'): ?>
<a href="<?php the_permalink(); ?>">
<img class="lazy" data-orginal="<?php echo $featured_image; ?>" width="460" height="277" src="<?php echo $featured_image; ?>" alt="<?php echo $featured_image_alt; ?>" title="<?php echo $featured_image_title; ?>" style="display:block;">
<noscript>&lt;img src="<?php echo $featured_image; ?>" width="460" height="277" alt="<?php the_title(); ?>"&gt;</noscript>
<?php endif; ?>

<h2 class="title"><?php the_title(); ?></h2>

<?php if (isset($options['display_meta']) && $options['display_meta'] == 1): ?>

<div class="details">

<?php if (isset($options['meta_post_date']) && $options['meta_post_date'] == 1): ?>
<p class="date"><?php echo $post_date; ?></p> <?php endif; ?>
<p class="shares-comments">
<span class="shares">278 shares</span>
<span class="comments"><?php if ($options['meta_comment_count'] != 1 || get_comments_number() == 0): ?>0<?php else: ?><?php echo get_comments_number(); ?><?php endif; ?> comments</span>
</p>
</div>

<?php endif; ?>

</a>


</li>
<?php tha_entry_after(); ?>
<?php endif; endwhile; else: ?>
<li class="post post-l post-single">No content</li>
<?php endif; ?>

<?php $i = 0; rewind_posts(); ?>

<?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) !== 0) : $wp_query->next_post(); else : the_post(); ?>
<?php tha_entry_before(); ?>
<li class="post post-l post-single">
<?php tha_entry_top(); ?>
<?php if ($options['featured_image_style'] == "wide" && $featured_image_2 && $post_format != 'gallery' && $post_format != 'video'): ?>
<a href="<?php the_permalink(); ?>">
<img class="lazy" data-orginal="<?php echo $featured_image_2; ?>" width="460" height="277" src="<?php echo $featured_image_2; ?>" alt="<?php echo $featured_image_alt; ?>" title="<?php echo $featured_image_title; ?>" style="display:block;">
<noscript>&lt;img src="<?php echo $featured_image_2; ?>" width="460" height="277" alt="<?php the_title(); ?>"&gt;</noscript>
<?php endif; ?>

<h2 class="title"><?php the_title(); ?></h2>

<?php if (isset($options['display_meta']) && $options['display_meta'] == 1): ?>

<div class="details">

<?php if (isset($options['meta_post_date']) && $options['meta_post_date'] == 1): ?>
<p class="date"><?php echo $post_date; ?></p> <?php endif; ?>
<p class="shares-comments">
<span class="shares">278 shares</span>
<span class="comments"><?php if ($options['meta_comment_count'] != 1 || get_comments_number() == 0): ?>0<?php else: ?><?php echo get_comments_number(); ?><?php endif; ?> comments</span>
</p>
</div>

<?php endif; ?>

</a>

</li></ul>

I need help to fix the images to return image attached to the blog post.

Answer 1

Perhaps just being sure that you set your image data within what WordPress calls "the loop" (aka inside that while where $post is set so that get_the_ID returns the info for the post currently being looped over) will get you running. Here is one idea how you might accomplish that:

<?php
  if (have_posts()) :
    while(have_posts()) :
      $i++;
      if(($i % 2) == 0) :
        $wp_query->next_post();
      else :
        the_post(); 

        // so 
        $featured_image_data = thrive_get_post_featured_image(
                                 get_the_ID(),
                                 $options['featured_image_style']
                               );
        $featured_image = $featured_image_data['image_src'];
        $featured_image_alt = $featured_image_data['image_alt'];
        $featured_image_title = $featured_image_data['image_title'];

        $post_format = get_post_format();

        if (isset($options['meta_post_date']) && 
            $options['meta_post_date'] == 1 && 
            isset($options['meta_post_date_type'])) {
               $post_date = thrive_get_post_date(
                              $options['meta_post_date_type'],
                              $options['relative_time']);

        }
        ?>
        <?php tha_entry_before(); ?>
        <li class="post post-r post-single">
        <?php tha_entry_top(); ?>

... etc