什么是WordPress主题编辑器以及自定义网站的5种方法

WordPress主题是一组文件,包括图像、样式表和代码,以及定义网站的视觉外观和功能。但是,WordPress主题并不总是包含您可能需要的功能。为了克服这个问题,WordPress有一个内置的主题编辑器,可让您从仪表板修改主题文件。本文将解释如何使用主题编辑器自定义WordPress主题。我们还将讨论其他五种编辑网站的方法以

什么是WordPress主题编辑器以及自定义网站的5种方法

WordPress主题是一组文件,包括图像、样式表和代码,以及定义网站的视觉外观和功能。

但是,WordPress主题并不总是包含您可能需要的功能。为了克服这个问题,WordPress有一个内置的主题编辑器,可让您从仪表板修改主题文件。

本文将解释如何使用主题编辑器自定义WordPress主题。我们还将讨论其他五种编辑网站的方法以及编辑WordPress主题时的有用提示。

  • 什么是WordPress主题编辑器?
  • 如何使用WordPress主题编辑器
  • 其他自定义WordPress主题的方法
    • 1. 通过文件管理器编辑主题文件
    • 2. 使用基于块的站点编辑器
    • 3. 安装页面构建器
    • 4. 利用WordPress插件
    • 5. 使用子主题
  • 编辑WordPress主题时的其他提醒
    • 始终创建备份文件
    • 设置本地测试服务器或暂存环境
    • 使用版本控制

WordPress主题编辑器是WordPress仪表盘中的一个简单文本编辑器。它允许用户自定义WordPress主题文件以实现他们想要的外观和功能。例如,附加一个额外的侧边栏,使网站适合移动设备,或在标题中嵌入自定义视频。

WordPress主题编辑器可让您从任何已安装的主题打开文件。它在文本编辑器上显示文件内容,因此您可以直接在仪表板上调整主题代码。

虽然此工具在旧版WordPress中称为主题编辑器,但较新的WordPress 5.9使用主题文件编辑器

通过Appearance?->?Theme File Editor访问主题代码编辑器。在右侧,它将显示主题包含的模板文件列表。单击任何文件以查看其内容并进行更改。

edit-themes.pngo_

重要的!如果您在WordPress 5.9中使用基于块的主题,请导航至工具 -> 主题文件编辑器以访问该编辑器。

要选择其他主题进行修改,只需导航到屏幕右上角并单击下拉菜单以查找更多主题选项。

theme-options-editor.pngo_

但是,选择另一个主题不会切换活动主题。转到外观->主题以查看当前活动的主题或激活不同的主题。

完成自定义主题文件后,单击“更新文件”按钮。如果代码中存在语法错误,WordPress 主题编辑器会阻止用户保存文件。它还将指示错误所在的位置,从而更容易修复它。

由于大多数主题使用CSS、JavaScript和PHP文件类型,因此确保您能够轻松地使用它们至关重要。编辑或粘贴代码片段时要小心,因为操作不当可能会导致错误甚至将您锁定在网站之外。

主题文件因主题而异。但是,每个WordPress主题都包含以下基本文件:

  • 样式表 (style.css)?– 包含与设计相关的功能,包括字体、颜色和布局。您可以将自定义CSS添加到此文件并更改整个网站的外观。
  • Functions.php?– 确定主题的特性和功能,例如小部件、特色图像和自定义徽标。
  • 模板文件——HTML、模板标签和 PHP 代码的组合,用于确定任何给定页面的内容输出,例如单个文章、404页面和存档。

如果您是为客户工作的开发人员,最好禁用对主题编辑器的访问。这样做可以防止不必要的错误,因为客户端可能没有意识到编辑主题代码的潜在风险。

此外,禁用对主题代码编辑器的访问可以防止黑客将恶意代码注入网站。

重要的!在自定义主题文件之前始终创建备份。如果您想了解如何创建WordPress备份,请查看我们的指南。

WordPress主题编辑器并不是唯一可用于自定义网站主题和外观的工具。在本节中,我们将讨论几种自定义WordPress主题的方法。

WordPress主题文件存储在您的虚拟主机帐户中,并且可以使用文件管理器对其进行修改。以下是使用宝塔面板执行此操作的步骤。

  1. 转到宝塔仪表盘并单击文件菜单
  2. 进入WordPress安装根目录/www/wwwroot/yourdomain文件夹。

file-manager-1024x324.pngo_-3

  1. 转到wp_content?->themes文件夹。

wordpress-themes-folder-1024x644.pngo_

  1. 此文件夹包含您为WordPress网站下载的所有主题。双击要编辑的主题的文件夹名称。
  2. 选择需要修改的主题文件,然后单击菜单栏上的编辑图标。

