如何在 WordPress 中使用短碼添加 Twitter Bootstrap CSS

為您的內容添加 CSS 元素如工具提示、多彩按鈕和滾動效果，可以幫助您的網站更具吸引力。問題在於大多數人並不知道如何使用 CSS 來添加多彩的按鈕，表格，標籤等。我們已經向您展示了如何在 WordPress 中添加多彩的 widgets 和表格。在這篇文章中，我們將展示如何使用短碼在 WordPress 中添加 Twitter Bootstrap CSS。

Twitter Bootstrap 是一個幫助快速提升網站設計和功能的 CSS 和 JavaScript 框架，它由 Twitter 的 Mark Otto 和 Jacob Thornton 開發，作為鼓勵內部工具一致性的框架。後來它被釋放為一個開源工具。它是漂亮的，簡單的，並且兼容所有瀏覽器。

安裝和激活插件

首先，您需要安裝並啟用 WordPress Twitter Bootstrap CSS 插件。啟用後，插件會在您的 WordPress 管理後台添加一個 Twitter Bootstrap 菜單項。點擊它將進入插件的儀表板。

在儀表板上，您會看到許多插件作者添加的廣告。瀏覽過它們，您會看到可以添加到文章中的短碼。每個短碼都鏈接到插件的支持頁面，您可以在那裡查看這些短碼的更多用法示例。

配置 Bootstrap CSS 設置

在管理後台的 Twitter Bootstrap 菜單項下，有一個鏈接來配置 Bootstrap CSS 設置。點擊該鏈接將進入配置頁面，您可以根據需要更改設置。您可以選擇要使用的 Bootstrap CSS 版本。下面的選項更適合進階用戶。

在文章中添加 Bootstrap CSS 元素

現在我們已經了解了配置，讓我們將一些 Bootstrap CSS 元素添加到博客文章中。只需將如下短代碼粘貼到您的文章或頁面內容中：

[TBS_BUTTON id="mySpecialButton" color="primary" class="btn-large" link="http://example.com"]下載[/TBS_BUTTON]
[TBS_BUTTON id="mySpecialButton" color="danger" link="http://example.com"]取消[/TBS_BUTTON]
[TBS_BUTTON id="mySpecialButton" color="success" link="http://example.com"]了解更多[/TBS_BUTTON]
圖標：
[TBS_ICON class="icon-globe"]
[TBS_ICON class="icon-globe"]
[TBS_ICON class="icon-chevron-right"]
[TBS_ICON class="icon-music"]
[TBS_ICON class="icon-film"]
[TBS_ICON class="icon-user"]
[TBS_ICON class="icon-wrench"]
[TBS_LABEL class="warning"]警告：標籤[/TBS_LABEL]
[TBS_LABEL class="danger"]危險：標籤[/TBS_LABEL]
[TBS_LABEL class="success"]綠色：標籤[/TBS_LABEL]
[TBS_ALERT class="success"]設置已保存[/TBS_ALERT]

這些短碼在博客文章中將顯示如下：

還有更多的 CSS 元素可以添加到您的文章中。工具提示、手風琴菜單、彈出框、進度條等。這個插件的網站有更多關於如何使用這些功能的文件。如果您對圖標感到好奇，可以查看 Twitter Bootstrap 的官方網站，該網站上有完整的圖標集，您可以使用。

我們知道像 Genesis 和其他主題框架包含他們自己的選項。您在文章中使用 CSS 元素嗎？請在下面留言告訴我們。