如何在 WordPress 中更改背景颜色

已发表: 2021-08-09

网站访问者首先注意到的一件事就是它的背景。 有时,它只是一种简单的颜色,但它也可以是图像或任何其他视觉材料的组合。 除了第一印象之外,它也是优质设计的要素之一。 无论好坏,它都会反映你的品牌、风格、可读性,甚至是专业性本身。 这就是为什么决定 WordPress 中的背景颜色通常是首要的设计选择之一。 问题是有这么多的主题,有很多不同的自定义选项。 有些允许您当场更改所有内容,而另一些则提供稀缺且有限的选择。

在 WordPress 中更改背景颜色的几种方法

正如您可能假设的那样,只需一点编码知识就可以完成所有事情。 然而,并不是每个使用 WordPress 的人都是专业的编程人员。 大多数普通用户需要对初学者友好的解决方案来自定义他们的页面。 其中,更改 WordPress 中的背景颜色是常见问题之一。 当然,您始终可以依靠专业的 WordPress 网站维护帮助来帮助您构建任何元素并完成您的网站设计。 但是,如果这不是您的选择,您可以尝试不同的方法来个性化您的网站。

使用横向图像作为网站背景、杂志封面和小册子。
在尝试个性化您的网站时尝试不同的方法。

然而,事情并不总是那么简单。 您必须做出的第一个决定是您想要的背景类型。 您可以选择甚至组合的热门选项很少:

  • 您可以选择简单的颜色或任何颜色组合
  • 将一种或多种颜色组合成渐变
  • 将 image/s 作为背景
  • 改用视频

一旦您决定是否要简单地更改 WordPress 中的背景颜色,或者使用更复杂的选项,是时候发现一些应用自定义的方法了

  1. 如果您的主题支持自定义背景
  2. 您可以尝试使用简单的代码
  3. 使用插件更改 WordPress 中的背景颜色
  4. 使用高级工具自定义一切

1.如果您的主题支持自定义背景

在大多数情况下,您可以通过转到外观 > 自定义轻松检查您的主题支持的选项。 在那里,您将能够看到允许哪些自定义选项。 有时您可以选择颜色、背景图像、颜色和深色模式、颜色和背景等。 这真的取决于主题。 如果它确实支持它,您可以简单地选择所需的报价并进行进一步的定制。

一旦找到更改背景颜色的正确选项,只需单击并浏览一个非常直观的界面即可。 通常,您将获得一些默认颜色选项供您选择。 但是,附近总是有“选择调色板”选项。 或者,您可以简单地输入任何颜色的十六进制代码。

更复杂的圆形调色板。
不同的工具可以让您选择正确的十六进制颜色代码。

除了颜色之外,一些主题还为您提供了放置图像和其他视觉效果的选项。 从这里,您将被要求将背景图像上传到您的媒体库并直接选择它。 此外,您可以设置它的位置、重复、底层或覆盖颜色等等。

2.可以尝试使用简单的代码

如果您对 CSS 有点熟悉,您可以通过添加自定义代码来进行简单的自定义。 没什么太高级的,尤其是设置背景颜色。 只需转到外观 > 自定义,选择“附加 CSS” ,然后输入下一行代码:

.body { background-color: #fff; }

在这里,“#fff”可以是您选择的颜色的任何十六进制代码。 一般来说,您可以使用任何颜色选择器工具轻松找到颜色代码。 但是,这可能并非在所有主题中都有效或不允许。

3. 使用插件更改 WordPress 中的背景颜色

网站起源 CSS

如果其他选项没有给出结果,您可以随时使用插件来完成工作。 WordPress 插件,如 SiteOrigin CSS,是强大的工具,可以让您重新控制自定义。 具体来说,这个插件允许您轻松地编辑背景颜色,并实时检查它的外观。 这基本上是大多数初学者需要的。 如果您是高级用户,您会喜欢它在调整 CSS 代码时的自动完成功能。 此外,它的“检查器”可以帮助您立即找到您可能需要的任何选择器。

最好的部分,SiteOrigin CSS 是一个适用于任何主题的免费插件。

AWB – 高级 WordPress 背景

当您需要的不仅仅是更改背景颜色时,AWB 是一个简单而有效的插件,可为您的网站布局增添一点优势。 除了经典选项外,AWB 还允许您使用更复杂的背景解决方案,例如:

  • 视差背景
  • 鼠标视差
  • 模式
  • 各种图像格式
  • 用透明度覆盖颜色
  • 各种不同的视频格式,包括自托管和来自在线资源

此外,您可以使用其可视化简码生成器来简化流程。 而且,如果您更喜欢一些流行的 WP 构建器或 Gutenberg,它可以与它们完美配合。

4.使用高级工具自定义一切

笔记本电脑、平板电脑和智能手机上的抽象实时背景效果。
通过自定义从背景到其他元素的所有内容来改变您网站的视觉吸引力。

当以上都不够,你需要一个更“健壮”的解决方案时,有一个名为 CSS Hero 的非常高级的插件。 它更像是一个完整的定制系统,展示了所见即所得界面的有效性。 基本上,它代表“所见即所得”的原则。 CSS Hero 是一个开箱即用的插件,提供与大多数主题和其他插件的兼容性。 在实践中,您可以简单地单击任何元素并更改其属性,例如颜色、背景、字体等等,没有任何麻烦。 由于其实时预览,您所做的每项更改都会立即可见。

尽管功能强大,但作为轻量级插件是 CSS Hero 的最大特点。 最重要的是,您所做的任何更改都不会修改主题文件。 完成工作后,您可以轻松卸载它,而不会破坏您的网站。 唯一的缺点是它是一个需要付费订阅的高级插件。

结论

当您想在 WordPress 中更改背景颜色时,有时它还不够简单。 虽然有时可以使用默认的 WordPress 自定义选项,但并非总是如此。 在某些情况下,拥有一些编码知识可以帮助您快速找到解决方案。 但是,由于它是 WordPress 最好的功能之一,插件可以帮助您完成几乎任何事情。