Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Django - referencing static files in templates

I'm having difficulty referencing static files in my templates. I am using Twitter Bootstrap and have the bootstrap files (css, img, js) sitting at mysite/static.

I have set the STATIC_URL, STATIC_ROOT and TEMPLATE_CONTEXT_PROCESSORS according to this tutorial. I have run ./manage.py collectstatic which copied 72 files over. I have also added the below template tag to my template (index.html) file but this hasn't worked.

{% load staticfiles %}
<link rel="stylesheet" href="{% static user_stylesheet %}" type="text/css" media="screen"/>

Any help on how to reference the files so that the bootstrap styling returns to the templates would be much appreciated!

like image 264
Jess Avatar asked Dec 23 '12 18:12

Jess


People also ask

How does Django find static files?

Using the collectstatic command, Django looks for all static files in your apps and collects them wherever you told it to, i.e. the STATIC_ROOT . In our case, we are telling Django that when we run python manage.py collectstatic , gather all static files into a folder called staticfiles in our project root directory.

Can Django serve static files in production?

Static Files in Development Mode During development, as long as you have DEBUG set to TRUE and you're using the staticfiles app, you can serve up static files using Django's development server. You don't even need to run the collecstatic command.

What is the use of Collectstatic in Django?

Collects the static files into STATIC_ROOT. Duplicate file names are by default resolved in a similar way to how template resolution works: the file that is first found in one of the specified locations will be used. If you're confused, the findstatic command can help show you which files are found.


2 Answers

It should be

{% load static %}

And then something like

<!-- path -->
<link href="{% static 'bootstrap/css/bootstrap.css' %}" rel="stylesheet" type="text/css">
<!--->

Update for Completeness

Folder Structure

  • proj
  • app1
  • app2
  • myproj_public
  • static
    • css
      • bootstrap.css
    • js
      • xyz.js

Settings File

STATIC_ROOT = os.path.join(os.path.abspath(
    os.path.join(PROJECT_ROOT, 'myproj_public', 'static')), '')

STATIC_URL = '/static/'
like image 99
super9 Avatar answered Oct 05 '22 14:10

super9


Are you setting the user_stylesheet context variable in your view? You need to set that before you can pass it onto templates.

I usually just use the {{ static_url }} tag for doing this stuff, so my code for including bootstrap components would be like.

<link href="{{ STATIC_URL }}bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
<script src="{{ STATIC_URL }}bootstrap/js/jquery.js"></script>

Assuming that bootstrap folder is present inside static.

EDIT

For your case, to set user_stylesheet context variable, you'll need to do something like

dict["user_stylesheet"]= <path to your file>
#add other context variables you might have to
render_to_response(<your template name>, dict, context_instance=RequestContext(request))
like image 32
ersran9 Avatar answered Oct 05 '22 14:10

ersran9