Python

I’ve recently started learning Django and I’ve been having a lot of issues with implementing css into my code. I’ve found a lot of people with the same issue as me but I am still unable to find an answer.

Currently when I run open the website it give me this https://imgur.com/a/0N23s7b

And I’m not sure if this is because of the settings, the actual css or something in the html.

My html boilerplate

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>homepage</title>
<link rel="stylesheet" type="test/css" href="{% static'css/home.css' %}"/>
</head>

JavaScript
​x
 
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>homepage</title>
<link rel="stylesheet" type="test/css" href="{% static'css/home.css' %}"/>
</head>
​

settings.py

DEBUG = True
STATIC_ROOT = ''

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)
ALLOWED_HOSTS = ['127.0.0.1', 'localhost']

STATIC_URL = '/static/'

JavaScript
 
DEBUG = True
STATIC_ROOT = ''
​
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)
ALLOWED_HOSTS = ['127.0.0.1', 'localhost']
​
STATIC_URL = '/static/'
​

views.py

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

from leatherbiscuit.views import index

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', index),
]
if settings.DEBUG:
    urlpatterns+=static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)

JavaScript
 
from django.contrib import admin
from django.urls import path
from django.conf import settings
from django.conf.urls.static import static
​
from leatherbiscuit.views import index
​
urlpatterns = [
    path('admin/', admin.site.urls),
    path('', index),
]
if settings.DEBUG:
    urlpatterns+=static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)   
​

urls.py

from django.shortcuts import render
from django.http import HttpResponse
from django.views.generic import TemplateView

    
def index(request):
    return render(request, 'index.html')

def home_view(request):
return HttpResponse(request, 'index.html')

JavaScript
 
from django.shortcuts import render
from django.http import HttpResponse
from django.views.generic import TemplateView
​
    
def index(request):
    return render(request, 'index.html')
​
def home_view(request):
return HttpResponse(request, 'index.html') 
​

Answer

You need to add a space between the name of the template tag and its parameters, so it should be:

         &downarrow; a space between static and 'css/home.css'
{% static 'css/home.css' %}

JavaScript
 
         &downarrow; a space between static and 'css/home.css'
{% static 'css/home.css' %}

The parser of the Django template engine has some peculiarities. For example, a tag should not be spanned over multiple lines, and like in Python’s method calls one should first list the positional parameters and then the named parameters.

Django – issue with loading css

Advertisement

Answer