如何在WordPress中更改块的高度和宽度

你想在WordPress中更改块的高度和宽度吗?默认情况下,WordPress 可以轻松地使用块为您的帖子和页面创建漂亮的内容布局。但是,有时您可能希望调整块的大小以使其看起来更好。在本文中,我们将向您展示如何在WordPress中轻松更改块的高度和宽度。

为什么要在WordPress中更改块的高度和宽度?

块编辑器使您能够使用不同的块向 WordPress 网站添加内容,包括标题、段落、图像、视频、音频等。

但是,有时您可能希望更改特定块的宽度或高度,以改善其外观或整体内容的布局。

调整块大小还可以确保您的内容响应迅速,并在所有设备(包括手机、平板电脑和笔记本电脑)上正确显示。

例如,您可能已在内容编辑器中上传了图像,但它太大,使页面看起来没有吸引力。

或者,您可能希望更改标题块的大小,以使其更好地与内容对齐。

通过调整块的宽度和高度,您可以使您的帖子和页面看起来更美观。

方法 1:使用块设置更改块高度和宽度

对于这种方法,我们将向您展示如何使用WordPress提供的默认设置更改块的高度和宽度。

目前,WordPress没有为所有块提供相同的调整大小选项。但是,块编辑器提供了许多方法来调整不同块的高度和宽度。

让我们从WordPress中的图像块开始。

首先,您可以通过单击块上方工具栏中的"对齐"按钮来更改图像块的对齐方式。

在这里,选择"宽宽度"选项将使块与容器的宽度相同。

或者,"全宽"对齐选项将使块成为页面的整个宽度。

您还可以通过转到右侧的"块设置"面板并向下滚动到"设置"部分来调整块的大小。在这里,您可以从"图像大小"下拉菜单中调整块的大小。

您还可以通过在"图片尺寸"部分的"宽度"和"高度"框中输入首选像素大小来调整块的宽度和高度。

在此之下,您还可以按百分比调整块的大小。

调整图像块大小的另一种方法是单击图像本身以显示带有圆形锚点的蓝色边框。

然后,只需拖动这些锚点即可更改图像块的高度和宽度。

完成后,单击"更新"或"发布"按钮以存储您的设置。

方法 2:使用列块更改块的高度和宽度

如果要调整大小的块没有附带对齐按钮或调整大小设置,则此方法适合您。

对于此方法,我们将块放在列块中。它充当容器,您可以在其中添加每列中的块。然后,您可以通过调整列的高度和宽度来调整这些块的大小。

首先,您需要单击屏幕左上角的"添加块"(+)按钮。

从这里,只需找到列块并将其添加到内容编辑器。然后,系统会要求您选择一种变体。

之后,列布局将显示在屏幕上,您现在可以通过单击列内的"添加块(+)"按钮来添加所需的块。

添加块后,您可以使用右侧面板中的"列设置"调整其大小。

完成后,只需单击"发布"按钮即可存储更改。

这是在两列块中调整和对齐两个段落块后内容在我们的演示网站上的外观。

方法 3:使用组块更改块的高度和宽度

您还可以使用组块调整块的宽度和高度。它允许您对不同的块进行分组并将它们样式化在一起。

首先,您需要单击顶部的"添加块"(+)按钮。接下来,您必须找到组块并将其添加到内容编辑器。

完成此操作后,组块将显示三种不同的布局选项供您选择。在本教程中,我们将使用"组"布局。

之后,"添加块"按钮将显示在屏幕上。您现在可以添加所需的任何块。

在本教程中,我们将添加标题块、段落块和图像块并调整其大小。

要将多个块添加到组,您必须单击块工具栏中的"选择组"按钮。

选择组后,只需单击底部的"添加块"按钮(+)。

单击"选择组"按钮还会打开右列中的块设置。从这里,您可以轻松调整所有块的布局、对齐和方向。

更改布局也会更改不同的块大小。您可以配置这些设置,直到您对结果满意为止。

完成后,单击"更新"或"发布"按钮以存储您的设置。

