Reverie：基於基礎的WordPress首發主題

Reverie：一個基於Foundation框架的WordPress入門主題

Reverie是一個基於ZURB Foundation框架的WordPress入門主題，它為主題開發提供了堅實的基礎，包括響應式網格、排版、按鈕樣式和其他組件。其輕量級和極簡的設計能夠提升網站性能。

定制Reverie

您可以直接修改CSS和PHP文件或使用WordPress自定義器來進行更簡單的更改。該主題支持子主題，允許您進行更改而不會影響原始主題文件，從而方便更新主題而不會丟失自定義設置。

Reverie對開發者和熟悉基本HTML和CSS的初學者都非常友好。它開箱即用地支持WooCommerce，支持多語言網站翻譯，並兼容所有現代瀏覽器。該主題還支持自定義文章類型，並定期更新以兼容最新版本的WordPress和Foundation框架。

關鍵決策：子主題

定制任何基礎主題或入門主題時，都需要評估是否需要子主題。如果您要保持主題更新，則絕對需要使用子主題。主要原因是，當您更新主主題時，您所做的所有更改都可能會丟失。如果您正在為客戶構建網站，這很容易造成災難。

另一方面，如果您不希望客戶自行更新主題並破壞您所有的辛勤工作，您可以使用簡單的代碼片段禁用更新。這將使該用戶無法從後端更新主題。主題和插件的更新最終可能會破壞整個網站，因此您可以通過將以下內容添加到functions.php文件中來禁用它們：

function remove_core_updates() {
  global $wp_version;return(object) array('last_checked'=> time(),'version_checked'=> $wp_version,);
}
add_filter('pre_site_transient_update_core','remove_core_updates');
add_filter('pre_site_transient_update_plugins','remove_core_updates');
add_filter('pre_site_transient_update_themes','remove_core_updates');

首次安裝後的步驟

安裝Reverie主題後，您可以看到它帶有“自定義”功能，使您可以從前端預覽基本更改，例如背景顏色、背景圖像和小部件。許多流行的主題都對這個區域進行了詳細的自定義，甚至細化到字體顏色、字體系列等等。

創建Reverie子主題

子主題的工作方式是將文件保存在單獨的文件夾中，因此當您更新主主題時，單獨文件夾中的文件不會被觸碰。這意味著您所有辛勤工作和自定義設計不會在每次更新主主題時都被擦除。

為Reverie設置子主題與其他主題大致相同。在主題目錄中，您需要創建一個名為“reverie-child”的文件夾。在其中，您需要放置一個style.css文件和一個functions.php文件。這是任何子主題的典型做法。如果您想添加自己的自定義功能和自定義樣式，則這些文件是必需的。

在子主題的樣式表中，您只需遵循子主題CSS文件的基本設置即可：

/*
Theme Name: Reverie Child Theme
Description: Child theme for Reverie 
Author: James George
Template: reverie
*/

@import url("../reverie/style.css");

/* Start child theme customization below */

現在，您可以將自定義函數和样式添加到新的Reverie子主題中。

這是安裝Reverie後的典型外觀。如果要自定義外觀，需要將自定義CSS添加到子主題文件夾中的style.css文件中。

最好的方法是打開main-index.php文件和single-page.php文件並查看結構。務必注意任何您想要關注的特殊類。在大多數情況下，一切都應該非常簡單明了。

另一種方法（也是我選擇的方法）是使用Firefox的Firebug Inspector和Chrome的Inspect工具。選擇哪個工具都沒關係，它們的功能幾乎相同。我個人更喜歡Firefox的Firebug。我可以檢查一個元素，它會告訴我div ID和任何樣式化特定元素的屬性類。

這是查看構建方式的另一種好方法，當您將鼠標懸停在Firebug窗口頂部細分中的某個項目上時，它會突出顯示該元素。您可以看到div是如何嵌套的，這可以幫助您縮小嘗試解決的任何問題的範圍。

在上圖中，您可以看到您正在查看的代碼區域以淺藍色突出顯示。如果存在紫色區域，則表示存在任何填充。黃色表示應用的任何邊距值。這是一種微調任何間距問題並診斷設計為何沒有按照您想要的方式構建的好方法。

