My image wont load in custom wordpress theme

Question

I have an issue loading images with correct file path. My path is ok but it wont load some cover image that i want to. This is archives.php file. I also have blogs and catergoies with recent blog post code that is working fine. But this part were im pulling image from wp-content/uploads is not working tho file path is apsolutly correct.

http://prntscr.com/o9y48h

As you can see my image wont show up. I`v shown below also a print screen of a site with that exact image.

<?php 
$id = get_the_ID();
$back_img = get_the_post_thumbnail_url($id);

if(empty($back_img)){
    $back_img = '/wp-content/uploads/2019/06/blog_post.jpg';
}
?>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

    <header class="blog-section-1" style="background:url(/wp-content/uploads/2019/06/blog_post.jpg)no-repeat center;background-size:cover;">
            <div class="container">
                <?php
                the_archive_title('<h1 class="page-title">', '</h1>' ); 
                ?>
                <div class="md-breadcrumbs-pages">
        <div class="container"> 
        <?php
                    if ( function_exists('yoast_breadcrumb') ) {
                      yoast_breadcrumb( '
                    <p id="breadcrumbs">','</p>
                    ' );
                    }
        ?>
            </div>
            </div>
        </div>
    </header>

I want to be like http://prntscr.com/o9y2aj but it wont show this exact image that is shown in this printscreen. Same image that i have on the file path.

Thanks

Answer 1

For background-image attribute give the relative path to the image within url.

like.

//get the wp_upload directory 
    $upload_dir = wp_upload_dir();
            $id = get_the_ID();
            $back_img = get_the_post_thumbnail_url($id);

            if(empty($back_img)){
                //relative path of the default image within url
                $back_img = $upload_dir['baseurl'].'/2019/06/blog_post.jpg';
            }
           $default_header_img = $upload_dir['baseurl'].'/2019/06/blog_post.jpg';
    ?>

    <div id="primary" class="content-area">
        <main id="main" class="site-main">
        <!-- use $back_img variable for background image -->
        <header class="blog-section-1" style="background:url(<?php echo $default_header_img;?>)no-repeat center;background-size:cover;">
                <div class="container">

Answer 2

Try giving path something like this :

$uploads = wp_upload_dir(); 
<img src="' . esc_url( $uploads['baseurl'] . '/USER_PHOTOS/ronny/' ) . '">;