缩略图网址返回页面顶部

时间:2017-09-24 19:37:23

标签: wordpress shortcode

我写了这个简单的短代码来返回我的自定义博客网格,我想插入帖子特色图片作为帖子瓷砖的背景图片。

除了背景图片部分外,一切都很好。我无法理解为什么图片网址在页面顶部返回且style属性为空它只返回`background-image url('');

截图如下: enter image description here

function gita_blog_grid( $atts ) {
  extract( shortcode_atts( array(
    'post_type' => 'post',
    'orderby' => 'date',
    'order' => 'DESC',
    'perpage' => 3
  ), $atts ) );

  $output = '<div class="posts_wrapper"><div class="gita_posts_row">';
  $args = array(
    'post_type' => $post_type,
    'orderby' => $orderby,
    'order' => $order,
    'posts_per_page' => $perpage
  );

  $gita_query = new WP_Query ( $args );

  while($gita_query->have_posts()) : $gita_query->the_post();

      if(has_post_thumbnail()) {
        $post_thumb = the_post_thumbnail_url('full');
      }

      $output .= '<article class="gita_single_post" style="background-image: url(\''. $post_thumb . ' \')">';
      $output .= '<h3 class="gita_post_title">' . get_the_title() . '</h3>';
      $output .= '</article></div></div>';

    endwhile;
    wp_reset_query();
    return $output;
  }

    add_shortcode('gita_blog', 'gita_blog_grid');

1 个答案:

答案 0 :(得分:1)

the_post_thumbnail_url会在调用后立即直接显示该页面。在您的情况下,它会在调用后立即将URL字符串直接显示在屏幕上,这是在您完成生成输出处理并将其返回以显示之前。

您希望将其作为变量使用,而不是直接显示它,因此您需要使用get_the_post_thumbnail_url,即

 if(has_post_thumbnail()) {
       $post_thumb = get_the_post_thumbnail_url(get_the_ID(), 'full');
 }

<强>价: