Django static files relative references Amazon S3

Question

I'm trying to get a background image to show hosting the static files on Amazon S3. The following code in my base.html works perfectly well and finds the CSS file located in my S3 bucket:

<link rel="stylesheet" href="{{ STATIC_URL }}css/stylesheet.css" type="text/css" />

My question is, within my CSS file, the following line doesn't seem to find the image:

    background-image: url("{{ STATIC_URL }}img/GreenBackground.jpg") no-repeat center center fixed;

My Amazon bucket looks like

/newdjangoapp
--/admin
--/css
----/stylesheet.css
--/img
----/GreenBackground.jpg

I have tried adding an additional 'static' directory around the img and css directories and updating this in the filepaths, I have tried the following code:

    background-image: url("{{ STATIC_URL }}../img/GreenBackground.jpg") no-repeat center center fixed;

and even

    background-image: url("../img/GreenBackground.jpg") no-repeat center center fixed;

My static URL setup is as follows:

STATIC_URL = 'http://s3.amazonaws.com/' + AWS_STORAGE_BUCKET_NAME +'/'

and static directories...

STATIC_ROOT = os.path.join(PROJECT_DIR,'')

STATICFILES_DIRS = (
        os.path.join(PROJECT_DIR, 'static/'),
)

Any help on getting this fixed would be greatly appreciated!

Answer 1

Maybe you should reference it differently since your css does not know {{ STATIC_URL }}. See how you defined static in your django settings.py file ( in my case I have it "/static/ ) and then reference it like that in the css file. Instead of {{STATIC_URL}}, make your reference the same as you made in your settings.py file (in my case that would be "/static/css...")