.bg-img not loading on home.html

i've uploaded my live project to heroku, and ever since - the background image in the style.css folder doesn't seem to be working.

(trying to showcase directory below)

/nooz

/nooz2

/static

//css

///style.css

//images

/// background_image.jpg

/// generic_pic.png

/templates -- home.html

settings.py


INSTALLED_APPS = [

'cloudinary_storage',
'django.contrib.staticfiles',
'cloudinary',
]


STATIC_URL = 'static/'

STATICFILES_STORAGE = 'cloudinary_storage.storage.StaticHashedCloudinaryStorage'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')


MEDIA_URL = 'media/'
DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.MediaCloudinaryStorage'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

style.css


    .bg-img {
        background: url('static/images/background_image.jpg');
        height: 550px;
        width: 100%;
        background-size: 100% 550px;
    }

home.html

 <div class="container-fluid bg-img" title="Center Stage Background"></div>

I tried the following:

  1. Changed pathing
  2. Change image
  3. collecstatic
Back to Top