Home Ask Login Register

Developers Planet

Your answer is one click away!

Zeus February 2016

Bootstrap static files not being included in Django template

I'm new to Django, and facing issues rendering bootstrap on a django page.

This is my base html,

{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Dropbox Web App Prototype</title>

    <!-- Bootstrap -->
    <link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
   <div class="jumbotron">
       <h1>Hello, world!</h1>
        <p>This is a template showcasing the optional theme stylesheet included in Bootstrap. Use it as a starting point to create something more unique by building on or modifying it.</p>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>

The static file is at the same level as the project directory and has the following structure,


BlueDog February 2016

just define additioaly static url in your settings as follow somewhere on the bottom:

STATIC_URL = '/static/'

and check again if your bootstrap is served

Aviah Laor February 2016


<link rel="stylesheet" type="text/css"  href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"  crossorigin="anonymous">


In urls for django runserver:

if settings.DEBUG:
    urlpatterns += [url(r'^static/(?P<path>.*)$', views.serve),]

When running from the webserver, you need to config an alias. Nginx example:

location  /static { 
    alias /home/username/mysite/static;}


STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, "static"),)

Luis Chavier February 2016

BASE_DIR is defined by default to:

BASE_DIR = os.path.dirname(os.path.dirname(__file__))

Here __file__ is actually settings.py, so BASE_DIR is on the parent directory, the one that contains manage.py.

It seems your static folder is on another level, so just move it to the same level as manage.py and it should work.

BlueDog February 2016

can you paste your BASE_DIR ? Can you set it to: BASE_DIR to BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))

SpeedyH30 February 2016

In the html replace this

<link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">

with this

<link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">

and check this is in the settings.

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

Post Status

Asked in February 2016
Viewed 3,416 times
Voted 8
Answered 5 times


Leave an answer

Quote of the day: live life

Devs Planet ®

2014-2016 www.devsplanet.com

Devs Planet © all rights reserved