Title: Issue while adding a featured image from a custom post using PHP
Last modified: May 14, 2021

---

# Issue while adding a featured image from a custom post using PHP

 *  [codettes](https://wordpress.org/support/users/codettes/)
 * (@codettes)
 * [5 years ago](https://wordpress.org/support/topic/issue-while-adding-a-featured-image-from-a-custom-post-using-php/)
 * Hello,
 * I have created a page to display my custom posts using a query_posts. My images
   are displayed but I have an issue with only one image not being aligned with 
   the others (so I blame the chunk of code related to the image). Also, if I close
   my img html tag, the end of the tag is displayed on the page, below the image.
 * Here is the code:
 *     ```
       function wpc_shortcode( $atts ) {
         query_posts('posts_per_page=16&post_type=backstages&orderby=date&order=asc');
         while ( have_posts() ) : the_post();
           $photo = get_the_post_thumbnail();
           $titre = get_the_title();
           $link = get_field('link');
           $size = "full"; ?>
   
           <div class="container">
                 <div class="row">
                     <div class="vc_col-sm-6 rowbackstage">
                       <img src="<?php echo $photo; ?>"/>
                       <p class="titrebackstage allbackstages"><?php if( $link ): ?><a class="backstageslink" target="_blank" href="<?php echo esc_url( $link ); ?>"><?php endif; ?><?php the_title(); ?></a></p>
                     </div>
                 </div>
              </div>
             <?php endwhile;
         wp_reset_query(); // resets the aletered query back to the original
         echo do_shortcode('[ajax_load_more id="loadmorebtn" container_type="div" post_type="backstages" posts_per_page="6" order="ASC" orderby="date" offset="16" pause="true" button_label="Charger plus" button_loading_label="Chargement..." button_done_label="Toutes les images sont affichées" ]');
       }
   
       add_shortcode( 'all_backstages', 'wpc_shortcode');
       ```
   
 * I can’t find what’s wrong in my code. Could anyone help me see clearer? I’m lost!
 * Thank you very much!

Viewing 5 replies - 1 through 5 (of 5 total)

 *  [simpleliving](https://wordpress.org/support/users/simpleliving/)
 * (@simpleliving)
 * [5 years ago](https://wordpress.org/support/topic/issue-while-adding-a-featured-image-from-a-custom-post-using-php/#post-14439295)
 * Hi there!
 * The `get_the_post_thumbnail()` function returns the post thumbnail image tag.
   If you take a look at your source code where the above shortcode html renders,
   do you see an `img` tag within an `img` tag? Try removing the img tag that surrounds`
   <?php echo $photo; ?>` — this should resolve the closing img tag that is rendering
   on the frontend. Does this also help with how the images are displaying? Let 
   me know! If you have an example link, I’d be happy to take a closer look.
 * Good luck!
 *  Thread Starter [codettes](https://wordpress.org/support/users/codettes/)
 * (@codettes)
 * [5 years ago](https://wordpress.org/support/topic/issue-while-adding-a-featured-image-from-a-custom-post-using-php/#post-14440134)
 * Hi [@simpleliving](https://wordpress.org/support/users/simpleliving/) ,
 * Thank you for your quick reply!:)
    Indeed, it solves the closing tag issue, so
   thanks again! Here is the updated code:
 *     ```
       function wpc_shortcode( $atts ) {
         query_posts('posts_per_page=16&post_type=backstages&orderby=date&order=asc');
         while ( have_posts() ) : the_post();
           $photo = get_the_post_thumbnail();
           $titre = get_the_title();
           $link = get_field('link');
           $size = "full"; ?>
   
           <div class="container">
                 <div class="row">
                     <div class="vc_col-sm-6 rowbackstage">
                       <?php echo $photo; ?>
                       <p class="titrebackstage allbackstages"><?php if( $link ): ?><a class="backstageslink" target="_blank" href="<?php echo esc_url( $link ); ?>"><?php endif; ?><?php the_title(); ?></a></p>
                     </div>
                 </div>
              </div>
             <?php endwhile;
         wp_reset_query(); // resets the aletered query back to the original
         echo do_shortcode('[ajax_load_more id="loadmorebtn" container_type="div" post_type="backstages" posts_per_page="6" order="ASC" orderby="date" offset="16" pause="true" button_label="Charger plus" button_loading_label="Chargement..." button_done_label="Toutes les images sont affichées" ]');
       }
   
       add_shortcode( 'all_backstages', 'wpc_shortcode');
       ```
   
 * But it doesn’t help with how the images are displaying. Unfortunately, the website
   is still in creation so hidden. I’ll try to describe my issue: I have two columns
   of pictures+title (thanks to the “vc_col-sm-6”) but on the third row, I have 
   only a single image+title in the right column and of course, it moves everything
   back below. I have played with the order (asc or desc) and it moves the issue
   to the second row but it’s still there (and the picture is still in the right
   column. I really have no clue of what may cause that… Do you have any idea?
 * Thank you!
 *  [simpleliving](https://wordpress.org/support/users/simpleliving/)
 * (@simpleliving)
 * [5 years ago](https://wordpress.org/support/topic/issue-while-adding-a-featured-image-from-a-custom-post-using-php/#post-14440224)
 * Hi!
    Are you able to provide a snippet of the rendered source code for the 3 
   rows of images? It looks like the `container`, `row`, and `vc_col-sm-6` renders
   each time you include the shortcode — instead, you likely want the `container`,
   and `row` elements outside of your loop.
 *  Thread Starter [codettes](https://wordpress.org/support/users/codettes/)
 * (@codettes)
 * [5 years ago](https://wordpress.org/support/topic/issue-while-adding-a-featured-image-from-a-custom-post-using-php/#post-14440338)
 * Hi,
 * Good idea! I have excluded the container and row of the loop, so the code looks
   like that:
 *     ```
       function wpc_shortcode( $atts ) {
         query_posts('posts_per_page=16&post_type=backstages&orderby=date&order=asc');?>
             <div class="container">
                 <div class="row">
        <?php while ( have_posts() ) : the_post();
           $photo = get_the_post_thumbnail();
           $titre = get_the_title();
           $link = get_field('link');
           $size = "full"; ?>
   
                     <div class="vc_col-sm-6 rowbackstage">
                       <?php echo $photo; ?>
                       <p class="titrebackstage allbackstages"><?php if( $link ): ?><a class="backstageslink" target="_blank" href="<?php echo esc_url( $link ); ?>"><?php endif; ?><?php the_title(); ?></a></p>
                     </div>
                           <?php endwhile; ?>
                 </div>
              </div>
   
        <?php wp_reset_query(); // resets the aletered query back to the original
         echo do_shortcode('[ajax_load_more id="loadmorebtn" container_type="div" post_type="backstages" posts_per_page="6" order="ASC" orderby="date" offset="16" pause="true" button_label="Charger plus" button_loading_label="Chargement..." button_done_label="Toutes les images sont affichées" ]');
       }
   
       add_shortcode( 'all_backstages', 'wpc_shortcode');
       ```
   
 * Is it what you meant?
 * I still have the issue…
 * I would be happy to send a screenshot but I don’t see how here?
 * Thanks again for your help!
 *  Thread Starter [codettes](https://wordpress.org/support/users/codettes/)
 * (@codettes)
 * [5 years ago](https://wordpress.org/support/topic/issue-while-adding-a-featured-image-from-a-custom-post-using-php/#post-14448042)
 * Hi,
 * I have changed the order of the posts (using a plugin to reorder) and I have 
   now two pictures not displaying next to another one on its row. Here is a screenshot
   of what I see when I use the “inspect element” tool: [https://snipboard.io/eto9l6.jpg](https://snipboard.io/eto9l6.jpg)(
   the “alone picture” is the one in red brackets).
 * And here is a screenshot of what is displayed on the front-end: [https://snipboard.io/oe6q0p.jpg](https://snipboard.io/oe6q0p.jpg)
 * Maybe this will help you understand the issue…
 * Thanks a lot for any help! 🙂

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Issue while adding a featured image from a custom post using PHP’ is 
closed to new replies.

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 5 replies
 * 2 participants
 * Last reply from: [codettes](https://wordpress.org/support/users/codettes/)
 * Last activity: [5 years ago](https://wordpress.org/support/topic/issue-while-adding-a-featured-image-from-a-custom-post-using-php/#post-14448042)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics