Menu
I want to use Twitter Bootstrap in my Django application and for this purpose modified the template in the following way:
<!DOCTYPE html>
<html>
<head>
<title>{{ genplan.name }}</title>
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
</head>
<body>
<h1>{{ genplan.name }}</h1>
<ol>
{% for cur_goal in goals %}
<li>{{ cur_goal.description }}</li>
{% endfor %}
</ol>
...
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
MEDIA_ROOT and MEDIA_URL are set correctly.
MEDIA_ROOT = 'D:/dev/ccp/ccp-gp/media'
MEDIA_URL = '/media/'
However, nothing has changed after I added the Bootstrap stylesheets (the look of that page didn't change) and I suppose that Django doesn't find the Bootstrap resources.
What may have caused this problem?
Update 1:
When I use this code in urls.py
urlpatterns = patterns('',
(r'^$', 'ccp_gp.general_plans.views.home'), (r'^media/(?P<path>.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT}) )
Python complains about undefined settings variable.
661
It is very easy to use Bootstrap in Django. Since Bootstrap is a front-end framework, it completely consists of CSS & JavaScript files. These files are considered static on the server-side.
Twitter Bootstrap is a front end framework to develop web apps and sites fast. In modern web development, there are several components which are required in almost all web projects. Bootstrap provides you with all those basic modules - Grid, Typography, Tables, Forms, Buttons, and Responsiveness.
Bootstrap is referred to as Twitter Bootstrap because it was developed by two employees Mark Otto and Jacob Thornton at Twitter. It was originally called Twitter Blueprint before it was released as an open-source project on Github in August of 2011.
There's no difference. Twitter Bootstrap was the official name for version 1.0 (Twitter Bootstrap). Later the name has been shortened.
You need to use the MEDIA_URL when loading the css and js:
<link href="{{ MEDIA_URL }}css/bootstrap.min.css" rel="stylesheet" media="screen">
<script src="{{ MEDIA_URL }}js/bootstrap.min.js"></script>
Unless you have to use an old Django version which does not come with the static files app I would recommend to use STATIC_URL instead and put the files into the static directory of your app.
<link href="{{ STATIC_URL }}css/bootstrap.min.css" rel="stylesheet" media="screen">
<script src="{{ STATIC_URL }}js/bootstrap.min.js"></script>
As stated in the comments your {{ MEDIA_URL }} is empty. In order to fix that make sure that the TEMPLATE_CONTEXT_PROCESSORS settings contains the 'static' and 'media' context processor. Unless you have modified the TEMPLATE_CONTEXT_PROCESSORS settings this is already the case.
The template context processors are only used when rendering a template with the RequestContext. Starting with Django 1.3 the best way to do this is by using a TemplateResponse.
For example:
from django.template.response import TemplateResponse
def index(request):
genplan = ...
goals = ...
return TemplateResponse(request, 'index.html', {
'genplan': genplan,
'goals': goals,
})
For the files in the MEDIA_DIR to be delivered via the the development server (manage.py runserver) you can add the following code to your urls.py:
from django.conf import settings
if settings.DEBUG:
urlpatterns += (
url(r'^media/(.*)$', 'django.views.static.serve',
{'document_root': settings.MEDIA_ROOT}),
)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
