是否要为您的网站创建自定义WordPress块? 虽然WordPress提供了许多用于创建内容的基本模块,但您可能需要为您的网站提供更具体的模块。 在本文中,我们将向您展示两种为WordPress站点创建自定义Gutenberg块的方法。 这将把你带到‘创建自定义代码片断’页面,在这里你可以开始为你将要创建的自定义块输入一个名称。 完成后,只需从屏幕右角的“代码类型”下拉菜单中选择“块代码片段”选项即可。 这将在“代码预览”框中显示“用块编辑器编辑”按钮。 只需点击此按钮即可启动块编辑器。 现在,屏幕上将出现一个提示,要求您保存代码片段以将其加载到块编辑器中。只需点击“是”按钮即可继续操作。 现在已进入块编辑器,可以使用块菜单中提供的预制块轻松创建自定义块。 在本教程中,我们将创建一个用于在您的网站上添加表彰的自定义块。 首先,你需要点击屏幕左上角的‘+’按钮来打开区块菜单。 从这里,拖放标题块到块编辑界面,并命名为‘证言’。 接下来,您可以使用段落、拉引号或引号块在您的网站上添加来自不同客户的推荐信。 您甚至可以使用图像、站点徽标、社交图标或站点标语块来进一步定制您的推荐信块。 您还可以从屏幕右侧的块面板中自定义推荐信的大小、文本颜色或背景颜色。 一旦你完成了,别忘了点击顶部的‘更新’按钮来存储你的自定义区块设置。 接下来,只需点击顶部的“返回WPCode代码片段”按钮,即可重定向到“编辑代码片段”页面。 一旦你在那里,向下滚动到“插入”部分,并选择“自动插入”模式。 激活代码片段后,您的自定义块将自动添加到您选择在网站上插入的位置。 接下来,您必须配置您创建的自定义块的位置。 要做到这一点,只需点击“插入”部分中的“位置”下拉菜单,然后切换到“页面特定”标签。从这里,你现在可以选择‘插入后帖子’选项,如果你想在帖子结束后显示你的推荐信区块。 一旦你这样做了,你也可以配置帖子的数量,在此之后,证言块应该出现。例如,如果你输入数字3,那么每隔三个帖子就会出现一次推荐信。 您还可以在不同段落之间、帖子摘录之后等等显示该块。 但是,如果您没有找到要查找的块位置,则还可以创建自己的条件逻辑规则以将自定义块添加到您的首选位置。 要实现这一点,请向下滚动到“智能条件逻辑”部分,然后打开“启用逻辑”开关。 接下来,您必须单击“添加新组”按钮以开始创建条件逻辑规则。 例如,如果您只想显示您在特定页面或帖子上创建的自定义块,则必须从右侧的下拉菜单中选择“Page URL”选项。 之后,您可以保留中间的下拉菜单不变,然后将您选择的WordPress页面/帖子的URL添加到左侧的字段中。 您还可以将条件逻辑规则配置为仅在特定页面、登录用户、WooCommerce商店页面、轻松数字下载页面、特定日期等上显示自定义块。 完成后,滚动回页面顶部,将“Inactive”开关切换为“Active”。然后,点击“更新”按钮来存储您的设置。 现在,自定义块将自动添加到为块代码段选择的所有位置。 请记住,您创建的自定义块不会显示为古登堡编辑器的块菜单中的一个选项。 您必须通过访问代码片段从WordPress仪表板中打开页面,然后单击块代码片断下面的“编辑”链接。 这将打开“编辑代码片断”页面,您可以在其中轻松地自定义块或更改其位置和条件逻辑规则。 现在访问您的网站以查看您在操作中创建的自定义图块。 以下是我们演示网站上的定制推荐信。 这将带您到块编辑器页面,在那里您将为您的WordPress站点创建自定义块。 从这里开始,你可以给你的街区起一个名字。 现在,在页面的右侧,您将找到您可以配置的块属性。 在这里,你可以为你的区块选择一个图标,添加一个类别,以及添加关键字。 插件将根据您的块的名称自动填充,因此您不必更改它。但是,您最多可以在“关键字”文本字段中输入3个关键字,以便轻松找到您的区块。 现在,是时候向块中添加一些字段了。您可以添加不同类型的域,如文本、数字、电子邮件地址、URL、颜色、图像、复选框、单选按钮等。 我们将在我们的自定义推荐信块中添加3个域:用于审阅者照片的图像域、用于审阅者姓名的文本框和用于推荐信文本的文本区域域。 只需点击‘+’按钮即可插入第一个字段。 这将为右栏中的字段打开一些选项。让我们逐一来看一看。 字段标签:您可以使用您选择的任何名称作为字段标签。让我们将我们的第一个字段命名为“审阅者图像”。字段名:将根据字段标签自动生成字段名称。我们将在下一步中使用此字段名,因此请确保它对于每个字段都是唯一的。字段类型:在这里,您可以选择字段类型。我们希望我们的第一个域是一个图像,所以我们将从下拉菜单中选择‘图像’。现场位置:您可以决定是否要将该字段添加到编辑器或检查器。帮助文本:您可以添加一些文本来描述该字段。如果您为个人用途创建此区块,则不需要执行此操作,但对于多作者博客可能会有所帮助。 根据您选择的字段类型,您可能还会看到一些其他选项。例如,如果您选择一个文本字段,那么您将获得其他选项,如占位符文本和字符限制。 按照上面的流程,让我们通过点击“+”按钮为我们的推荐信区块添加另外两个字段。 如果要对字段重新排序,则可以使用每个字段标签左侧的手柄拖动它们。要编辑或删除特定字段,您需要单击该字段标签并编辑右列中的选项。 完成后,只需单击页面右侧的“发布”按钮即可保存您的定制Gutenberg块。 步骤2:创建自定义块样板 尽管您在上一步中创建了自定义WordPress块,但在您创建块模板之前,它不会起作用。 块样板确定输入到块中的信息在网站上的显示方式。如果需要运行函数或对数据执行其他高级操作,您可以通过使用HTML和CSS来决定它的外观,甚至可以使用PHP代码。 有两种方法可以创建块样板。如果您的块输出为HTML/CSS格式,则可以使用内置模板编辑器。 […]

































