您想在 WordPress 内容中并排放置图像吗?
初学者通常很难找到如何在 WordPress 帖子和页面中将两张图片并排放置。
在本分步指南中,我们将展示如何在 WordPress 中轻松并排放置图像(无需编写任何代码)。
为什么在 WordPress 中并排添加图像?
并排添加图像可以通过创建更有趣的布局来增强 WordPress 网站的视觉吸引力。
并排图像还可以帮助有效利用您的网站空间,使您能够在有限的区域内容纳更多的视觉效果。
例如,如果您有一个摄影网站,那么并排排列图像将帮助您以美观的方式显示图片,从而充分利用 WordPress 页面。
此外,有时您可能希望用户比较您的 WordPress 博客上的两个图像。将它们并排放置侧面将使他们更容易分析和理解图像之间的差异。
话虽如此,让我们看看如何在 WordPress 中轻松并排放置图像。
在本教程中,我们将展示两种不同的方法,您可以使用下面的链接跳转到您选择的方法:
- 方法 1:使用块编辑器在 WordPress 中并排添加图像
- 方法 2:使用插件在 WordPress 中并排添加图像
- 奖励:对齐WordPress 中的图像
方法 1:使用块在 WordPress 中并排添加图像编辑器
如果您正在寻找一种使用古腾堡块编辑器并排添加图像的简单方法,那么此方法适合您。
块编辑器有一个特殊的图库块,可让您轻松地按行和列显示图像。
首先,您需要创建一个新帖子/页面或编辑现有帖子/页面以打开内容编辑器。到达那里后,单击屏幕左上角的“添加块”(+) 按钮以打开块菜单。
从这里,只需找到图库块并将其添加到页面或帖子即可。
之后,您可以通过单击“上传”按钮轻松地将图像从计算机添加到图库块。
您还可以通过单击“媒体库”按钮从 WordPress 媒体库中选择图像。
如您所见,我们已在图库块中添加了 2 张图像,并且 WordPress 已自动将它们并排放置。
如果您决定添加第三张图像,则必须单击顶部块工具栏中的“添加”按钮。
这将打开媒体库,您可以从中添加第三张图像到您的图库块。一旦你这样做了,你会发现 WordPress 现在只是调整了图像的大小自动并排放置它们。
但是,如果您决定将第四张图像放入图库块中,则该图像将放置在其他图像下方。
要解决这个问题,您可以更改 WordPress 应在单列中并排包含的图像数量。
例如,如果您想要并排放置两个图像并在其下方再放置两个图像,则可以将“Columns”设置为 2。
您还可以裁剪图像以使它们对齐、调整图像大小、将它们链接到不同的页面以及更改块面板的背景颜色。
有关详细说明,您可能需要查看我们关于如何在 WordPress 中创建图片库的初学者指南。
完成后,请不要忘记单击“更新”或“发布”按钮来存储您的更改。
现在,只需访问您的网站即可并排查看图像。
方法 2:使用插件在 WordPress 中并排添加图像
如果您使用的是旧的经典 WordPress 编辑器,或者您想创建比默认图库块更复杂的图库,那么此方法适合您。
我们建议使用 Envira Gallery,因为它是最好的 WordPress 画廊插件。
注意:Envira Gallery 还有一个免费版本可供您使用。不过,我们将在本教程中使用专业版计划。
首先,您需要安装并激活 Envira Gallery 插件。有关更多详细信息,请查看我们有关如何安装 WordPress 插件的分步指南。
激活后,前往 Envira Gallery » 从 WordPress 仪表板添加新页面。
到达那里后,您必须为您的新画廊命名。我们将我们的画廊称为“示例画廊”。
之后,通过cl从电脑上传你要使用的图片单击“从计算机中选择文件”按钮。
要从媒体库上传图像,请单击“从其他来源选择文件”按钮。
上传图像后,向下滚动到图库部分即可查看它们。
从这里,您可以为图像指定标题和替代文本。当用户将鼠标光标放在图像上时,标题会出现在图像下方。
在灯箱弹出模式下,标题也会出现在图像下方,我们稍后会看到。
要编辑标题和替代文本,请单击图库中图像上的“编辑”按钮。
然后,您可以更改图像的标题并输入替代文本,因为这对 WordPress 网站的 SEO 很有帮助。
如果您的标题描述了图像,那么您只需在替代文本中重复该标题即可。
完成后,请确保在 cl 之前单击“保存元数据”按钮使用窗口。
如果您不这样做,那么您所做的任何更改都不会保存在图库中。
最后,滚动回页面顶部,然后单击“发布”按钮保存您刚刚创建的图片库。
之后,前往 WordPress 页面或在您想要添加它的位置发布内容。
到达那里后,单击屏幕左上角的“添加阻止”(+) 按钮以打开阻止菜单。
从这里,找到 Envira Gallery 块并将其添加到页面/帖子中。
接下来,您必须从块本身的下拉菜单中选择您创建的图库。
现在,要并排显示图库中的图像,请转到屏幕右上角的块面板。
从这里向下滚动到“选择布局”部分,然后从下拉菜单中选择列数。您的图像现在将并排显示在 t 上他的 WordPress 页面。
您还可以更改图库边距、启用同位素以及从块面板配置灯箱设置。
完成后,请不要忘记单击“发布”或“更新”按钮来存储您的设置。
现在,您可以访问您的网站以查看并排显示的图像。
用户现在可以单击任何图像以在灯箱中查看完整尺寸的版本。
此外,他们还可以使用灯箱滚动浏览图像。
如果您想向图库添加更多图像,则可以通过访问 WordPress 仪表板中的 Envira Gallery » 所有图库页面返回到该图库。
到达那里后,只需单击图库名称即可对其进行编辑。
您对图库所做的任何更改都会显示在您将其放置在帖子、页面或侧边栏中的任何位置。您无需再次将其添加到其中。
提示:如果您是使用经典编辑器而不是块编辑器,您仍然可以使用 Envira Gallery。
您将在经典编辑器上方看到一个“添加图库”按钮,您可以使用该按钮将现有图库添加到您的帖子中。
完成后,请不要忘记单击“发布”或“更新”按钮来存储您的设置。
奖励:在 WordPress 中对齐图像
当您并排添加两个图像时,它们必须对齐在一起以创建具有凝聚力且具有视觉吸引力的外观。
即使您要向 WordPress 博客添加单个图像,您仍然希望将其与您的内容对齐以创建视觉平衡。
通过单击块上方工具栏中的“对齐”按钮,您可以轻松地在 WordPress 块编辑器中对齐图像。
这将打开一些选项,您可以在其中将图像向右或向左移动,使其与图像的宽度相同容器,或使用全角选项,使图像的宽度与页面的其余部分相同。
除此之外,您还可以使用栏块将图像与内容对齐。为此,您必须选择 50/50 变体。
完成此操作后,您可以添加与您的内容完美匹配的图像块。
此外,您还可以在图像周围添加文本、使用组块、添加封面块或执行更多操作来将图像对齐在一起或单独对齐。
有关更多信息,请参阅有关如何在 WordPress 块编辑器中对齐图像的初学者指南。
我们希望本教程能帮助您学习如何在 WordPress 中并排放置图像。您可能还想阅读我们关于如何更改 WordPress 中的块高度和宽度的指南,以及帮助您发展业务的必备 WordPress 插件(专家精选)的完整列表。
如果您喜欢这篇文章,请转发订阅我们的 YouTube 频道以获取 WordPress 视频教程。您还可以在 Twitter 和 Facebook 上找到我们。