网页设计如何添加图片-将背景图像添加到 WordPress 帖子和页面的教程

您想美化您的网站吗？ 一种方法是向 WordPress 页面添加背景图像。 毕竟，背景图像是放置在页面内容后面用于美化页面的图像或设计。 如何向 WordPress 帖子和页面添加背景图片？ 有多种方法可以将背景图像添加到 WordPress 网站。

原文引用：向 WordPress 文章和页面添加背景图像的图解教程 – Move Theme

在本图解教程中，移动主题将介绍三种简单的方法。

1. 为什么要在WordPress中添加背景图片

简而言之，它们美化了您的网站。 在网站背景上显示图像可以增加一些美观性和专业性，而不是在整个网站上使用纯色背景。

过去，人们试图使网站设计尽可能简单。 虽然这在当时运作良好，但后来情况发生了变化。 随着全球网站数量的增加，确保您在竞争中脱颖而出非常重要。 实现这一目标的一种方法是改进您的网站设计。 使用背景图片来为您的 WordPress 网站做到这一点。

2.添加背景图片的缺点

就像任何事物都有优点一样，如果使用不当，也必然会带来缺点。 下面我们讨论其中一些问题。

首先，某些背景图像可能会出现在完全不合适的位置并破坏页面的内容。 这将导致用户错过您想要在页面上传达的信息。 其次，不适合移动设备的背景图像可能会影响网站的移动可用性。 大多数用户通过移动设备访问互联网。 因此，作为网站所有者，移动设备友好性应该是您最关心的问题。

最后，如果您使用大文件大小的图像，这可能会增加网站的加载时间。 因此吉祥物设计，增加加载时间可能会导致高跳出率，进而影响您的页面搜索引擎优化。 当然，您可以通过使用图像压缩插件或在上传到您的网站之前在线压缩图像来避免这种情况。

3. 如何向 WordPress 帖子和页面添加背景图片

可通过三种方法在 WordPress 网站上添加背景图像。 即使用默认主题选项、使用插件或使用自定义 CSS 代码。 下面，我们将告诉您如何使用它们。

1.默认主题选项

一些 WordPress 主题支持使用图像作为页面背景。 如果您的主题支持它，您可以从管理面板中的“自定义”页面启用它。 首先登录您的 WordPress 仪表板并转到外观 >> 自定义。 这将打开 WordPress 主题定制器页面。

在右侧，您将看到网站的实时预览和最近的更改。 左侧面板包含主题提供的各种自定义功能。 要设置背景图像，请单击“背景”。

在“背景”菜单上，您可以使用图像或颜色作为背景。 要使用图像，请单击“选择图像”按钮。

接下来，从 WordPress 媒体库中选择图像。 要上传新图像，请选择“上传文件”选项卡。 然后单击“选择文件”从计算机中选择图像。

将图像上传到您的网站后，单击“选择图像”按钮。

要更改图像的大小和显示，请单击“预设”下拉菜单并从可用选项中进行选择。 您可以测试每个选项以确定哪一个最适合您的图像。

在“图像位置”下，您可以选择要对齐图像的角度。 完成图像自定义后，单击“发布”以实施更改。 您可以访问网站上的任何页面并查看背景的外观。

默认主题选项的缺点

使用大多数主题提供的默认背景选项的缺点是它不能提供很大的灵活性和对背景图像在页面上的外观的控制。 此外卡通形象，背景图像是全局的，适用于整个网站的帖子和页面。 因此，如果您想为其他页面和帖子使用不同的背景，您可能会发现这很困难。 幸运的是，借助 WordPress 背景图像插件，您在向网站的任何部分或页面添加背景照片时可以获得很大的控制力和灵活性。

2.使用WordPress插件

如果您没有在主题设置中添加背景图像的选项，您可以使用插件来添加它。 在本节中，我们将展示如何使用两个插件来做到这一点。

如何使用 Elementor 在 WordPress 中添加背景图像

Elementor 是 WordPress 最受欢迎的拖放页面构建器插件之一。 该插件具有许多功能，允许您使用交互式仪表板构建完整的网站，而无需编写任何代码。

