Search code examples
phpcsswordpressbackground-image

Background-image is not being displayed


I'm pulling a featured image in from a blog post and setting to my background image. I'm using the same line of code I usually do, but for some reason no image is being displayed.

$img = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'full');

<div class="panel--bg-image" <?php $img ? print 'style="--background-image: url(' . $img['sizes']['large'][0] . ');"' : ''; ?>>

To make sure my variable isn't empty, I ran

var_dump($img)

and my image is indeed being called. When I check the element in the dev tools, I see this: enter image description here

When an image is successfully being called, I can always see the file in the url(). I usually pull these images from a custom filed, but these are being pulled from 'featured image' in the post backend. Any idea what I'm doing wrong here?


Solution

  • The WordPress function wp_get_attachment_image_src requires the Image-ID and the size and returns an array:

    array {
        [0] => url,
        [1] => width
        [2] => height
        [4] => is_intermediate
    }
    

    So, if you want to get the Image-URL, use $img[0] instead of $img['sizes']['large'][0].

    Source: WordPress Codex