MarkP
MarkP

Reputation: 2566

WordPress Custom shortcode and loop throws Strange results

The Problem

When I run this code, it outputs all the posts in a specific category, each one in an <li> tag. For some reason, the last item has the post thumbnail also which I do not want.

Functions.php

I created a custom short code to display all the posts within a specific category:

function getPostbyCategory($atts) {

extract(shortcode_atts(array(
        "slug" => 'tutorials'
    ), $atts));

global $post;

$args = array(
    'category_name'    => $slug,
    'posts_per_page' => 2000,
    'orderby'          => 'date',
    'order'            => 'DESC',
    'post_type'        => 'post',
    'post_status'      => 'publish',
);
$buildOuput = "<ul>";
$posts_array = get_posts( $args );
foreach ( $posts_array as $post ) { 
    $buildOuput .= "<li><a href=".get_the_permalink($post->ID).">".get_the_title()."</a></li>";

}
$buildOuput .= "</ul>";

return $buildOuput;

wp_reset_postdata();

}
add_shortcode("specificcategoryposts","getPostbyCategory");

The Post

Here is everything in the post:

<div class="row">
<div class="two-thirds column">
    <h2>Category</h2>
    <p>Lorem Ipsum Dolor Sit Amet</p>
    [specificcategoryposts slug="tutorials"]
</div>

<div class="one-third column ">
    <img src="example.com/title-img.png" alt="Title Image" />
</div>
</div> 

The Output

<div class="row">
<div class="two-thirds column">
    <h2>Category</h2>
    <p>Lorem Ipsum Dolor Sit Amet</p>
    <ul>
     <li><a href="#link1">postTitle1</a></li>
     <li><a href="#link2">postTitle2</a></li>
    </ul>
</div>

<div class="one-third column">
    <img src="example.com/title-img.png" alt="Title Image" />
</div>
</div> 

// Then it outputs this, outside of everything:
<div class="one-third column">
    <img width="738" height="492" src="http://example.com/featured-image.png" class="hide-mobile wp-post-image" alt="iOS Development Swift Tutorial"> 
</div>

Any ideas as to what the devil is going on here.

Upvotes: 3

Views: 29

Answers (1)

geco17
geco17

Reputation: 5294

Not sure how it will affect the results but the return statement is before wp_reset_postdata. See the correction below.

For the function reference, https://codex.wordpress.org/Function_Reference/wp_reset_postdata

function getPostbyCategory($atts) {

    extract(shortcode_atts(array(
        "slug" => 'tutorials'
    ), $atts));

    global $post;

    $args = array(
        'category_name'  => $slug,
        'posts_per_page' => 2000,
        'orderby'        => 'date',
        'order'          => 'DESC',
        'post_type'      => 'post',
        'post_status'    => 'publish',
    );
    $buildOuput = "<ul>";
    $posts_array = get_posts( $args );
    foreach ( $posts_array as $post ) { 
        $buildOuput .= "<li><a href=".get_the_permalink($post->ID).">".get_the_title()."</a></li>";
    }
    $buildOuput .= "</ul>";

    wp_reset_postdata(); // this line was previously beneath the return statement
    return $buildOuput;
}
add_shortcode("specificcategoryposts","getPostbyCategory");

Upvotes: 2

Related Questions