-2

Following is the my static folder structure:

ProjectABC
    - App1
    - App2
    - App3
    - ProjectABC
    - resources
        - static
            - imgs
            - css
        - templates

This is how the project structure looks like.

This is how the static configuration in settings.py looks like:

STATIC_URL = '/static/'
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, "static"),
)

This is how the base.html looks like:

<!doctype html>
{% load static %}
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, maximum-scale=1, initial- 
         scale=1, user-scalable=0">
        <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
        <link rel="stylesheet" href="https://fonts.googleapis.com/css? 
        family=Open+Sans:400,600,800">
        <title>{{SITE_NAME}}</title>
        <link rel='shortcut icon' href= "{% static 'img/favicon.png' %}"/>
        <link href="{{STATIC_URL}}css/application.css" media="screen" rel="stylesheet" 
        type="text/css" />
        <link href="{{STATIC_URL}}css/style.css" media="screen" rel="stylesheet" 
        type="text/css" />

        <script src="{{STATIC_URL}}js/application.js" type="text/javascript"></script>
        {% block extracss %}
        {% endblock %}
   </head>
   <body>
       <div class="container">
           <h1>Hello</h1>
       </div>
   </body>
</html>

All the static files are being loaded as seen in terminal, but in browser its just loading bare html without any css or img: enter image description here

Please lemme know if i am missing something.

Thnk You!

Rahul Sharma
  • 329
  • 1
  • 3
  • 10
  • please run this command `python manage.py collectstatic` – AddWeb Solution Pvt Ltd Aug 29 '22 at 09:20
  • got this as error: raise ImproperlyConfigured("You're using the staticfiles app " django.core.exceptions.ImproperlyConfigured: You're using the staticfiles app without having set the STATIC_ROOT setting to a filesystem path. What should I do ? – Rahul Sharma Aug 29 '22 at 09:30
  • Does this answer your question? [django static file not loading](https://stackoverflow.com/q/25913849/7758804) There are many [existing django questions](https://www.google.com/search?q=django+static+files+not+loading+in+browser+site:stackoverflow.com&rlz=1C1RXQR_enUS982US982&sxsrf=ALiCzsY15PzEAaZUq5YMiYWutx9Dl1TMVw:1661803459787&sa=X&ved=2ahUKEwiHs6Cn7Oz5AhVOAjQIHeGlA9QQrQIoBHoECA0QBQ&biw=2560&bih=1335&dpr=1) for this issue. – Trenton McKinney Aug 29 '22 at 20:05

4 Answers4

0
<link href="{%static 'css/style.css' %}" media="screen" rel="stylesheet" 
        type="text/css" />
AddWeb Solution Pvt Ltd
  • 21,025
  • 5
  • 26
  • 57
0

add settings.py

STATIC_URL = "/static/"
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)
STATIC_ROOT = os.path.join(BASE_DIR, "staticfiles")

Project App Url

from django.contrib import admin
from django.urls import path, include
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    path('admin/', admin.site.urls),
    
    
]+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
AddWeb Solution Pvt Ltd
  • 21,025
  • 5
  • 26
  • 57
0

Static directory must be under the app itself. Create a 'static' directory directly to your app and for better practice, you can also create another directory to the static directory with your app name (static/[app_name]).

Also, {% load static %} must be above doctype in your base.html

Franz Zapanta
  • 69
  • 7
  • I can't change the directory structure as its what the team is following. – Rahul Sharma Aug 30 '22 at 18:36
  • Just went back and checked your settings config, so I think the placement of the directory is just fine. Just make sure {% load static %} must be above doctype in your base.html – Franz Zapanta Sep 01 '22 at 00:01
0

change the static config in your settings.py to this:

STATIC_ROOT = os.path.join(BASE_DIR, 'resources/static')
STATIC_URL = 'resources/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'ProjectABC')
]

then run python manage.py collectstatic

and when you call the static file do it like this {% static 'css/style.css' %}

Mazen Mamdouh
  • 32
  • 6