Twitter Bootstrap不在模板中显示

时间:2013-09-07 22:33:48

标签: python html django twitter-bootstrap

我正在关注https://pypi.python.org/pypi/django-twitter-bootstrap/3.0.0将Twitter引导程序包含到我的网站中。但是,当我测试它时,我没有得到预期的结果。我去了bootstrap网站测试我可以在我的页面上包含的一些东西,但它们没有显示。请帮我解决这个问题!谢谢!

这是我的HTML文件。

    <!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>

我已将这些部分添加到我的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',
        }
    }

1 个答案:

答案 0 :(得分:1)

看起来您的设置正确,但您还需要加载 html文件中的压缩文件。

{% load compressed %}

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

详细了解django-bootstrap here

文档(自述文件)的使用情况