WordPress编辑器中的图片对齐
以前,WordPress使用带有编辑按钮的文本区域作为默认编辑器。旧编辑器的一个特别问题是图片对齐,很难在WordPress网站上正确调整图片的对齐方式。尽管有将图片左对齐、右对齐或居中对齐的选项,但它们并不总是看起来很好。有时图片不能正确对齐、尺寸不准确或看起来不协调。WordPress 5.0引入了新的WordPress文章编辑器——古腾堡区块编辑器,解决了旧编辑器的几个问题,包括图片对齐问题。
让我们来看看如何在新的编辑器中轻松添加和对齐图片,以创建美丽的WordPress博客文章和页面布局。
在WordPress中添加和对齐图片
编辑器带有以下区块,可以用于将图片添加到WordPress文章和页面中:
- 图片
- 内嵌图片
- 画廊
- 媒体和文本
- 封面
首先让我们从一个简单的图片区块开始。点击“添加新区块”按钮或者在编辑器中输入/image来插入一个图片区块。
您将在空白图片区块内看到三个按钮。您可以从计算机上传图片,从媒体库中选择已上传的图片,或通过提供图片文件URL来插入图片。接下来,点击“上传”按钮,然后从您的计算机中选择您要上传的图片。一旦您选择了图片,WordPress会将其上传到您的媒体库,并插入到图片区块中。
现在,您会注意到图片顶部有一个工具栏,右侧栏中有一些图片区块设置。要对齐您的图片,您将使用图片顶部显示的工具栏。图片区块提供了以下图片对齐选项作为工具栏中的按钮:
- 左对齐
- 居中对齐
- 右对齐
- 宽宽度
- 全宽度
如果您的图片宽度较小,将其左对齐或右对齐将把文本显示在图片旁边。将其居中对齐将在没有文本的情况下显示图片。
选择宽宽度选项将使图片宽度大于文本区域,全宽度选项将其推到浏览器屏幕的左右边缘。
如何将图片完美对齐到文字旁边
很多时候,您可能需要将图片完美对齐到一些文字旁边。WordPress区块编辑器通过添加“媒体和文本”区块使这一点变得很容易。此区块基本上添加了一个两列区域。一列用于图片(媒体),另一列用于文本内容。只需上传您的图片,然后您可以添加要显示在其旁边的文本。添加图片和文本后,您会注意到区块有更多选项。您可以使整个区块更宽或全宽,也可以切换图片和文本的侧边。图片的对齐将自动根据下一列中的文字高度进行调整。
如何在WordPress中对齐画廊图片
WordPress区块编辑器还带有一个用于添加图片画廊的区块。这允许您轻松在网格中显示图片。画廊区块有类似的对齐选项。您可以使整个画廊区块左对齐、居中对齐或右对齐。您也可以使其宽度加大或更改为全宽行。WordPress的默认画廊功能相当不错。然而,如果您经常在WordPress文章和页面中添加照片画廊,请考虑使用像Envira Gallery这样的照片画廊插件。这些插件将为您提供更多选项,以在您的照片画廊中对齐图片,在弹出框中显示它们,并不同风格地展示它们。
如何在WordPress中并排显示两张图片
在WordPress文章中并排显示两张图片的最简单方法是将两张图片添加到画廊区块中。只需为画廊区块选择两列布局,即可并排显示两张图片。您也可以选择“裁剪缩略图”选项,以确保两张图片的大小一致。
在WordPress中添加和对齐图片的更多方式
除了图片、媒体和文本以及画廊区块外,您还可以使用封面区块添加封面图片。在现代网页设计中,封面图片被用来创建高度吸引人的内容布局。这些图片用于突出页面的不同部分。封面区块具有与图片区块相同的对齐选项。您可以在图片上添加文本,并从区块设置中选择覆盖颜色。最好的部分是,您可以选择“固定背景”选项,这会创建一个视差背景效果。
到目前为止,我们谈到了将图片直接添加到您的文章和页面中。那么来自第三方网站的图片呢?区块编辑器也使这变得很容易。您可以添加来自热门社交分享网站的图片,包括Instagram、Facebook、Flickr、Imgur、Photobucket等。例如,如果您想添加一张Instagram照片,只需将Instagram区块添加到文章编辑器,并输入您要分享的文章的URL。然后,您只需点击工具栏中的对齐选项即可。嵌入区块也允许您在WordPress中轻松嵌入视频。
希望这篇文章能帮助您了解如何在WordPress区块编辑器中轻松添加和对齐图片。您可能还想查看我们的指南,了解如何优化图片以加快WordPress的速度和最佳设计软件。