这就是组块在我们的演示网站上的外观。

方法 4:使用覆盖块更改块高度

如果要使用"覆盖"块,此大小调整方法适合您。它使您能够在图像或视频之上显示文本和其他内容。

首先,您需要单击顶部的"添加块"(+)按钮并找到覆盖块。

完成此操作后,系统会要求您选择颜色或从WordPress媒体库中上传图像。此图像或颜色将用作封面块的背景。

接下来,只需将您想要的任何块拖放到 Cover 块中。

之后,您需要单击 覆盖 块以在右列中打开其块设置。

从这里,向下滚动到"尺寸"面板,您可以在其中使用像素调整覆盖块的高度。

最后,不要忘记单击"保存更改"按钮来存储您的设置。

使用种子生产中的高级块创建漂亮的页面

您可以使用 SeedProd 插件轻松创建美观且美观的页面。

它是市场上最好的WordPress页面构建器,可让您使用块创建登录页面。这些块也非常容易根据您的需要进行自定义和调整大小。

首先,您需要安装并激活 SeedProd 插件。

注意: SeedProd 也提供免费版本,但我们将在本教程中使用高级版本。

激活后,您必须从WordPress仪表板转到SeedProd >>设置页面,然后在"许可证密钥"框中输入许可证密钥。

您可以在 SeedProd 网站的帐户页面上找到许可证密钥。

接下来,您需要从管理侧边栏访问 SeedProd >> 登录页面屏幕以开始创建登录页面。

从这里,只需单击"添加新登录页面"按钮。

现在,您将被带到"选择新页面模板"页面。种子生产提供了许多预制模板供您选择。

选择模板后,系统会要求您提供着陆页的名称和网址。

添加这些详细信息后,只需单击"保存并开始编辑页面"按钮即可继续。

这将启动 SeedProd 的拖放页面构建器,您现在可以在其中开始编辑页面。

在本教程中,我们将添加图像块和按钮块并调整其大小。

首先,您需要将图像块从左侧的块面板中拖放到页面上的任何位置。

接下来,只需单击 图片 块以在左栏中打开其块设置。从这里,您可以从媒体库中上传图像。

接下来,您可以使用像素或百分比更改块的高度和宽度。

您还可以通过切换到设置面板顶部的"高级"选项卡来调整图像大小和位置。

然后,只需单击 间距 面板以展开其设置。

在这里,只需添加值即可根据需要调整块的边距和填充。

您可以调整块的顶部、底部、左侧和右侧区域的边距和填充。

使用 Seedprod,您还可以在两个不同的块之间添加一个间隔块,以便在它们之间留出一些空间。

首先,您需要从左列中找到并添加"间隔"块。然后,单击它以打开其设置。

现在,您可以使用"高度"滑块控制垫片的高度。

间隔块可以帮助您创建一个整洁的网站。

相关推荐
wodrpress资源分享17 小时前
你对安装在自己网站上的wordpress插件了解吗?
wordpress
Web极客码3 天前
WordPress 中最佳的维护服务:入门级用户指南
wordpress·入门指南·网络维护
boke112百科3 天前
如何修改WordPress经典编辑器的默认高度?
编辑器·wordpress·wordpress教程
wodrpress资源分享4 天前
卖三蹦子的wordpress模板
wordpress
伊玛目的门徒7 天前
WordPress网站添加嵌入B站视频,自适应屏幕大小,取消自动播放
wordpress·b站·网站·嵌入视频
Web极客码12 天前
如何使用 cPanel 部署 WordPress临时网站
wordpress·1024程序员节·cpanel
山川绿水14 天前
春秋云镜——SQL注入漏洞复现——CVE-2022-4230
数据库·web安全·网络安全·wordpress·1024程序员节
wodrpress资源分享16 天前
给WordPress添加个额外的古腾堡编辑器
编辑器·wordpress
wodrpress资源分享16 天前
新网虚拟主机wordpress伪静态规则
wordpress
wodrpress资源分享16 天前
怎么选择独立站SEO效果好的wordpress模板
wordpress