如何使用Echo设置Div背景图像?

时间:2019-06-21 20:21:12

标签: php wordpress echo

我使用jquery和php为wordpress主题创建了一个简单的加载更多ajax按钮。我能够加载更多帖子,但是我尝试使用echo将div的背景图像设置为我的functions.php文件中的帖子缩略图,但是我不确定如何?我尝试创建变量并将其传递到url中,但没有成功。这是我的代码:

add_action( 'wp_ajax_load_more', 'load_more' );

function load_more() {
    // load more posts
    $paged = $_POST['page']+1;
    $ppp = $_POST['ppp'];

    $query = new WP_Query( array(
        'post_type' => 'project',
        'status' => 'publish',
        'order' => 'ASC',
        'posts_per_page' => $ppp,
        'paged' => $paged
    ) );

    if($query->have_posts()):
        while($query->have_posts()): $query->the_post();

            $thumbnail = the_post_thumbnail_url();

            echo '<div class="col-lg-4 col-md-6">';
                echo '<div class="project">';
                    echo '<div class="project-content">';
                        echo '<div class="project-img" style="background:url( THUMBNAIL HERE )">';

                        echo '</div>';
                    echo '</div>';
                echo '</div>';
            echo '</div>';
        endwhile;
    endif;

    wp_reset_postdata();

    die();

```}

2 个答案:

答案 0 :(得分:2)

如果您想将变量设置为等于帖子的缩略图,我认为您需要使用get函数:

get_the_post_thumbnail_url()

然后您可以将变量名作为背景图像回显:

echo '<div class="project-img" style="background:url(' . $thumbnail . ')">';

答案 1 :(得分:0)

 echo "<div class='project-img' style='background:url($thumbnail )'>";