Advanced Gutenberg:块设置

1. 高级按钮块

你可以创建一个 高级按钮 通过单击Advanced Gutenberg部分中的按钮。

 

先进的按钮

 

在右侧面板中,您可以调整按钮的某些设置:

  • 样式: 4种预定义样式

    • 默认

    • 概述

    • 平方

    • 平方轮廓

  • 按钮链接:

    • 链接网址

    • 在新标签页中打开:开/关。

 

ADV-按钮的设置

 

  • 文/颜色:

    • 字体大小

    • 背景颜色

    • 文字颜色

 

字体颜色按钮的设置

 

  • 边界:

    • 边界半径

    • 边框样式:实心,点缀,脊,......

    • 边框颜色

    • 边框宽度

 

ADV-按钮边界

 

  • 余量: 顶部,右侧,底部和左侧。

  • 填充: 顶部,右侧,底部和左侧。

 

先进的按钮,填充

 

  • 徘徊:

    • 颜色设置:背景颜色,文本颜色和阴影颜色。

    • 阴影(H(水平)偏移,V(垂直)偏移,模糊,扩散),不透明度和转换速度。

 

先进的按钮悬停

 

2.高级列表块

你可以创建一个 高级列表 单击Advanced Gutenberg类别中的按钮。

 

高级列表

 

输入内容后,您可以从右侧面板调整设置:

  • 文字设置

    • 字体大小

  • 图标设置

    • 图标(列表,颜色和大小)

    • 线高

    • 余量

    • 填充

 

先进列表的设置

 

3.摘要块

你可以创建一个 摘要 在帖子或页面中设置至少一个标题标记后,通过单击Advanced Gutenberg类别中的按钮来阻止。 摘要可以与左,中或右对齐。 要更新它,请使用“更新摘要”按钮。

 

总之,古腾堡内容

 

在右侧面板中,您可以调整一些选项:

  • 负载最小化: 默认情况下显示/隐藏摘要

  • 摘要标题标题: 摘要的标题文本,显示在 负载最小化 选项已启用

  • 锚色: 为摘要选择一种颜色

 

总之,设置

 

4.计数器(向上计数)块

 

你可以创建一个 计数 通过单击Advanced Gutenberg类别中的按钮阻止,可能带有符号。

 

计数

 

然后,从右侧面板中,您可以调整计数器的一些选项:

  • 颜色设置: 标题的颜色,Count Up的颜色和描述的颜色

  • 列: 1-3

  • 柜台号码尺寸: 设置数字的大小

  • 反击符号: 在计数器之前或之后添加一个字符

  • 切换按钮: 设置符号的位置(On表示符号在数字后面)

 

算机的设置

 

5.高级图像块

高级图像 块可用于创建图像。 要添加一个,请单击 高级图像 Advanced Gutenberg类别中的按钮,然后选择要插入的图像。

 

先进的图像按钮

 

接下来,您可以更改图像标题及其副标题。 您可以从右侧面板调整图像的设置。

  • 点击动作: 要么在灯箱中打开图像,要么打开自定义URL

  • 链接网址: 在新标签页中打开链接(切换按钮)

  • 在新的标签页打开链接: 开关

  • 图片尺寸: 图像是应以全宽显示还是以自定义高度和宽度显示

 

先进的图像的设置

 

  • 焦点选择器: 选择要聚焦在图像上的点或设置水平/垂直位置

  • 覆盖不透明度默认

  • 覆盖不透明度悬停

  • 颜色设置: 标题的颜色,字幕的颜色,叠加的颜色

  • 文字对齐: 垂直对齐(顶部,中心,底部),水平对齐(左侧,中心,右侧)

 

广告图像悬停

 

6.见证区

您可以点击相应的内容,在内容中插入推荐 见证 Advanced Gutenberg类别中的按钮。 然后,您可以更改推荐书的头像,姓名,工作职位和描述。

 

告别赛按钮

 

最后,在右侧面板中,您可以调整“个人鉴定”的设置。 禁用“滑块视图”选项时,以下设置如下:

  • 列: 普通视图中的列范围是1-3,而滑块视图中的列范围是4-10。

  • 阿凡达: 头像大小,背景颜色和边框设置,包括颜色,半径和宽度

  • 文字颜色:

    • 名称颜色

    • 位置颜色

    • 描述颜色

 