在上例中，如果我想設置作者名稱的樣式，更改其顏色，我可以將鼠標懸停在其上，右鍵單擊並選擇“檢查元素”。然後，在下面的代碼中，您可以看到div和類名，它實際上是byline author的span類。

由於作者姓名是一個鏈接，我可以在末尾添加一個a，選擇活動元素：

function remove_core_updates() {
  global $wp_version;return(object) array('last_checked'=> time(),'version_checked'=> $wp_version,);
}
add_filter('pre_site_transient_update_core','remove_core_updates');
add_filter('pre_site_transient_update_plugins','remove_core_updates');
add_filter('pre_site_transient_update_themes','remove_core_updates');

這將作者鏈接更改為橙色。這很簡單，但這些是樣式化主題的基礎知識。此外，它比從PHP、div和類的一頁開始——並嘗試在您的腦海中整理所有內容要容易得多。

在該系列的下一篇文章中，我們將探討向Reverie主題添加功能。這裡有很多靈活性，可能性無限。了解Reverie主題的整體結構以及如何操縱其外觀將有助於您了解如何成功地在其上構建。

Reverie常見問題解答

• Reverie與其他WordPress入門主題有何不同？ Reverie與其他WordPress入門主題的不同之處在於它與Foundation框架的集成。這意味著它帶有可立即使用的響應式網格、排版、按鈕樣式和其他組件。它還包括自定義導航菜單、小部件區域和頁面模板，為主題開發提供了堅實的基礎。與許多其他入門主題不同，Reverie的設計輕量級且極簡，有助於提高網站性能。

• 如何自定義Reverie主題？ Reverie高度可定制。您可以直接修改CSS和PHP文件，或使用WordPress自定義器進行更簡單的更改。該主題還支持子主題，允許您進行更改而不會影響原始主題文件。這使得更新主題而不會丟失自定義設置變得容易。

• Reverie適合初學者嗎？ 雖然Reverie是為開發人員設計的，但它也適合熟悉基本HTML和CSS的初學者。該主題簡潔、註釋良好的代碼使它易於理解其工作原理，並且與Foundation框架的集成提供了大量學習更多關於Web開發的資源。

• Reverie支持WooCommerce嗎？ 是的，Reverie開箱即用地支持WooCommerce。這意味著您可以輕鬆地在您的網站上建立在線商店，而無需安裝額外的插件或主題。該主題還包括幾個WooCommerce頁面的自定義模板，為您的網站提供一致的外觀和感覺。

• Reverie的性能與其他入門主題相比如何？ Reverie的設計輕量級且快速，有助於提高網站的加載時間和整體性能。該主題的極簡設計意味著它不包含不必要的特性或臃腫的代碼，這些可能會減慢您的網站速度。這使其成為重視性能的開發人員的絕佳選擇。

• 我可以將Reverie用於多語言網站嗎？ 是的，Reverie支持翻譯並支持多語言網站。該主題包含.po和.mo文件，您可以使用它們將主題翻譯成任何語言。它還支持WPML插件，這使得在您的網站上輕鬆管理和切換不同語言變得容易。

• Reverie兼容所有瀏覽器嗎？ Reverie旨在與所有現代瀏覽器兼容，包括Chrome、Firefox、Safari和Edge。該主題使用漸進增強來確保它即使在舊版瀏覽器上也能正常工作，儘管某些高級功能可能不可用。

• Reverie支持自定義文章類型嗎？ 是的，Reverie支持自定義文章類型。這意味著您可以在您的網站上創建不同類型的內容，例如博客文章、產品、評論等等。該主題還包括幾個顯示不同文章類型的自定義模板，為您的網站提供一致的外觀和感覺。

• Reverie多久更新一次？ Reverie定期更新，以確保與最新版本的WordPress和Foundation框架兼容。這些更新還包括錯誤修復、性能改進和基於用戶反饋的新功能。

• Reverie是否有任何支持？ 是的，Reverie通過其GitHub存儲庫提供支持。您可以報告問題、請求功能或為主題的開發做出貢獻。主題網站上還有大量的文檔和教程，以及可以幫助解答問題和提供建議的用戶社區。

以上是Reverie：基於基礎的WordPress首發主題的詳細內容。更多資訊請關注PHP中文網其他相關文章！