[Django]-Invalid block tag: 'static'

by

8👍

✅

Make sure that ‘django.contrib.staticfiles’ is included in your
INSTALLED_APPS.

👤doniyor

101👍

This worked for me

If django >= 1.11

{% load static %}

If django < 1.11

{% load staticfiles %}
👤Alexandre Simões

70👍

include 

{% load static %}

just above tag in your html file, it will make HTML file to load static files like css, js, images etc

👤cryptoKTM

22👍

add {% load static %} at the top of html file, under the DOCTYPE html line

👤Александр Коньшин

9👍

07 Sept, 2020
i also faced the same problem on Django 3.2.2
and this worked for me.

{% load static %}
👤Saiful Islam

5👍

{% load static %}
or
{% load staticfiles %}

both will work.
Just be sure you use equal amount of spaces between opening and closing of ‘{‘ and ‘%’.

👤Krutik Shah

3👍

include {% load static %} in your html file.

That’s what worked for me

👤Wendo Nyang

2👍

Hint: be sure that you use {% load static %} in all templates your using to extend static files. Extending a base.html file doesn’t carry over {% load static %} for you.

👤Marcus

1👍

It’s OK now. I resolved it myself.
I’m sorry. I confused two similar html files. The one I put on here (header.html) was right but header_authenticated.html was wrong.

👤Yan Yang

0👍

For a folder structure like this

myproject/
    manage.py
    myapp/
        __init__.py
        models.py
        views.py
        static/
            style.css
        templates/
            base.html
            index.html

In your settings.py, make sure you have

# Application definition

INSTALLED_APPS = [
    ...
    'django.contrib.staticfiles',
    ...
]

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/4.1/howto/static-files/

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

In your base.html template, make sure to have {% load static %} tag, like

<html>
  <head>
    <title>{% block title %}Add App Title here{% endblock %}</title>
    {% load static %}
    <link rel="stylesheet" href="{% static 'style.css' %}">
  </head>
  <body>
    {% block content %}{% endblock %}
  </body>
</html>

Then, you’ll want to run python manage.py collectstatic which will generate a staticfiles/ folder in the root of myproject/ (where manage.py is). That’s it!

If you use Docker, then make sure to include in your Dockerfile the following step

RUN python manage.py collectstatic --noinput

If you will to know more about to serve static files in production, consider this answer.

👤Tiago Martins Peres

Leave a comment