告别赛的设置

 

启用时 滑块视图 选项,将显示一些其他滑块选项:

  • 东西的个数
  • 显示项目
  • 滚动项目

滑块视图列

  • 中心模式
  • 悬停时暂停
  • 自动播放
  • 自动播放速度(毫秒)
  • 无限循环
  • 过渡速度(毫秒)
  • 显示点
  • 显示箭头
  • 箭头大小

 

滑块设置

  • 滑块颜色:
    • 箭头和边框颜色
    • 点色

 

滑块颜色

 

7.地图块

为了使用 地图 阻止,您需要在配置中添加Google API密钥。 之后,你应该遵循这个 链接, 点击 启用API和服务 按钮,然后搜索并启用Geolocation API,Maps JavaScript API。

添加后,您可以通过单击创建地图 地图 Advanced Gutenberg类别中的按钮。

 

地图块

 

在右侧面板中,您可以通过输入纬度和经度或输入地址,然后按提取位置按钮来插入位置。

可以使用地图的一些其他选项:

  • 缩放级别

  • 高度

  • 标记图标

  • 标记标题

  • 标记说明

  • 打开标记工具提示

  • 地图样式: 银色,复古,夜晚......还可以添加自定义样式。

 

地图设置

 

8.高级视频块

您可以通过单击来为帖子创建视频 高级视频 Advanced Gutenberg部分中的按钮。 然后,您可以粘贴Youtube或Vimeo中的URL,或使用服务器中的任何本地视频。 您可以通过单击左上角的“编辑”按钮来更改预览图像。

 

先进的视频

 

接下来,您可以在右侧面板中调整视频的设置。

  • 在灯箱中打开视频: 灯箱提供额外的显示选项

  • 全屏宽度: 如果它关闭,您需要为视频设置自定义宽度

  • 视频高度

  • 颜色设置: 叠加颜色和播放按钮颜色

  • 播放按钮:图标样式,播放按钮大小

 

先进的视频设置

 

9.高级表块

您可以通过单击创建表 高级表 Advanced Gutenberg类别中的按钮。

 

先进的表扣

 

您可以在设置列数和行数后编辑表。

 

先进的表

 

之后,您可以在表格块上方的编辑器本身输入文本或调整行和列。 可以在右侧面板中修改更多设置。

  • 样式

    • 默认

    • 条纹

 

样式表

 

  • 表设置

    • 最大宽度: 将此值设置为0可使最大宽度等于100%

    • 固定宽度表格单元格

    • 表头, 页脚

    • 边境崩溃了

 

advanced-table-settings1

 

  • 单元格设置

    • 颜色设置: 背景颜色,文本颜色

    • 边界: 边框样式,颜色和宽度

    • 填充: 顶部,底部,左侧和右侧填充

    • 文字对齐: 水平和垂直对齐

 

单细胞的设置

 

您甚至可以合并单元格(使用Shift按钮)并将合并的单元格拆分为 高级表 块。

10.高级手风琴座

你可以创建一个 高级手风琴 当您需要通过单击更小的区域显示更多内容时 高级 手风琴 Advanced Gutenberg类别中的按钮。 之后,默认会显示2组手风琴元素。

 

ADV-手风琴块

 

创建后,您可以从右侧面板调整标题,正文或边框选项。

  • 手风琴设置:

    • 底部间距: 定义每个手风琴之间的空间(仅限前端视图)

    • 初始崩溃: 默认情况下,所有手风琴都会折叠。

  • 标题设置

    • 标题图标样式

    • 颜色设置: 背景颜色,文本颜色和图标颜色

 

ADV-手风琴头

 

  • 体色设置

    • 背景颜色

    • 文字颜色

  • 边框设置

    • 边框风格: 坚实,虚线或点缀

    • 颜色设置

    • 边框宽度,半径

 

ADV-手风琴设置

 

11.高级选项卡块

同样,您可以创建一个高级 标签 当您需要在较小区域中显示更多内容时阻止。 要插入一个,请单击 进阶标签 Advanced Gutenberg类别中的按钮。

 

制表块

 

然后,您可以从右侧面板调整选项卡,正文或边框选项。

  • 标签样式
    • 台式机,平板电脑或手机
    • 水平或垂直
  • 标签设置
    • 初始打开选项卡

 

