將Twitter Bootstrap與Wordpress一起使用

如何將Wordpress與Twitter Bootstrap一起使用？我知道如何設置一個Wordpress頁面，並且我已經使用Bootstrap，但現在我想第一次使用這兩個頁面。將Twitter Bootstrap與Wordpress一起使用

對於我的Wordpress項目，我通常只安裝Wordpress，並從頭開始創建一個新的主題。對於我的Bootstrap項目，我總是使用Initializr來構建模板。

現在使用Google我發現了各種各樣的「Bootstrap主題」和插件，我需要其中之一嗎？我想用自己的顏色等自定義引導外觀，使用LESS，這就是爲什麼我問。我只是很難理解這兩者如何協同工作，我還沒有找到任何好的資源。

來源

2012-07-17 Sven

我不認爲這裏有什麼特別的。你應該在bootstrap css之上構建你的主題，它應該可以工作。進一步你可能會對這個[插件]感興趣（http://wordpress.org/extend/plugins/facebook/） – defau1t 2012-07-17 17:38:14

這是一個額外的信息，但這與twitter bootstrap無關 – defau1t 2012-07-17 17:50:51

謝謝 - 那麼它就像我希望。但是肯定你想鏈接到一個名爲「Facebook」的插件？ ;-) – Sven 2012-07-17 17:40:19

會有解決這幾個方面，但這裏是我一直在做什麼......

把你最喜歡的起點主題的副本
下載完整引導回購（少和一切）並將其彈出到您的主題文件夾中。
在bootstrap文件夾內創建一個名爲'css'的文件夾，並將其設置爲您的位置以輸出已編譯的'bootstrap.css'文件。
再向上的主題根，打開「styles.css的」，更改主題名稱等，你會如果你正在創建一個新的主題，刪除所有的風格和只添加一行代碼@import url("bootstrap/css/bootstrap.css");
你應該現在可以從'wp-admin'的'外觀'菜單中選擇這個新主題。
它顯然看起來很可怕，但是一旦你將一些主題類/ ID添加到'layout.less'中。然後運行'variables.less'來添加基本主題，你將會得到某個地方。
除此之外，您必須通過每個模板文件並考慮所有類/ ID，有時編輯主題以更好地利用現有的引導類，但有時需要添加自己的引導類自定義類來引導。

這相當耗時，但一旦完成，它顯然可以重新用於加速未來的項目。

順便說一下，我也一直在使用這個原理構建主題，但都是基於http://stuffandnonsense.co.uk/projects/320andup/這兩個偉大的項目。我建議看看哪種最適合你。

來源

2012-07-18 14:18:19

您可以隨時使用Twitter Bootstrap WordPress插件。它是完全免費的WordPress.org上的位置：http://wordpress.org/extend/plugins/wordpress-bootstrap-css/

還有很多簡碼的包含，所以你可以包括你的網頁和帖子中的引導要素 - 有它的全部演示頁面在這裏：http://worpit.com/wordpress-twitter-bootstrap-css-plugin-home/wordpress-shortcodes-demo/

希望幫助你開始吧！

來源

2013-02-11 17:16:54

我在這裏回答了同樣的問題之前在stackoverflow。我覺得這是晚了分享，但對於那些正在尋找這樣的教程，只需點擊超鏈接標題：Using Twitter Bootstrap in Wordpress。

來源

2013-10-26 07:12:03 user2922385

有一個快速的方法來做到這一點，你的主題用作曲：

作曲家。json

{ 
     "config": { 
         "component-dir": "lib/composer", 
         "vendor-dir": "lib/composer", 
         "bin-dir" : "bin/composer", 
         "cache-dir" : "var/cache/composer" 
     }, 
     "require": { 
         "twitter/bootstrap": "3" 
     } 
}

注意：我刪除了其他作曲家的部分和要求以及phing整合來降低複雜度。

執行

composer install

然後在你的主題，這個句子

$bootUri = get_template_directory_uri() . '/lib/composer/twitter/bootstrap/dist/css/bootstrap.css'; 

    wp_enqueue_style('sindy_bootstrap', $bootsUri);

等瞧添加/lib/composer/twitter/bootstrap/dist/css/bootstrap.css！ :)

來源

2014-01-18 11:19:44 corretge

將Twitter Bootstrap與Wordpress一起使用

回答

相關問題