Django với Twitter Bootstrap3 và Chủ đề

Question

Tôi đã nghiên cứu một thời gian dài và thử nghiệm và tôi dường như không thể tìm ra cách tốt nhất để thực hiện điều này. Tôi biết tôi đang làm sai, do đó, một số làm rõ cũng như một số ví dụ nhanh chóng sẽ giúp rất nhiều.

Tôi đã tự hỏi về việc sử dụng chủ đề bootstrap3 từ https://wrapbootstrap.com/ với Django. Tôi đã nghiên cứu các gói django-bootstrap3 và django-bootstrap-themes. Trên trang github của django-bootstrap-themes nó nói nó tương thích với bootswatch. Tôi không thích chủ đề của họ vì vậy tôi đã tự hỏi nếu nó tương thích với các chủ đề wrapbootstrap.com. Các chủ đề tôi sẽ chọn từ wrapbootstrap.com là các chủ đề HTML đáp ứng. Tôi muốn biết nếu ra khỏi kinh nghiệm cá nhân bất cứ ai biết được những gói nào là tốt nhất cho việc sử dụng các chủ đề từ wrapbootstrap.com với django.

Tôi hiểu rằng có thể chỉ lấy chủ đề các bảng định kiểu, tập lệnh, đặt chúng vào các thư mục tương ứng của chúng trong tĩnh và chuyển cơ sở HTML thành mẫu cơ bản cũng như các trang khác. Sau đó cài đặt bootstrap từ CDN. Tôi biết điều này cũng có thể với django-bootstrap3. Nhưng tôi không thể tìm thấy câu trả lời ở bất cứ nơi đâu là cách tốt nhất để đi về việc tích hợp một trong những chủ đề và twitter bootstrap3 vào một trang web Django, và một số ví dụ nhanh chóng làm điều này.

Cảm ơn và mọi lời khuyên để làm như vậy sẽ giúp ích rất nhiều.

Answer 1

Gói django-bootstrap3 là một ứng dụng tiện ích tốt đẹp cho phép bạn tạo ít đánh dấu HTML hơn trong các mẫu của mình, nếu không sẽ cần thiết để bootstrap hoạt động. Nó sử dụng một số thẻ mẫu bổ sung cho mục đích này.

Tôi thấy gói này đẹp và đôi khi tôi sử dụng nó, nhưng nó thường là sau khi bạn đã tham gia tốt vào bootstrap mà bạn đánh giá cao nó.

Gói django-bootstrap-themes dường như là một ứng dụng mà nó cũng cung cấp một số thẻ mẫu như gói cũ, nhưng dường như ít hơn. Nhưng nó cũng cho phép bạn dễ dàng tích hợp các chủ đề từ Bootswatch vào các mẫu Django của bạn, mà là tốt đẹp nếu bạn tìm thấy những mẫu hấp dẫn. Khác hơn là tôi cá nhân không tìm thấy lý do nào khác để sử dụng nó. Nhưng một lần nữa, cả hai gói có thể được sử dụng cùng nhau nếu nó phù hợp với bạn.

Một số ví dụ:

Để có được bootstrap đi trong các mẫu của bạn mà không bất kỳ gói khác, bạn sẽ phải bao gồm trong cơ sở tập tin html của bạn:

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

Và tại Kết luận:

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

Với django-bootstrap3 01.236 này:

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

Nhưng một số đánh dấu khác được đơn giản hóa rất nhiều.Ví dụ một hình thức bootstrap (xem the official docs example) sẽ trở thành dễ dàng như:

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

Để nạp bootstrap với django-bootstrap-theme:

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

Và rõ ràng đây là cách bạn sẽ sử dụng một trong các chủ đề từ bootswatch:

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

Tóm lại, nếu bạn muốn sử dụng bất kỳ sản phẩm nào khác làm sẵn chủ đề bootstrap trong các mẫu của bạn, bạn vẫn sẽ cần phải đi với các phương pháp tiếp cận tiêu chuẩn mà bạn mô tả trong câu hỏi của bạn, có thể sử dụng một số công cụ trên đầu trang.