寻找让您的WordPress内容段落更有视觉吸引力的方法吗?图形分隔符是一种强大的设计工具,可以将平面段落转变为动态流畅的布局。
您可以通过添加各种形状来展示个性,引导访客浏览您的内容,而不是使用基本的水平线。
无论您是想要细微的过渡还是在段落之间添加大胆的分隔符,我们将向您展示如何在WordPress中创建自定义图形分隔符。我们将介绍WordPress内置选项和我们常用页面构建器插件SeedProd的更高级的替代方法。
为什么要在您的WordPress网站中添加自定义图形分隔符?
图形分隔符是一种类型的段落分隔符,您可以在内容块之间添加。
这些分隔符可以很简单,例如使用WordPress内置的块创建的水平线。
您可以使用这些基本的分隔符来组织和分隔内容,这在覆盖很多不同主题的页面上特别有用。
您还可以使用页面构建器插件和其他网页设计软件创建更高级的图形分隔符。这些分隔符可以突出显示您网站上最重要的内容,使其在访客和客户面前脱颖而出。
引入看起来专业的图形分隔符还可以使您的页面更有趣和吸引力。
例如,您可以使用它们为电子邮件新闻通讯注册表单创建独特的背景。
话不多说,让我们来看一下如何在WordPress中创建自定义图形分隔符。您可以使用下面的快速链接直接跳到您想使用的方法:
- 方法一:在块编辑器中创建简单的图形分隔符(无需插件)
- 方法二:使用页面构建器在WordPress中创建自定义图形分隔符(推荐)
方法一:在块编辑器中创建简单的图形分隔符(无需插件)
添加WordPress图形分隔符最简单的方法是使用内置的“分隔符”块。
这种方法允许您在任何WordPress块之间添加一个水平线分隔符,然后自定义线的颜色和样式。
这种方法不允许您在WordPress中添加不同的形状,并且自定义设置有限。然而,您无需安装额外的WordPress插件,因此这是在您的网站上添加简单图形分隔符的最简单方法。
要开始,请打开您要在Gutenberg内容编辑器中添加水平分隔线的文章或页面。然后,单击要放置分隔符的位置上的“+”按钮。
在弹出窗口中输入“分隔符”。
当正确的块出现时,点击添加到文章或页面上。
要自定义默认的分隔符块,单击它,然后使用右侧菜单中的设置。
您可以通过“样式”部分中的按钮在默认、宽线和点之间切换。
您还可以更改线的颜色,使其与您的主题或品牌匹配。
要做到这一点,点击“背景”,然后从出现的弹出窗口中选择颜色。
此外,您可以调整分隔符的边距。
边距越大,分隔的块之间的空间就越大。
当您对分隔符的外观满意时,您可以单击“发布”或“更新”按钮以使图形分隔符功能上线。
方法二:使用页面构建器在WordPress中创建自定义图形分隔符(推荐)
如果您想使用不同的形状并自定义分隔符的每个部分,我们推荐使用SeedProd插件。
SeedProd是市场上最好的WordPress页面构建器插件,它允许您使用简单的拖放编辑器将自定义图形分隔符添加到任何部分、行或列。
它还带有超过300个专业设计的模板和90多个块,您可以用来创建美丽的自定义主页、登陆页面等。
注意:WordPress.org上提供了SeedProd的免费版本,但我们将使用专业版,因为它提供了广泛的图形分隔符。
首先,您需要安装并激活SeedProd插件。有关详细信息,请参阅我们关于如何安装WordPress插件的分步指南。
激活后,您需要输入您的许可证密钥。
您可以在SeedProd网站上的账户中找到此信息。在输入许可证密钥后,点击“验证密钥”按钮。
完成后,转到SeedProd » 页面,然后点击“添加新登陆页面”按钮。
接下来,是时候选择一个页面模板了。SeedProd提供大量专业网站设计模板,您可以根据自己的WordPress网站进行细化调整。
要选择模板,只需将鼠标悬停在其上,然后单击“勾选”图标。
接下来,输入页面名称。SeedProd会根据页面标题自动创建URL,但您可以将其更改为任意URL。
当您对输入的信息满意时,单击“保存并开始编辑页面”按钮。
接下来,您将进入到准备自定义模板的拖放页面构建器。
SeedProd编辑器在右侧显示设计的实时预览,在左侧显示一些块设置。
左侧菜单还具有可拖动到您的布局中的块。
例如,您可以拖放标准块,如按钮和图像,或使用高级块,如倒计时器、社交媒体分享按钮等。
要自定义块,只需单击选中布局中的块。
左侧菜单将显示您可以用来配置该块的所有设置。您还可以更改页面的背景颜色、添加背景图像或更改颜色方案和字体,以更好地匹配您的品牌。
SeedProd还提供“部分”,它是经常一起使用的多个块的集合。例如,SeedProd有页眉部分、主图像、行动呼吁、客户推荐功能、页尾部分等。
要查看不同的部分,只需单击“部分”选项卡。
您可以使用拖放移动布局中的部分和块。
如果您想删除一个块,只需将鼠标悬停在其上,然后单击显示的垃圾桶图标。
无论您是否选择使用SeedProd的部分,您现在都可以创建自定义图形分隔符。只需单击选择要添加分隔符的部分、行或列。
然后,在左侧菜单中点击“高级”选项卡。
现在,点击展开“图形分隔符”选项。
首先,您可以选择通过选择“顶部”或“底部”按钮来显示图形分隔符的地方。
您现在可以在“类型”菜单中打开并选择您想使用的形状分隔符。
当您选择不同的形状时,实时预览将自动更新,因此您可以尝试不同样式来查看哪种效果最佳。
选择图形分隔符后,您可以使用新设置对其进行样式化。
首先,您可以点击“颜色”并从出现的弹出窗口中选择新颜色。
完成后,您可以通过拖动“宽度”和“高度”滑块来调整分隔符的大小。
如果您已经有特定的大小,请将数字输入到相应框中。
您还可以通过点击启用或禁用“翻转”开关尝试翻转分隔符。
默认情况下,分隔符会出现在其他内容的后面,以便用户可以清楚地看到任何重叠的文本、图像或其他内容。
然而,将形状移到前面可以产生一些有趣的效果。如果您想看看这种效果,请点击启用“置于前面”开关。
要添加更多分隔符,只需按照上述步骤进行即可。
您甚至可以在一个区域的顶部和底部添加图形分隔符,这通常会产生一些令人印象深刻的视觉效果。
您可以继续通过在左侧菜单中添加更多块并自定义这些块来完成页面的编辑。
当您对页面的外观感到满意时,点击“保存”按钮。然后,您可以选择“发布”以使该页面上线。
如何将图形分隔符添加到WordPress主题
SeedProd的拖放编辑器让您可以自由地将独特的图形分隔符添加到任何页面。有时,您可能希望在多个网页上甚至整个WordPress博客或网站上使用相同的图形分隔符。
这样可以帮助您创建一致的设计,同时还省下大量时间。在这种情况下,我们建议通过使用SeedProd的主题构建器将图形分隔符添加到您的主题中。
使用SeedProd,您无需编写任何代码,即可创建和自定义WordPress主题。它会创建构成您主题的所有文件,包括侧边栏、页眉、页脚、单个文章等。
然后,您可以使用熟悉的拖放构建器自定义这些文件。这包括按照上述相同的过程添加图形分隔符。
当您使用SeedProd激活新主题时,它将覆盖您现有的WordPress主题,因此仅当您想要更换当前主题时才应使用此方法。
有关详细的分步说明,请参阅我们关于如何轻松创建自定义WordPress主题的指南。
发现更多WordPress设计小贴士和技巧
想要添加更多令访客印象深刻的设计功能吗?了解更多WordPress设计小贴士和诀窍:
- 如何在任何WordPress主题中添加视差效果
- 如何在WordPress中创建“粘性”浮动页脚栏
- 如何创建手机友好的响应式WordPress菜单
- 如何在WordPress中添加加载动画(分步指南)
- 如何在WordPress文章中添加首字下沉(Drop Caps)
- 如何为您的WordPress网站添加黑暗模式(简单易行)
- 如何在WordPress中添加动画背景
我们希望本教程能帮助您了解如何在WordPress中创建自定义图形分隔符。您可能还想了解如何在WordPress中添加带有图标的功能框以及我们的专家提示,了解如何创建手机友好的WordPress网站。
如果您喜欢这篇文章,请订阅我们的YouTube频道以获取WordPress视频教程。您还可以在Twitter和Facebook上找到我们。