Django - templates do not read files in the "STATIC" folder

0

I have tried all the solutions that have commented, but I can not solve it.

I downloaded the template ONETECH in colorlib . Copy the files of css , js e img in the folder STATIC located in the same directory as manage.py .

I have already made the configurations in settings.py , and in the file base.html (where I save the links and bootstrap scripts) .

What else can I try?

"""
Django settings for ecommerce project.

Generated by 'django-admin startproject' using Django 2.1.4.

For more information on this file, see
https://docs.djangoproject.com/en/2.1/topics/settings/

For the full list of settings and their values, see
https://docs.djangoproject.com/en/2.1/ref/settings/
"""
import os
from django.conf import settings
settings.configure()


# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/2.1/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'dj6+vwesy90zg=)4k6&wktb!$om5eqqd9#&otrtv(&7t%e%!(r'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = []


# Application definition

INSTALLED_APPS = [
    'bootstrap4',
    'shop.apps.ShopConfig',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'ecommerce.urls'

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',
            ],
        },
    },
]

WSGI_APPLICATION = 'ecommerce.wsgi.application'


# Database
# https://docs.djangoproject.com/en/2.1/ref/settings/#databases

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}


# Password validation
# https://docs.djangoproject.com/en/2.1/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]


# Internationalization
# https://docs.djangoproject.com/en/2.1/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.1/howto/static-files/
STATIC_URL = '/static/'
STATIC_DIRS = os.path.join(BASE_DIR, "static")

STATICFILES_DIRS = [
    STATIC_DIRS
]


MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'products/')

CART_SESSION_ID = 'cart'
    
asked by Martin Castellon 31.12.2018 в 05:12
source

1 answer

0

To be able to load the static files of your project, you must first create the folder called static which, based on what you have already mentioned, is created in your project and should look something like this ( more or less):

  static
   ├───css
   └───js

After that, the following line should be added to the settings.py file.

STATIC_URL = '/static/'

To reference your static files and know where to look.

Finally, you should refer to each of the templates you have.

  

That by the way, you should have in another folder, called templates   and likewise it has to be referenced in TEMPLATES

'DIRS': [os.path.join(BASE_DIR, 'templates')],

Such that:

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')], # para agregar la direccion de tus plantillas HTML
        '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',
            ],
        },
    },
]

Within each template you should refer to the files static :

{load staticfiles}

To make your static files upload to your template, you must call them

For the CSS

<link href="{% static '/css/style.css' %}" type="text/css" rel="stylesheet" media="screen,projection" />   

For JS

 <script src="% static 'js/javascript.js' %"></script>

Everything together would look something like this:

{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Ejemplo</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" media="screen" href="main.css" />
    <script src="main.js"></script>

    <!-- para hacer referencia a los archivos static -->
    <link href="{% static '/css/style.css' %}" type="text/css" rel="stylesheet" media="screen,projection" />

</head>
<body>


    <!-- para los archivos js -->
    <script src="% static 'js/javascript.js' %"></script>
</body>
</html>
    
answered by 31.12.2018 в 16:30