目录
您需要以优雅的方式在图像周围放置文本吗？了解如何在没有编码和设计经验的情况下轻松做到这一点。古腾堡编辑器带来了更多在 WordPress 中将文本环绕文本的选项。
您可以同时实现美观的网站和轻松的内容编辑。从长远来看，为您的 WordPress 网站选择古腾堡编辑器将为您提供最好的工具。您将有更多选项以不同方式将文本环绕图像。古腾堡带来了许多优势，例如更清晰的网站源代码、速度、安全性和可用性。
如何在 WordPress 中将文字环绕在图像周围？
古腾堡编辑器和块使网站内容变得更轻、更现代、更容易阅读。我们还向您展示了如何在 WordPress 页面、帖子和自定义帖子类型中将文本环绕在图像周围的更多方法。有不同的块，您也可以将它们组合使用，作为一组零件和功能，为您提供额外的包装选项。
您可以根据子页面及其内容类型选择图像周围环绕文本的块。您可以为演示页面选择一种样式，为博客文章选择另一种样式。另外，请考虑代表图像的内容类型。是描述图片还是更具代表性或销售媒体？
将文本环绕图像 – 块选择
您可以使用 4 个块将文本块包裹在图像周围。我们描述所有这些：
- 图像块和段落块在下面找到更多信息
- 媒体和文本块在下面找到更多信息
- 柱块 在个人帖子中
- 簇块 在个人帖子中（该功能仅适用于 Citadela Pro插件)
文字和图片自动换行以获得更好的阅读体验
您应该使用此块的原因有多种。如果您正在撰写博客文章，您会最感激它。图像是故事不可或缺的一部分。无论您是撰写有关 IT 新闻的旅游博客还是杂志，都没有关系。因此，在内容中添加照片时，请考虑图像对齐。读者将能够更好地理解您所写的内容。
在许多情况下，有必要并排插入图像和文本。什么是重要的？
- 它必须有意义。图像必须位于正确的文本旁边。
- 它必须很好地对齐。
- 它必须适合整个网站布局。
图像和段落块
当在 经典编辑器 你也可以在图像旁边放置文本，但你无法谈论良好的对齐方式。特别是如果图像很小并且您在其旁边放置了更多文本。文字覆盖了图像，看起来不太好。
古腾堡编辑 它的图像块带来了一个很棒的功能——图像大小调整。拖动图像周围的点可自动更改其大小和文本对齐方式。
媒体和文本块 – WordPress 将文本与图像对齐
如何对齐图像旁边的文本？
现在就开始
立即开始无风险试用。无需信用卡。
媒体和文本块是一个很棒的功能。媒体和文本块解决了这个问题，并确保文本与图像完美对齐，而不会破坏构图和布局。这就是您应该使用此块的原因。
它还改进了移动设备上的网站设计。这个包装块帮助 WordPress 主题覆盖不同的移动布局。在智能手机上，网站的每个部分都必须清晰可见且可读。媒体和文本块在手机上的外观以及表格处理“移动设备上的堆栈”功能的外观如何，我们将在下面介绍。
很快您就可以在我们名为 Citadela 的新 WordPress 主题中使用媒体和文本块。在单独的文章中了解有关 Citadela 主题的更多信息。
如何在块编辑器中添加媒体和文本块？
添加媒体和文本块与添加任何其他块一样简单。它是一个核心块，意味着您无需下载或安装任何内容。
使用顶部面板或编辑器中任意位置的“+”图标，然后选择媒体和文本块。
最后一个选项是键入“/”，然后写入“media”。 WordPress 将自动向您显示与您搜索的内容相匹配的选定块。
媒体和文本块如何工作？
媒体和文本块基本上将两种不同类型的内容归为一类。第一个是中等的，例如图像或视频，您可以通过以下方式添加：
- 上传
- 媒体库
- 拖放
第二个是文本内容的空间。您可以在其中写入文本段落、项目符号列表或标题。您也可以在那里添加 按钮块 我们之前讨论过。
无论您编写多少文本，媒体和文本块始终并排对齐图像和文本。它是如何工作的？图像会根据文本列中的内容高度自动调整。
媒体和文本块设置
常规块设置
1. 顶部工具栏
块上方的工具栏提供了多个选项。如果您的活动主题支持，您可以将媒体和文本块设置为宽或全宽。您还可以通过单击以下按钮来选择要放置图像或视频的位置：
- 在左侧显示媒体
- 在右侧显示媒体
在顶部工具栏中还有一个用于编辑媒体的图标，您可以在其中设置替代文本、标题、说明文字或说明。在我们的文章中了解有关编辑图像的更多信息 使用 WordPress 图像块.
2. 右侧边栏
右侧边栏提供媒体和文本块的附加设置。可以在此处添加替代文本、设置背景颜色或添加其他 CSS 类。您还可以启用“Stack on mobile”功能。
由于此功能，图像和文本可以在移动设备上很好地显示。如果禁用“移动设备上的堆栈”，图像和文本将并排放置，并且在响应式版本中几乎难以阅读。
如果启用此功能，在手机上，左侧内容将显示在右侧内容之上。
文本对齐
媒体和文本块的一部分与图像或视频以及文本内容一起。它可以是以下内容类型之一：
1. 段落
在顶部工具栏中，您可以设置文本对齐方式、将文本设为粗体、斜体或添加 URL 链接。
在右侧边栏中，您可以选择字体大小、字体颜色或段落颜色。有趣的功能是“首字下沉”，它将突出显示文本的第一个字符。这是块帖子中的一个很好的功能，可以使文本变得更有趣。
2. 标题
标题与段落非常相似。您还可以配置它的外观、粗体或斜体以及插入 URL 链接。不同之处在于您可以选择标题类型 - H2、H3、H4。
其他标题大小和对齐设置可在右侧边栏中找到。
3. 清单
如果您在内容中添加列表块，它可以是项目符号、编号列表或多级列表。您还可以将文本设为粗体、斜体并添加 URL 链接。
4.按钮块
这个向内容添加按钮的块可以根据网站设计进行调整。按钮颜色和样式或背景颜色可以在右侧边栏中配置。
不要忘记阅读有关的文章 按钮块.
在块类型之间切换
在媒体和文本块中，可以将一种内容块类型转换为另一种内容块类型。您还可以将媒体和文本块更改为图像块，文本部分将被删除。
在文本内容中，可以将段落块更改为标题或列表块。
奖励：如何在 WordPress 中调整文本对齐
使用合理的文本有其优点和缺点。合理的文本通常可以在书籍或报纸中找到，但不再在网站上使用。为什么？
几年前，Justify 功能集成在 WordPress Classic 编辑器中。对齐文本用于在各种浏览器或移动设备中导致可见性问题。它还与合理文本的可读性困难有关。因此，该函数已被弃用并删除。
新的块（古腾堡）编辑器中也不存在这种特殊功能。
那么如果你真的想要的话，你如何证明文本的合理性呢？
解决方案是通过几个步骤添加简单的 CSS 代码：
- 右侧边栏中有一个段落块的附加 CSS 类设置
- 在那里写下班级名称„证明合法“
- 发布页面或文章
- 如果您预览它，请单击主顶部栏中的“自定义”
- 左侧有一个带有设置的新侧边栏
- 单击“附加 CSS”
- 插入以下CCS代码：
p.justify { 文本对齐：对齐； }
完毕。从现在开始，您的媒体和文本块中的文本是合理的。
多亏了古腾堡编辑器，WordPress 在没有第三方页面构建器的情况下变得更加可用。从长远角度以及创建或重新设计网站时，它对您的网站具有极好的价值。古腾堡块提供了多种风格，但您可能会发现手 用于将文本环绕图像的 WordPress 代码.
您对媒体和文本块有何看法？您已经使用了吗？您喜欢使用它吗？请在下面的评论中告诉我们。
一般来说，我喜欢块系统，但除非我错过了一些东西，否则这是一个倒退。我目前希望简单地向左或向右浮动图像并让文本换行，这确实应该很容易做到，但似乎 WordPress 不希望这种情况发生。为什么不？仅当文本长度正确时，才可以使用媒体和图像块。例如，如果文本的长度不完全适合图像的大小，则像这样的页面不希望重做段落之间有奇怪的间距。
http://www.thorntonincraven.co.uk/our-village/welcome-to-the-village/
你好呀，
非常感谢您的反馈。这听起来是一个非常好的主意，因此我想请您花一分钟的时间来回答 4 个简单的问题：https://aitthemes.typeform.com/to/vc7arn，这可以帮助我们的团队制作更好的产品独特的功能更快。
非常感谢您的时间和理解。
最亲切的问候！
兹拉特科
艾特团队
是的，我无法让文字换行。这个文本块组合看起来没什么用。
这个想法很糟糕，因为这是将图片插入博客的唯一方法——我无法让文本很好地换行，而且无论我做什么，它的大小都不相同。对于某些情况来说是个好主意，但不适用于所有情况。有时您只想要一张带有段落的图片，而不是对图片进行说明。
如何添加包装器并认真使用全宽yar内容如何覆盖完整然后将容器放入其中..构建器非常令人困惑如何添加容器包装非常糟糕的编辑器yar
你好呀，
谢谢你的夸奖。请随意查看我们的博客页面 https://www.ait-themes.club/blog/ ，您会发现许多有用的提示，如何撰写有吸引力且有用的帖子。
最亲切的问候！
兹拉特科
艾特团队
你好阿卜杜勒，
非常感谢您的反馈，我们团队对此深表感谢！
此致。
兹拉特科
艾特团队
我和这个帖子上的其他几个人遇到了同样的困难。过去，我能够轻松地将文本包裹在图像周围，就像我们在“关于我们”页面中的图片和简介一样。也许我正在使用旧的编辑器。我不记得了。但是，我现在正在尝试使用新的图片和 BIOS 更新我们的网站，但找不到一种方法可以像我们之前的 Bio/图片组合那样轻松地换行文本。我尝试切换到经典编辑器，但该网站警告我有“新块编辑器”部分，我必须保留较新的编辑模式。你能告诉我如何让我们的新传记和照片看起来像我们之前的帖子吗？谢谢。
嘿，
如果您希望禁用古腾堡并继续使用经典 WordPress 编辑器，请考虑 WordPress 核心团队的插件，它允许您使用“经典编辑器插件”来完成此操作。
此致！
兹拉特科
艾特团队
对于那些只想要简单的文本环绕图像的人，您可以通过插入经典文本块（基于单击“浏览”时块的第一部分）来完成此操作。您可以在单个块中使用经典编辑器，是的，这允许您插入图像，然后选择换行选项。问题已解决 🙂
感谢伦敦 SEO 专家！！！一个简单的解决方案，但我忽略了它！
然后...只需使用“转换为块”选项即可。
由于此方法有效，块编辑器具有该功能，但无法找到如何正确设置它。与此同时，这个软糖起作用了。
这里同样的麻烦。这个新版本太糟糕了——无法正确换行文字，甚至无法缩小照片，除非你只是想裁剪。
我可以在 WordPress 块编辑器中将文本环绕在图片周围。它看起来正是我希望它在“预览”中的样子。然而，当我发布我的博客并且 WordPress 通过电子邮件将其发送给我的关注者时，他们收到的博客上的图片和图片下方的文字。这种情况也发生在台式电脑上，而不仅仅是小型手机上。我想要它包裹起来，而不是堆叠起来。
你好呀，
感谢您的来信。该块不会像您期望的那样将文本环绕在 WordPress 中的图像周围。请查看以下说明，因为您可能会发现它们很有帮助：https://motopress.com/blog/how-to-wrap-text-around-images-in-gutenberg/
此致！
兹拉特科
艾特团队
我做了所有这些，我的博客完美地包含在预览中。当我发布它时，它在我的博客页面上看起来很棒。但是，当 WordPress 通过电子邮件将其发送给我的关注者，并且他们打开该电子邮件时，他们看不到它已包装。照片位于文字上方。看起来非常不专业。我在使用旧的经典编辑器时从未遇到过这个问题。现在我正在使用块编辑器，即使有一个经典选项可供单击，它也不会让我返回到经典编辑器。
你好呀，
感谢您的来信。
我们恳请您查看我们的知识库和/或带有视频教程的文档：
https://www.ait-themes.club/ait-themes-documentation/
或者随时直接在我们的专用支持票系统中发布技术问题。请通过 https://system.ait-themes.club/support/add-question 登录您的帐户。
欧洲中部时间工作日上午 8 点至下午 5 点提供客户支持。
此外，还有一个插件可以让您使用以前的编辑器。您应该安装并激活“经典编辑器”。
真挚地！
兹拉特科
艾特团队
我不同意这些，这优于经典编辑，因为选项更有限。我发现这个块因为使用不同的字体并且比文本块更宽，所以在视觉上很不和谐。能够将文本平滑地包裹在图像周围，同时保持相同的字体、大小和边距设置，从而带来杂志页面的专业性。这只是我对这个版本的 WordPress 深感失望的一个例子。
嗨特伦斯
谢谢您的意见。您尝试过我们的Citadela试用版吗？我们有一些独特的块可以帮助您调整文本和图像。无论如何，您可以免费测试完整版 - 所有功能。
祝你今天过得愉快。