Question

192

django how to include javascript in template

rated 0 times [ 196] [ 4] / answers: 1 / hits: 142525 / 9 Years ago, mon, may 18, 2015, 12:00:00

I'm working on a project and following the documentation. I didn't succeed to include javascript.

Here is my settings:

STATIC_URL = '/static/'



STATICFILES_DIRS = (

    os.path.join(BASE_DIR, "static"),

)



STATIC_ROOT = '/static/'



TEMPLATE_DIRS = (

    os.path.join(BASE_DIR, 'templates'),

)

So, I have created a static folder with a javascipt file in my project.

myproject/static/app.js

my urls.py:

urlpatterns = [

    url(r'^$', 'app.views.home'),

    url(r'^admin/', include(admin.site.urls)),

] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

and in my template:
myproject/templates/base.html:

<!DOCTYPE html>

<head>

  {% load static %}

  <script src="{% static 'app.js' %}"></script>   

  <title>Site</title>

</head>

<body>

<img src="{% static 'img.png' %}" alt="Mon image" />

  {% block content %}{% endblock %}

</body>

</html>

My other template:

{% block content %}

    hello world

{% endblock %}

I have the "hello world" on

http://127.0.0.1:8000/

but i do not have my image or script.

I tried so many different things but I never succeed

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

kaitlynd

Add To Favorites

Follow

Total Points: 470

Total Questions: 108

Total Answers: 120

Location: Faroe Islands

Member since Thu, Apr 8, 2021

3 Years ago

answered 9 Years ago miles · Accepted Answer

urls.py

from django.conf.urls import include, url

from django.contrib import admin



urlpatterns = [

    url(r'^admin/', include(admin.site.urls)),

]

settings.py

STATICFILES_DIRS = (

    os.path.join(BASE_DIR, static),

)



STATIC_URL = '/static/'



# remove STATIC_ROOT

base.html

Your title tag was not closed.

<!DOCTYPE html>

<head>

  {% load static %}

  <script src={% static 'app.js' %}></script>   

  <title>Site</title>

</head>

<body>

<img src={% static 'img.png' %} alt=Mon image />

  {% block content %}{% endblock %}

</body>

</html>