file-editor-1024x548.pngo_

  1. 文件管理器将打开文本编辑器,以便您编辑文件。完成后单击“保存”按钮。

code-editor-1024x776.pngo_

WordPress用户还可以使用基于块的编辑方法自定义他们的主题。

要使用此编辑器,您需要WordPress 5.9或更高版本以及基于块的主题,例如Twenty Twenty-2或Wabi。

然后,您可以自定义主页、文章和页面的主题模板。通过导航到Appearance?->?Site Editor来访问编辑器。

block-editor-interface-1-1024x360-1.pngo_

编辑器会默认打开主页模板。通过单击屏幕左上角的WordPress徽标并选择模板来查看所有可用模板。

template-options-editor-1024x409-1.pngo_

由于这是一个基于区块的编辑器,因此可以自定义和重新排列所有现有的WordPress区块。我们有使用Gutenberg区块编辑器的完整指南,但以下是您需要了解的主要操作:

  • 单击编辑器左上角的加号按钮以打开区块库。选择其中一个块将其插入到内容中。
  • 单击屏幕右上角的设置按钮以打开模板和区块设置。每当您选择一个块时,该块的设计工具都会出现在这里。
  • 单击屏幕右上角的黑白圆圈以打开全局样式面板。此面板可让您自定义整个网站的颜色、版式和布局元素,而无需使用任何CSS代码。

许多WordPress主题与Divi、Elementor和Beaver Builder等WordPress页面构建器兼容。这些插件中的大多数都具有拖放功能,允许您在不编辑代码的情况下调整主题。

要使用页面构建器自定义您的网站,请安装与您的主题兼容的插件并使用提供的选项来编辑页面设计。

edit-elementor-1024x442-1.pngo_

进入Elementor的拖放界面后,通过选择左侧边栏上的小部件开始向页面添加元素。

elementor-interface-1024x541-1.pngo_

尽管页面构建器为您的网站提供了灵活性和许多自定义选项,但它们也有缺点。

WordPress 页面构建器将网站的布局转换为特定于插件的短代码。因此,当您停用页面构建器插件时,短代码将不起作用,您将失去设计。

如果您的站点只需要基本的附加功能,安装附加插件是一个不错的选择。WordPress插件目录有数千个选项,从电子商务和安全插件到社交媒体集成和SEO优化。

在安装任何插件之前,请注意它的最后更新时间、用户评分以及与最新WordPress版本的兼容性。经常更新的插件通常具有较少的安全性和兼容性问题,而用户评分可以表明它们的整体质量。

如果您只是想编辑主题的样式和设计,请使用CSS Hero之类的插件。它生成样式表的副本并覆盖原始文件,允许用户修改网站的设计和样式,而无需触及主题的原始文件。

编辑主题文件的缺点之一是更新主题时您将丢失更改。

安装或创建一个新的子主题来解决这个问题。它是一个新的主题,继承了父主题的所有特征。

子主题的style.cssfunctions.php文件存储在单独的目录中,因此您可以创建新文件来自定义子主题目录中的样式、布局参数和脚本。更新父主题时,这些文件不会受到影响。

有几种方法可以在WordPress中创建子主题。这些范围从通过文件管理器设置子主题文件夹到安装像WPS Child Theme Generator这样的插件。

尽管使用主题编辑器编辑主题的原始代码可以让您完全控制结果,但它也可能导致您的网站丢失必要的代码片段并崩溃。

因此,以下部分将介绍在自定义WordPress主题之前要遵循的一些安全实践。

在进行重大编辑时,创建 WordPress 网站的备份是必不可少的。如果出现问题,它可以防止您从头开始修改设置和自定义。

但是,您并不总是需要完整备份。例如,如果您只编辑该文件,则保存一份stylesheet.css文件就足够了。如果出现问题,请上传备份文件以覆盖更改。

使用测试环境检查和预览您对WordPress主题所做的编辑。使用本地服务器或临时站点可防止不需要的错误到达实时站点。

为此,您需要使用MAMP或WampServer在本地安装WordPress。这将为您提供在本地计算机上安装和测试WordPress的环境。

MAMP-website-1024x472-1.pngo_

另一种方法是使用临时环境来复制您的站点。与本地服务器解决方案不同,这是在您的网络托管帐户或通过WordPress仪表板完成的。

使用WP Staging之类的插件从您的WordPress仪表板设置网站的克隆。该插件将提供克隆站点的URL——只需登录并开始编辑主题。

WP-staging-plugin-1024x571-1.pngo_

还值得注意的是,WP Staging将登台网站的文件存储在您网站的子目录中。

例如,如果您的WordPress网站安装在public_html目录中,则临时站点将位于public_html/staging_site_name文件夹中。

版本控制允许用户跟踪和撤消WordPress网站中的更改,允许他们在出现问题时恢复网站的先前版本。

