可以修改bootstrap 3 HTML模板以使用W/Drupal 8嗎？

很多興奮點和許多點擊讓我擁有了兩件似乎不自然兼容的東西：廣泛的（編譯我相信 - 沒有LESS或SASS文件夾/文件）Bootstrap 3網站模板（Unify）和一個帶有Bootstrap基本主題的Drupal 8安裝。大約10多個小時的研究/測試讓我難以置信：可以修改bootstrap 3 HTML模板以使用W/Drupal 8嗎？

試圖修改一個通用的Bootstrap 3 HTML網站模板（像我購買的那個）與Drupal 8一起工作是否可行/合理/有效？或者它或者（Bootstrap 3獨立於Drupal 8 + Bootstrap基本主題）？

我有興趣瞭解這是一個知識淵博的人能在一兩個小時或十幾個小時內完成的事情。如果有幫助，差異開始像這樣加起來：

完全不同的文件結構比Drupal的主題化
試圖手動包括在libraries.yml
內容噸.css和.js文件的插件硬編碼到HTML？所以我相信這意味着完全使用Drupal主題重新創建它們（？）

來源

2016-09-26 Eirene

儘管這是一個小型項目，但我最近做了類似的事情。

Drupal 8（核心）沒有硬編碼的HTML（或非常非常少）。您可能對contrib模塊有不同的體驗。

我不認爲主題結構是一個障礙。這只是在libraries.yml文件中包含正確的文件的問題。

主要戰鬥是，你將不得不覆蓋twig文件，以便爲元素分配正確的（bootstrap）類。

input--submit.html.twig

例如，這將增加引導btn，btn-block和btn-lg類所有提交按鈕。

我還定製了提交按鈕以接受圖標屬性（data-icon）。對於現有表單，您需要使用hook_form_alter來添加屬性。對於您自己的表格，您可以將其添加到#attributes陣列中。

{% set classes = [ 
    'btn', 'btn-block', 'btn-lg', 
] %} 

<button{{ attributes.addClass(classes) }}> 
    <span class="glyphicon {{ attributes['data-icon'] }}"></span> 
    <span>{{ attributes.value }}</span> 
</button>{{ children }}

input--password.html.twig

這是密碼形式元件。我添加了form-control類。

<input{{ attributes.addClass("form-control") }} />{{ children }}

block--clean-main-menu.html.twig

至於另一個，最終，比如我想有該網站的靜態菜單的頂部，所以我不得不添加navbar類。

{% set heading_id = attributes.id ~ '-menu'|clean_id %} 
<nav {{ attributes.addClass('navbar navbar-default navbar-static-top') }}> 
    <div class="container"> 
    <div class="col-lg-12"> 
     {% block content %} 
     {{ content }} 
     {% endblock %} 
    </div> 
    </div> 
</nav>

正如我在一開始寫的這是一個小項目。你會爲更大的項目做更多的工作，或者你想爲不同的提交按鈕提供不同的樣式（提示：使用hook_theme_suggestions_field_alter添加新的主題覆蓋）。

我們與我公司和完全覆蓋每一件小事，是常有的事，所以我們已經習慣了它很多的100％定製主題的工作;）

另外，不要忘記安裝devel的擴展。當你想知道哪個twig文件用於什麼時，它會幫助你很多。

來源

2016-09-26 13:28:27

非常感謝！ :)這對我來說現在有點陌生，但我非常感謝你的迴應，所以我會潛入！和/或聽起來我可能至少可以諮詢一家公司（不得不找到一家）關於定製的成本，因爲它可能不是太天文數字。真心感謝！ – Eirene

可以修改bootstrap 3 HTML模板以使用W/Drupal 8嗎？

回答

相關問題