ajouter the_post_thumbnail comme arrière-plan CSS, dans mon propre thème wordpress

J’essaie de configurer la page d’accueil de mon blog pour afficher l’image en vedette et le titre, jusqu’à présent, tout se passe bien, sauf pour une raison quelconque, mon code à ajouter dans l’image a des problèmes, même en essayant de suivre ce que de nombreux autres messages ici ont semblé réponse. Voici mon code :

<div class="blogContainer">
<?php
  while(have_posts()) {
    the_post();?>
    <?php $thumb = get_the_post_thumbnail_url(); ?>
    <div class="blogItems" style="background-image: url('<?php echo $thumb;?>')">
      <a href="<?php the_permalink(); ?>"><h4><?php the_title();?></h4></a>
    </div>
<?php } ?>

J’ai essayé quelques petites variantes comme celle-ci :

    <?php
  while(have_posts()) {
    the_post();?>
    <?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
    <div class="blogItems" style="background-image: url('<?php echo $url; ?>')">
      <a href="<?php the_permalink(); ?>"><h4><?php the_title();?></h4></a>
    </div>
<?php } ?>

Et ça

    <?php
  while(have_posts()) {
    the_post();?>
    <?php $backgroundImg = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full' ); ?>
    <div class="blogItems" style="background-image: url('<?php echo $backgroundImg[0]; ?>');">
      <a href="<?php the_permalink(); ?>"><h4><?php the_title();?></h4></a>
    </div>
<?php } ?>

Et tous sortent avec le même problème d’avoir l’URL vide dans l’onglet d’inspection. Si quelqu’un a une réponse, ce serait très apprécié!

Solution n°1 trouvée

Essayez d’ajouter get_the_ID() à get_the_post_thumbnail_url() dans le premier exemple :

<div class="blogContainer">
<?php
  while(have_posts()) {
    the_post();?>
    <?php $thumb = get_the_post_thumbnail_url(get_the_ID()); ?>
    <div class="blogItems" style="background-image: url('<?php echo $thumb;?>')">
      <a href="<?php the_permalink(); ?>"><h4><?php the_title();?></h4></a>
    </div>
<?php } ?>

Solution n°2 trouvée

Veuillez essayer le code ci-dessous :

<?php
$args = array(
    'post_type' => 'post', //change with your post type
    'posts_per_page' => -1
);
$query = new WP_Query( $args );
if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post();
    $thumb = get_the_post_thumbnail_url(); ?>
        <div class="blogItems" style="background-image: url('<?php echo $thumb;?>');">
            <a href="<?php the_permalink(); ?>"><h4><?php the_title();?></h4></a>
        </div>
<?php endwhile; endif; ?>