拥有Twitter Bootstrap3和主题的Django

Question

我已经研究了很长时间，并进行了实验，但我似乎找不出实现这一目标的最佳方法。我知道我做错了，所以一些澄清以及一些快速的例子会有很大帮助。

我想知道如何在Django中使用来自bootstrap3的https://wrapbootstrap.com/主题。我研究了django-bootstrap3和django-启动主题包。在django的github页面上--启动主题--它说它与bootswatch兼容。我不喜欢它们的主题，所以我想知道它是否与wrapbootstrap.com主题兼容。我从wrapbootstrap.com中选择的主题是Responsive。我想知道，根据个人经验，是否有人知道这些包中哪些最适合使用来自wrapbootstrap.com和django的主题。

据我所知，只需从主题中获取样式表、脚本，将它们放入各自的静态文件夹中，并将HTML基转换为基本模板和其他页面即可。然后从CDN安装引导程序。我知道django-bootstrap3也可以做到这一点。但我在任何地方都找不到答案，也找不到目前将其中一个主题和twitter bootstrap3集成到Django网站的最佳方法，以及一些快速的例子。

谢谢，任何这样做的建议都会有帮助。

Answer 1

包django-bootstrap3是一个不错的实用程序，它允许您在模板中生成更少的HTML，否则需要引导才能工作。为此，它使用了一些额外的模板标记。

我发现这个包很不错，有时我会使用它，但通常是在你很好地参与了引导之后，你才会欣赏它。

包django-bootstrap-themes似乎是一个应用程序，它也提供了一些模板标签，像以前的软件包，但显然较少。但是，它还允许您轻松地将来自Bootswatch的主题集成到Django模板中，如果您发现这些模板具有吸引力，这是很好的。除此之外，我个人认为没有其他理由使用它。但同样，如果适合您的话，这两个包可以一起使用。

下面是一些例子：

为了在模板中使用引导程序而不使用任何其他包，您必须在基本html文件中包含以下内容：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
{# HTML5 shiv 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>
<![endif]-->

在底部：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

用django-bootstrap3这个becomes

{% load bootstrap3 %}
{% bootstrap_css %}
{% bootstrap_javascript %}

但是其他一些标记变得非常简单。例如，引导表单(请参阅the official docs example)将变得很容易，因为：

<form action="/url/to/submit/" method="post" class="form">
  {% csrf_token %}
  {% bootstrap_form form %}
  {% buttons %}
    <button type="submit" class="btn btn-primary">
      {% bootstrap_icon "star" %} Submit
    </button>
  {% endbuttons %}
</form>

用django-bootstrap-themes加载引导程序

{% load bootstrap_themes %}
{% bootstrap_script use_min=True %}

显然，这就是您如何使用bootswatch中的一个主题：

{% bootstrap_styles theme='cosmo' type='min.css' %}

总之，如果您希望在模板中使用任何其他现成的引导主题，您仍然需要使用您在问题中描述的标准方法，可能需要使用上面的一些工具。