Twitter Bootstrap not displaying in Template

Question

I am following https://pypi.python.org/pypi/django-twitter-bootstrap/3.0.0 to include twitter bootstrap into my website. However, When I was testing it out, I'm not getting the expected results. I went on the bootstrap website to test out some of the things I can include on my page but they aren't being display. Please help me with this issue! Thank you!

Here is my HTML file.

 <!DOCTYPE html> <html> <body> <div class="modal hide fade"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <h3>Modal header</h3> </div> <div class="modal-body"> <p>One fine body…</p> </div> <div class="modal-footer"> <a href="#" class="btn">Close</a> <a href="#" class="btn btn-primary">Save changes</a> </div> </div> </body> </html>

I've added these portions to my settings.py:

 INSTALLED_APPS = ( ..., ..., 'registration', 'twitter_bootstrap', 'pipeline', 'homepage', ) STATICFILES_STORAGE = 'pipeline.storage.PipelineCachedStorage' PIPELINE_COMPILERS = ( # used for compiling LESS files 'pipeline.compilers.less.LessCompiler', ) PIPELINE_CSS = { 'bootstrap': { 'source_filenames': ( 'less/bootstrap.less', ), 'output_filename': 'css/b.css', 'extra_context': { 'media': 'screen,projection', }, }, } PIPELINE_JS = { 'bootstrap': { 'source_filenames': ( 'js/transition.js', 'js/modal.js', 'js/dropdown.js', 'js/scrollspy.js', 'js/tab.js', 'js/tooltip.js', 'js/popover.js', 'js/alert.js', 'js/button.js', 'js/collapse.js', 'js/carousel.js', 'js/affix.js', ), 'output_filename': 'js/b.js', }, 'application': { 'source_filenames': ( 'js/holder.js', 'js/application.js', ), 'output_filename': 'js/a.js', } }

karthikr · Accepted Answer · 2013-09-07 22:38:04Z

1

It seems like you got the settings right, but you also need to load the compressed files in the html file.

{% load compressed %} <head> {% compressed_js 'bootstrap' %} {% compressed_css 'bootstrap' %} </head>

Read more on usage on the documentation (Readme) of django-bootstrap here

answered Sep 7, 2013 at 22:38

karthikr

100k26 gold badges208 silver badges191 bronze badges

Sign up to request clarification or add additional context in comments.

14 Comments

karthikr Over a year ago

Use {# {% compressed_css 'bootstrap'%} #} for comments. Also, some issue with the less compiler. That issue is addressed here

karthikr Over a year ago

check this setting: django-pipeline.readthedocs.org/en/latest/… Have you changed the default location ? S

karthikr Over a year ago

have you installed less compiler (lesscss.org) ? (have not used less myself, but thats what this looks like)

Liondancer Over a year ago

So i think I got it working! It's not pretty but it works!! thank you so much for all your help! I really appreciate it!!!

karthikr Over a year ago

glad it helped. may be the more you use, you can figure out the pretty way of doing it

|

Collectives™ on Stack Overflow

Twitter Bootstrap not displaying in Template

1 Answer 1

14 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

14 Comments

Linked

Related