广告选项卡设置

 

  • 标签颜色

    • 背景颜色

    • 文字颜色

    • 活动标签背景颜色

    • 活动标签文本颜色

 

标签的设置

 

  • 身体颜色

    • 背景颜色

    • 文字颜色

  • 边框设置

    • 样式:无,实线,虚线或点线

    • 颜色

    • 边框宽度,半径

 

tab-settings1

 

您可以 通过使用,轻松分享您的社交链接 社交链接 块,可以通过单击Advanced Gutenberg类别中的按钮来创建。

 

社会链接

 

您可以使用现成的图标或上传自己的图标,并从右侧面板调整更多选项。

  • 预设图标: 您可以上传自定义图标

  • 预设图标颜色

  • 图标设置

    • 图标大小,空间

 

社会链接的设置

 

13.最近帖子块

有3种布局可用于显示您最近的帖子:网格,列表和滑块视图。 您可以通过单击创建任何这些视图 最近的帖子 Advanced Gutenberg类别中的按钮。

 

最近短柱块

 

您可以在上图或我们的图片中看到块如何显示在前端 Advanced Gutenberg演示.

在右侧面板中,您可以调整每个布局的设置:

  • 订购

订单通过

 

  • 类别

  • 东西的个数

  • (仅适用于网格视图)

  • 显示特色图片

  • 显示帖子作者

  • 显示发布日期

  • 显示阅读更多链接

  • 阅读更多文字

  • 显示帖子摘录

  • 首发文字摘录: 显示在帖子中找到的第一个文本的某些部分作为摘录。

 

最近,职位的设置

 

14. Woo产品块

有2种布局可供选择 宇产品 阻止:普通视图和幻灯片视图可以在您的WordPress博客上显示WooCommerce产品。 您可以通过单击来插入此块 宇产品 Advanced Gutenberg类别中的按钮。

 

宇块

 

您可以在上图或我们的图片中看到块如何显示在前端 Advanced Gutenberg演示

在右侧面板中,您可以调整每个布局的设置:

  • 产品设置

    • 产品状态

    • 类别

  • 布局设置

    • 产品数量

    • 订购

 

宇设置

 

15.图像滑块

如果要将多个图像显示为幻灯片,请单击以执行 图像滑块 Advanced Gutenberg类别中的按钮。

 

新图像滑块

 

然后按 添加图片 按钮选择幻灯片中显示的图像。 之后,您可以输入文本 标题和文字 每个图像的描述。

 

图像滑块

 

您可以在右侧面板上编辑滑块的设置。

图像设置

  • 点击动作:无,在灯箱中打开图像并打开自定义链接

  • 全屏宽度

  • 自动高度

  • 始终显示叠加层

颜色设置

  • 悬停颜色

  • 标题颜色

  • 文字颜色

 

slide-settings-1

 

文字对齐

  • 垂直对齐

    • 最佳

    • 中央

    • 底部

  • 水平对齐

    • 剩下

    • 中央

slide-settings-2

 

16.联系表格块

您可以通过此块获取客户电子邮件联系通知。 您可以通过单击创建该表单 联系表 Advanced Gutenberg类别中的按钮。

 

联系表

 

您可以编辑的设置 联系表 在右侧面板上。

  • 注意: 如果在“设置”中启用reCAPTCHA选项,则不会出现。

  • 电邮发件人: 您可以在“设置”中更改。 每当提交联系表单时,都会向管理员电子邮件发送一封电子邮件(默认情况下)。

  • 文字标签:

    • 名称输入占位符

    • 电子邮件输入占位符

    • 消息输入占位符

    • 提交文字

    • 空的领域警告文本

    • 提交成功文本

 

contact-settings1

 

  • 输入颜色: 背景颜色和文本颜色

  • 边框设置: 边框颜色,边框样式和边框半径

  • 提交按钮设置:

    • 颜色设置: 边界和文本,背景

    • 按钮边框半径

    • 按钮位置: 左,中,右

contact-settings2

 

17.通讯块

要获取客户端电子邮件,您可以通过单击创建电子邮件块 通讯 Advanced Gutenberg类别中的按钮。

 

通讯

 