这种预防方法非常适合在团队中工作的人,因为它也是协作工作的绝佳工具。它使合并更改和测试新想法变得更加容易,而不会影响网站的实时版本。

WordPress版本控制有多种解决方案。其中之一是使用GitHub和GitLab等Git存储库来存储和跟踪代码更改。

另一种选择是安装一个像WP Rollback这样的插件,它可以让你将你的网站回滚到任何以前的工作状态。

WordPress为其用户提供了许多自定义选项和工具来修改网站的代码,包括主题代码编辑器。它提供了一种从仪表板访问主题源代码的简单方法,允许您调整其网页设计并创建新功能。

但是,我们建议您仅在具备编码知识的情况下才使用主题编辑器,因为更改可能会覆盖之前的调整并可能破坏您的网站。

因此,请确保实施某些预防措施以避免不可逆转的问题:

  • 创建备份文件
  • 使用本地测试服务器或登台环境
  • 使用版本控制还原更改

或者,使用风险较小的方法来编辑网站的主题,例如安装插件、使用块编辑器或创建子主题。

本文内容来源于公开网络,出于传递信息之目的整理发布。原文版权归原作者所有,若涉及侵权请先提供版权后联系我们删除

(0)
WP之家WP之家
上一篇 2025年3月13日 下午4:37
下一篇 2025年3月13日 下午4:37

相关推荐

  • 如何在WordPress中设置自定义主页

    网站主页是访客对WordPress网站的第一印象。它是传达您的信息和品牌的虚拟欢迎垫。如果您正在考虑更改WordPress的主页,您就迈出了改善用户体验、吸引受众和实现网站目标的重要一步。在本篇文章中,我们将指导您如何更改Wo

    2025年3月13日
  • 如何设置免费的WordPress推送通知以获得更多流量

    推送通知,也称为网络推送通知,在过去几年中在在线企业和营销人员中广受欢迎。这些提供了另一种吸引受众、增加回访者的方法,并且在大多数情况下,与典型的时事通讯注册相比,它们的点击率和参与度要高得多。今天我们将深入探讨WordPress推送通知到底是什么,它们如何帮助您扩大网站的覆盖范围,以及如何快速将它们添加到您的网站。典型设置只需不到10分钟!推送通知

    2025年3月13日
  • 古腾堡编辑器教程:如何使用WordPress更多区块

    保持网站页面上的内容简洁和有条理很重要,尤其是在您的主页上。幸运的是,WordPress更多区块可让您向访问者展示您的帖子以及全文链接。知道如何正确使用它可以帮助您获得更干净、更有效的WordPress页面。在这篇文章中,我们将解释如何将此区块添加到您的WordPress文章中。然后我们将讨论它的每个

    2025年3月13日
  • 如何自定义WordPress主题(5个分步教程)

    如果您已经安装了一个WordPress主题,但它不太适合您,您可能会感到沮丧。在定制WordPress主题方面,您有很多选择。挑战在于找到正确的方法。在本篇文章中,我将引导您了解自定义WordPress主题的各种选项

    2025年3月13日
  • 如何在WordPress中更改网站标题

    在WordPress中,网站标题是您网站的基本元素,是访问者对您网站的第一印象。这段文本出现在您网站的顶部,通常概括了您的网络存在的实质。了解如何更改WordPress网站标题是非常重要的,无论您最近进行了重新品牌定位

    2025年3月13日
  • 什么是WordPress:世界上最大的开源CMS系统

    什么是WordPress?就其核心而言,WordPress是创建自己的网站或博客的最简单、最受欢迎的方式。事实上,WordPress为Internet上超过43.0%的网站提供支持。是的——您访问的网站中超过四分之一可能由WordPress提供支持。在技??术层面上,Wo

    2025年3月13日
  • 如何实现为WordPress创建额外的图像尺寸

    默认情况下,WordPress会自动创建多个不同大小的图像上传副本。此外,WordPress主题和插件还可以创建自己的图像大小。在本教程中,我们将向您展示如何在WordPress中轻松创建其他图像尺寸并在您的网站上使用它们。通常,所有流行的WordPress主题和插件都能很好地处理图像大小。例如,您的WordPress主题可能会创建其他尺寸以用作存档页面上的缩略图。但是,有时这些图像大小可能不

    2025年3月13日
  • 如何禁止WordPress网站右键选择及复制文本

    许多想要禁止他人直接复制粘贴其内容的站长可能希望应用这一点。这基本上只是让人们更难从您的网站复制文本。在本教程中,我们介绍如何禁止他人选择文本,复制粘贴您的WordPress页面内容。许多博主发现他们的内容在未经许可的情况下被盗和使用。这可以通过自动内容采集来实现。如果有人手动复制您的部分或全部内容,也会发

    2025年3月13日