在这里，我们将使用背景功能将背景图像添加到 WordPress 网站的某个部分。 首先，您需要从 WordPress 仪表板安装并激活 Elementor 插件。

在这里您可以从主题站下载《Elementor Pro完美中文版|页面拖动自定义设计WordPress插件介绍》中文版。

激活插件后，您可以使用直观的仪表板来编辑 WordPress 帖子和页面。 首先网页设计如何添加图片，转到页面>>所有页面，然后选择要修改的页面下的编辑。

在页面编辑器上，单击“使用 Elementor 编辑”按钮打开仪表板。 Elementor 仪表板具有许多功能，可以帮助您编辑网站的任何部分。 您可以在“内容”选项卡中添加文本、标题、图像、视频等。

假设我们要向页面的某个部分添加背景图像。 单击六点图标以突出显示整个部分，如下图所示。

在“样式”选项卡上，单击“背景”下拉菜单。 接下来，选择钢笔图标并单击选择图像。

现在从 WordPress 媒体库中选择图像或上传新图像。

添加背景叠加

选择图像后，您可以添加背景叠加层，这样图像就不会分散您的内容的注意力。 为此，请单击“背景叠加”下拉菜单。

然后在“颜色”部分中选择您要使用的颜色。

添加完图像和效果后，单击“更新”按钮保存更改。 通过这种方式网页设计如何添加图片，您可以将无限的背景图像添加到网站的任何部分或页面。 只需选择页面并使用 Elementor 插件对其进行编辑即可添加背景图像。

高级 WordPress 背景 (AWB) 插件可添加背景图像

另一个可用于在 WordPress 中添加背景图像的插件是高级 WordPress 背景插件。 除了添加背景图片之外，您还可以使用视频作为背景元素。 这些视频可以来自您的媒体库、YouTube 或 Vimeo 视频。

您还可以对图像应用特殊效果，例如视差滚动效果。 在这里，我们将重点关注添加背景图像，但如果您想了解有关背景效果的更多信息，请查看有关在 WordPress 中添加视差效果的详细指南。 首先，您需要在 WordPress 仪表板上安装并激活该插件。 为此，请转到插件>>新建。 在搜索框中输入“高级 WordPress 背景”。 接下来，安装完成后单击“立即安装”按钮激活插件。

如何使用运单插件

要使用此插件，请转到页面>>所有页面。 然后选择要添加背景的页面下的编辑。

在编辑器上，单击添加块图标并在搜索框中输入“AWB”。 当它出现时，选择背景 (AWB) 块。

接下来，在右侧选择要添加的背景类型。 您可以使用背景颜色、图像或视频。 选择“图像”选项卡并单击以选择图像。

之后，从媒体库中选择一张图片。

您可以分别使用“大小”和“背景大小”选项更改图像和背景的大小。 添加图像后，单击“更新”按钮保存更改。 如果您使用的是经典编辑器，请导航到要添加背景图像的页面或帖子。 到达那里后，单击高级 WordPress 背景图标。

在常规选项卡上，单击背景类型下拉菜单并选择图像选项。

接下来，单击“选择图像”按钮并从 WordPress 媒体库中选择图像。

您还可以更新图像的大小和位置。 如果要添加叠加，请单击“叠加颜色”下的“选择颜色”。 接下来，选择您要使用的颜色。

现在，自定义背景图像后，单击“插入”。

这将生成一个短代码并自动将其插入到您的编辑器中。 在此短代码中，您可以输入要显示在背景图像上的文本。 完成后，单击“发布/更新”按钮以实施更改。 现在您可以查看网站上的页面以查看背景图像的外观。

3.使用CSS手动添加背景图片

如果您更懂技术，则可以使用自定义 CSS 代码将自定义背景添加到您的网页和文章中。 使用自定义 CSS 可以让您更加灵活地控制图像的外观和位置。

使用CSS方法，背景图像有很多位置可供选择。 首先，我们可以创建一个将出现在所有页面上的全局 CSS 背景图像。 很像一些 WordPress 主题提供的选项。 此外，我们可以为特定类别添加背景图像，或者创建带有背景图像的 CSS 类。 然后，您可以将该类应用于各个帖子和页面。