您可以在右侧面板上编辑新闻稿的设置。

  • 注意: 如果在“设置”中启用reCAPTCHA选项,则不会出现。

  • 表单设置:

    • 表单样式:默认/替代

    • 表格宽度(px)

  • 文字标签:

    • 电子邮件输入占位符

    • 提交文字

    • 空的领域警告文本

    • 提交成功文本

 

newsletter-settings1

 

  • 输入颜色: 背景颜色和文本颜色

  • 边框设置: 边框颜色,边框样式和边框半径

  • 提交按钮设置:

    • 颜色设置: 边界和文本,背景

    • 按钮边框半径

 

newsletter-settings2

 

18.列管理器块

如果要创建包含其他块的块,则应选择 专栏经理 在Advanced Gutenberg类别中。 创建新块时,它将显示块的样式。

 

加列经理块

 

然后,您可以在每列中添加所需的任何类型的块。 这是一个列管理器块,包括2列:左边是高级图像,右边是段落,高级列表。

 

列管理器块

 

在右侧面板上,您可以调整Column Manager块的设置。

  • 响应设置

    • 每种设备类型的样式:桌面,平板电脑,移动设备

    • 列之间的空格

    • 填充:顶部,右侧,左侧和底部

    • 保证金:上,右,左和下

 

column-settings-1

 

 

  • 行设置

    • 包裹的列:如果您的列溢出,它将被分隔为一个新行(例如:使用此列与列间距)。

    • 包装标签:Div,Header,Main,...

    • 内容最大宽度(px vw,%)

    • 内容最小高度(像素,大众,大众)

    • 内容最大高度(px,vw,vh)

 

column-settings-2

 

19.登录/注册表格块

您可以为您的网站创建登录表单或注册表单 通过点击 登录/注册表格 Advanced Gutenberg部分中的按钮。

 

登录状块

 

您可以在此块的导航栏或右侧面板上将视图从登录切换到注册。

 

登录寄存器状

 

然后,您可以转到右侧面板以调整有关表单的更多详细信息。

  • 初始表格: 登录或注册

  • 登录后重定向: 首页庭,仪表板或自定义

  • 表格宽度 (PX)

  • 显示徽标

  • 徽标宽度 (PX)

  • 显示输入字段图标

  • 显示注册/标题链接

  • 标题颜色

  • 显示丢失的密码链接

 

形状态setttings

 

  • 输入占位符

    • 登录输入占位符

    • 用户名输入占位符

    • 电子邮件输入占位符

  • 文字/输入颜色

    • 输入背景颜色

    • 输入颜色

    • 文字颜色

  • 边框设置

    • 边框颜色

    • 边框风格

    • 边框宽度

 

输入占位符的设置

 

  • 提交按钮设置

    • 边框和文字

    • 背景

    • 按钮边框半径

    • 按钮位置

  • 提交按钮悬停

    • 悬停颜色: 背景,文本和阴影颜色

    • 阴影: 不透明度,转换速度和阴影(H(水平)偏移,V(垂直)偏移,模糊,扩散)

  • 注意: 我们强烈建议启用Google reCaptcha以避免垃圾邮件僵尸程序。 您可以在Form Recaptcha中启用它 进阶 古腾堡>电子邮件和表格 .

 

提交按钮的设置

 

20.搜索栏块

您可以通过单击在前端创建搜索文本框 搜索栏 Advanced Gutenberg类别中的按钮。

 

搜索栏块

 

您可以在右侧面板上调整“搜索栏”设置。

  • 样式: 有2种预定义样式:默认和经典

  • 搜索栏状态

    • 全宽:开/关

    • 宽度

  • 搜索图标设置

    • 右侧的搜索图标:开/关

    • 搜索图标

 

搜索栏的设置

 

  • 搜索输入设置

    • 搜索占位符

    • 输入颜色:背景和文本颜色

 

搜索输入的设置

 

  • 搜索按钮设置

    • 显示提交按钮:开/关

    • 左侧的搜索按钮:开/关

    • 背景和文字颜色

    • 边界半径

  • 悬停颜色: 背景,文本和阴影颜色

  • 悬停阴影: 不透明度,转换速度和阴影(H(水平)偏移,V(垂直)偏移,模糊,扩散)

 

搜索按钮的设置