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中文网其他相关文章！