Unable to load style.css in Django 1.9

Question

I am trying to load the style.css on my page.
I've added the path for STATICFILES_DIRS like below,

STATIC_URL = '/static/'

STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
 ]

STATIC_ROOT = os.path.join(BASE_DIR, "static_cdn")

index.html
{% load staticfiles %}
`<link rel='stylesheet' href='{% static "css/style.css" %}' type='text/css'>`

When I ran the collectstatic and it collected the style.css.

When I do inspect element and open a link of style.css (http://127.0.0.1:8000/static/css/style.css), it gives me not found message.

I tried hard-coding the path to style.css but, no luck.

I created the another sample project and followed the same steps and style.css loaded successfully. When I do inspect element and open a link of style.css, it shows me html code.

I am really helpless. Any help is really appreciated.

Edit

setting.py template settings:

TEMPLATES = [
{
    'BACKEND': 'django.template.backends.django.DjangoTemplates',
    'DIRS': [],
    'APP_DIRS': True,
    'OPTIONS': {
        'context_processors': [
            'django.template.context_processors.debug',
            'django.template.context_processors.request',
            'django.contrib.auth.context_processors.auth',
            'django.contrib.messages.context_processors.messages',
        ],
    },
},

]

Directory structure:

 |myproject
  |----- MyApp/
  |---- myProject/
  |---- static/ 
  |---- static_cdn/
  |----manage.py

https://github.com/prafullarkamble/UnableToLoadStyle.css/

Answer 1

1) Select the folder(s) where you want the static assets from where you want them to be collected:

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "i_will_collect_from_here"),
    ... yet another folder
]

2) Select the folder where you want the static assets to be collected:

STATIC_ROOT = os.path.join(BASE_DIR, "here_my_static_will_be_collected")

3) Run python manage.py collectstatic

Note:

In STATICFILES_DIRS you can add any path you want, it can be an absolute path. collectstatic will place the static in your STATIC_ROOT.

STATICFILES_DIRS = [
    '/var/www/assets/bootstrap/'
    ...
]

Answer 2

If i remember correctly, the collectstatic command is only used for production. So the collected statifiles do not affect the development.

In your project structure, the path to the style.css is :

Salmon/static/Salmon/style.css.

So you should find the file with the URL:

http://127.0.0.1:8000/static/Salmon/style.css

which should be equivalent to {% static "Salmon/style.css" %} in your template.