Wordpress - how to get thumbnail in an HTML tag with CSS and PHP?

Question

Wordpress - how to get thumbnail in an HTML tag with CSS and PHP?

I have a CSS that looks like this:

.cid-rlWhG48NmK {
    padding-top: 60px;
    padding-bottom: 0px;
    background-image: url("../../images/background4.jpg");
}

And my HTML calls this way:

<section class="mbr-section content5 cid-rlWhG48NmK mbr-parallax-background" id="content5-f">
...

I want to implement get_the_post_thumbnail() in cid-rlWhG48NmK by changing the image: if I have highlighted image, then use, if not use a pattern.

I'm trying this way:

    <style>
    <?php if(get_the_post_thumbnail()) : ?>
        .cid-rlWhG48NmK {
            background-image: url('<?php the_post_thumbnail(); ?>')>;
        }
    <?php else : ?> 
        .cid-rlWhG48NmK {
            background-image: url('<?php bloginfo($show = ´template_url´); ?>/assets/images/background4.jpg');
        }
    <?php endif; ?>
</style>

<section class="mbr-section content5 cid-rlWhG48NmK mbr-parallax-background" id="content5-f">

But it is not picking up either the highlighted image or the one set otherwise.

Anyone know how to solve?

PS: I remove the background-image from CSS to make the code I want.

0

wordpress wordpress-theme

Author: Ramos, 2019-04-02

Source

1 answers

score 2 · Accepted Answer

To get the thumbnail url is to use the function: get_the_post_thumbnail_url() I recommend putting it inline in html, example:

if ( has_post_thumbnail() ) {
    $img = get_the_post_thumbnail_url();
}
else {
    $img = 'caminh_imagem_padrao'.png
}
?>

    <section class="mbr-section content5" id="content5-f" style="background-image: url(<?php echo $img ?>);">