title: Display an article with its category
body: <p>I have this code : </p>
  
  <pre><code>function x_shortcode_recent_posts_v2( $atts ) {
    extract( shortcode_atts( array(
      'id'          =&gt; '',
      'class'       =&gt; '',
      'style'       =&gt; '',
      'type'        =&gt; 'post',
      'count'       =&gt; '',
      'category'    =&gt; '',
      'offset'      =&gt; '',
      'orientation' =&gt; '',
      'no_image'    =&gt; '',
      'fade'        =&gt; ''
    ), $atts, 'x_recent_posts' ) );
  
    $allowed_post_types = apply_filters( 'cs_recent_posts_post_types', array( 'post' =&gt; 'post' ) );
    $type = ( isset( $allowed_post_types[$type] ) ) ? $allowed_post_types[$type] : 'post';
  
    $id            = ( $id          != ''          ) ? 'id="' . esc_attr( $id ) . '"' : '';
    $class         = ( $class       != ''          ) ? 'x-recent-posts cf ' . esc_attr( $class ) : 'x-recent-posts cf';
    $style         = ( $style       != ''          ) ? 'style="' . $style . '"' : '';
    $count         = ( $count       != ''          ) ? $count : 3;
    $category      = ( $category    != ''          ) ? $category : '';
    $category_type = ( $type        == 'post'      ) ? 'category_name' : 'portfolio-category';
    $offset        = ( $offset      != ''          ) ? $offset : 0;
    $orientation   = ( $orientation != ''          ) ? ' ' . $orientation : ' horizontal';
    $no_image      = ( $no_image    == 'true'      ) ? $no_image : '';
    $fade          = ( $fade        == 'true'      ) ? $fade : 'false';
  
    $js_params = array(
      'fade' =&gt; ( $fade == 'true' )
    );
  
    $data = cs_generate_data_attributes( 'recent_posts', $js_params );
  
    $output = "&lt;div {$id} class=\"{$class}{$orientation}\" {$style} {$data} data-fade=\"{$fade}\" &gt;";
  
      $q = new WP_Query( array(
        'orderby'          =&gt; 'date',
        'post_type'        =&gt; "{$type}",
        'posts_per_page'   =&gt; "{$count}",
        'offset'           =&gt; "{$offset}",
        "{$category_type}" =&gt; "{$category}"
      ) );
  
      if ( $q-&gt;have_posts() ) : while ( $q-&gt;have_posts() ) : $q-&gt;the_post();
  
        if ( $no_image == 'true' ) {
          $image_output       = '';
          $image_output_class = 'no-image';
        } else {
          $image              = wp_get_attachment_image_src( get_post_thumbnail_id(), 'entry-cropped' );
          $bg_image           = ( $image[0] != '' ) ? ' style="background-image: url(' . $image[0] . ');"' : '';
          $image_output       = '&lt;div class="x-recent-posts-img"' . $bg_image . '&gt;'.the_category(', ').'&lt;/div&gt;';
          $image_output_class = 'with-image';
        }
  
        $output .= '&lt;a class="x-recent-post' . $count . ' ' . $image_output_class . '" href="#" title="' . esc_attr( sprintf( __( 'Permalink to: "%s"', csl18n() ), the_title_attribute( 'echo=0' ) ) ) . '"&gt;'
                   . '&lt;article id="post-' . get_the_ID() . '" class="' . implode( ' ', get_post_class() ) . '"&gt;'
                     . '&lt;div class="entry-wrap"&gt;'
                       . $image_output
                       . '&lt;div class="x-recent-posts-content"&gt;'
                       .'&lt;p&gt;'.the_category().'&lt;/p&gt;'
                         . '&lt;h3 class="h-recent-posts"&gt;' . get_the_title() . '&lt;/h3&gt;'
                         . '&lt;span class="x-recent-posts-date"&gt;' . get_the_date() . '&lt;/span&gt;'
                         . '&lt;span class="x-recent-posts-excerpt"&gt;' . substr(get_the_excerpt(), 0,150) . '&lt;/span&gt;'
                       . '&lt;/div&gt;'
                     . '&lt;/div&gt;'
                   . '&lt;/article&gt;'
                 . '&lt;/a&gt;';
  
      endwhile; endif; wp_reset_postdata();
  
    $output .= '&lt;/div&gt;';
  
    return $output;
  }
  </code></pre>
  
  <p>WHat I want to do is displaying for each article its category into <code>x-recent-posts-img</code> div.</p>
  
  <p>I already try get_the_category(), but it did not work, now I'm using the_category, but nothing is displaying.</p>
  
  <p>Thanks for your help !</p>