所有分类
  • 所有分类
  • WP插件Pro
  • HTML模板
  • 微信小程序模板
  • 源码

如何在WordPress中添加背景图像(2种简单的方法)

网站的背景图片可以使网站看起来更具吸引力和活力。在本文中,我们将展示如何轻松地将背景图像添加到WordPress网站。

如何在WordPress中添加背景图像

为什么要添加WordPress背景图像?

将图像添加到WordPress网站可以使其对访问者更具吸引力。可以快速吸引用户的注意力,并让他们与内容互动。

它还允许根据品牌个性化网站设计。例如,可以在背景中上传产品或品牌吉祥物的精美照片。

此外,还可以添加YouTube视频作为完整背景或图像幻灯片,使内容栩栩如生。

但是,我们建议选择不会分散注意力或难以阅读WordPress博客上的内容的背景图像。背景应增强用户体验,并有助于将信息传递给访问者。

选择适合移动设备且不会影响网站速度的背景图像也很重要。否则,它会影响WordPress SEO。

也就是说,让我们看看添加WordPress背景图像的不同方法。我们将介绍多种方法,包括使用 WordPress 主题定制器、完整站点编辑器、插件、主题构建器等。

方法 1.使用WordPress主题定制器添加背景图像

最流行的WordPress主题都带有自定义背景支持。此功能可以轻松设置背景图像,如果主题支持,我们建议使用此方法。

但是,如果定制器菜单选项缺失,则主题可能已启用全站编辑。在下一节中,我们将介绍如何使用完整的站点编辑器来更改背景图像。

要使用定制器,需要访问WordPress管理员中的外观»自定义页面。这将启动WordPress主题定制器,可以在查看网站的实时预览时更改不同的主题设置。

WordPress主题定制器

要记住的一件重要事情是,看到的选项将根据使用的WordPress主题而有所不同。在本教程中,我们使用 Astra 主题

Astra Pro主题永久正版授权wordpress轻量简洁快速企业博客商城网站主题模板已汉化Astra Pro主题永久正版授权wordpress轻量简洁快速企业博客商城网站主题模板已汉化
2023-08-17

在 Astra 主题的定制器选项中,需要单击左侧面板中的“全局”。

转到 Astra 中的全局设置

之后,将看到不同的全局选项来自定义 Astra 主题。

继续并单击“颜色”部分。

点击颜色选项

在这里,可以更改主题颜色,包括背景颜色。还可以自定义链接、正文文本、标题、边框等。

要添加背景图片,请向下滚动到“表面颜色”部分。然后,可以单击“网站背景”选项并切换到“图像”选项卡。

选择背景图像

之后,只需单击“选择背景图像”按钮。

这将打开WordPress媒体库,可以在其中从计算机上传图像或选择之前上传的图像。

为背景选择图像后,需要单击“选择”按钮。

这将关闭媒体弹出窗口,将在主题定制器中看到所选背景图像的预览。

保存背景图像

不要忘记单击顶部的“发布”按钮以存储设置。

方法 2.使用完整站点编辑器添加自定义背景图像

如果使用的是基于块的 WordPress 主题,则可以使用完整站点编辑器 (FSE) 添加自定义背景图像。

完整的站点编辑器允许使用块编辑网站设计。这就像使用WordPress块编辑器编辑博客文章或页面一样。

在本教程中,我们将使用默认的 Twenty Twenty-Twenty 主题。要启动完整的站点编辑器,只需从WordPress仪表板转到外观»编辑器

转到完整的站点编辑器

进入完整站点编辑器后,需要向模板添加封面块以上传背景图像。

只需单击顶部的“+”号并添加一个覆盖块。

将封面块添加到主题模板

继续并单击封面块中的“上传”或“媒体库”按钮,将背景图像添加到块中。

这将打开WordPress媒体上传器弹出窗口。

将您的图像上传到封面块

可以选择要用作网站背景的图像。

选择图像后,只需单击“选择”按钮。

将图像添加到封面块后,下一步是将其设置为页面的背景。

为此,请单击顶部的列表视图图标(带有 3 个破折号的图标)以打开主题元素的大纲视图,例如网站页眉和页脚。

在 FSE 中打开列表视图

之后,只需将所有模板元素拖放到列表视图中的封面块下即可。

当它们都在那里时,封面块的图像将显示为网站的背景。

将主题部件添加到覆盖块

之后,可以通过单击来调整背景图像 封面 块并选择屏幕右上角的齿轮图标。这将打开“阻止设置”面板。

将找到使图像成为固定背景、重复背景、调整其叠加层、编辑颜色等的选项。

编辑背景图像设置

完成后,不要忘记单击“保存”按钮。

以上就是简单的添加背景图像的方法,其他的主题也可以使用类似的方法,我们希望本文能帮助学习如何在WordPress中添加背景图像。

资源下载
下载价格免费
主题都带数据,跟演示站一样,100%纯净,正版可商用

原文链接:https://www.itaoda.cn/blog/13487.html,转载请注明出处。

0
使用和安装有任何问题
请加客服QQ:1442071397 或wechat:pufei889


免责声明

本站所发布的部分内容自网络,该部分内容限用于学习和研究目,有版权问题的,下载后的24个小时之内,从您的电脑中彻底删除。且不得将用于商业或者非法用途,否则,一切后果请用户自负,与本站无关。

评论0

请先
没有账号?注册  忘记密码?

社交账号快速登录

× 发送
微信扫一扫

温性提示

演示站服务器在国外,网站打开速度有点慢,请耐心等待

多功能、多行业外贸商城 wordpress商城WOOCOMMERCE

23+
行业模板