大多数文本链接在悬停上做一件事:更改颜色。 Elementor 创意链接小部件 从主插件给你玩了很多:括号滑入单词,一个扫过文本的填充,一个3d翻转(pro),以及22悬停效果,总计你可以掉在任何链接上,而无需打开一个css文件。
下面,我们将添加小部件,浏览每个内容控件,覆盖样式选项,并按下效果列表。编辑器的屏幕截图随附每个步骤。首先,这是面板中小部件的位置。
创意链接小部件的作用 #
它需要一个简单的内联链接并使其移动。 创意按钮小部件 styles一个坚实的, 带衬垫的按钮。创意链接是文本链接版本:一个“阅读更多”, 一个导航式号召性用语, 或者一个你想在句子内部脱颖而出的单个短语。动画在悬停时开火, 你从一个下拉中选择它。
您还可以获得一个可选图标、一个某些效果显示的备用标签、对齐控件以及一个带有排版、边框的样式选项卡,以及围绕链接动画构建的一组颜色选项。它位于免费的 Master Addons 插件中,有 10 个效果,Master Addons Pro 解锁其他 12 个完整功能 小部件和扩展 列表有其余部分。
宁是在阅读每个设置之前看到它?这是正在执行的小部件。
在开始之前 #
- 文字出版社 与 元素 已安装并处于活动状态。
- Elementor 的主插件 已安装并处于活动状态。新到?从开始 安装指南.
- Elementor 编辑器中打开的页面或模板。
如何添加创意链接小部件 #
这部分很快:
- Elementor打开一个页面,然后点击左上角的小部件面板图标(网格)。
- 类型 创意链接 在搜索框中,或向下滚动到 主插件 类。
- 拖动 创意链接 小部件到画布上。
它以占位符 “点击此处”文本降落,可供您编辑。
内容设置已解释 #
选择链接并打开 内容 tab。this是你设置文本的地方,效果,链接指向的地方。
效果 #
的 效果 dropdown是使用这个小部件的全部原因, 选一个, 链接在悬停上动画化, 列表有22个选项, 十个是免费的, 十二个需要 Pro:
免费: 括号、底线幻灯片、底边放大、第二边向上幻灯片、文本填充、三个点、向下缩放、向上移动、效果 21 和效果 22。
专业: 3D效果, 滑入, 边界滑下, 边界翻译, 第二文本和边界, 揭示推出, 圆圈, 边界开关, 倒下, 交叉, 3D滑动, 和3D滑下。
名字并没有太多赠送,所以在实时预览中悬停链接,看看每个链接都做什么,括号和文本填充在身体副本中效果很好,3D选项(Pro)声音更大,适合标题或英雄链接。
项目对齐、链接对齐和后文本对齐 #
项目对齐 定位整个小部件(左、中、右)。 链接对齐 並 背面文本对齐 处理某些效果带来的链接文本和备用标签。这三个都是响应式的,因此您可以使用切换设置每个设备。
链接文本和替代链接文本 #
的 链接文本 是可见标签,比如说“点击这里”。的 替代链接文本 (“Go!”在截图中)是第二个在Reveal Push Out、Move Up、Cross、3D Slide和3D Slide Down上互换的标签。保持简短,因为它只获得了动画留下的空间。
图标和图标间距 #
您可以将图标放在文本旁边,然后设置间隙 图标间距。主插件捆绑八个高级 图标库elementor 内部有很多可供选择的内容。
链接网址 #
将目的地放入 链接网址。旁边的齿轮图标中保存通常的选项:在新选项卡中打开,添加nofollow。in站点链接,粘贴您自己站点的任何页面。
样式设置已解释 #
切换到 风格 选项卡并打开 链接样式。动画前后链接是这样看的。
- 宽度 並 图标尺寸:自行大小链接框和图标。
- 版式:字体系列、大小、重量和标签的字母间距。
- 链接填充:链接区域内部的间距。它还给出了一些效果空间来动画。
- 边框类型、宽度、颜色和半径:链接框周围的一个边框,像底线幻灯片这样的效果中的移动线来自BG颜色之前和之后,而不是来自这个边框。
- 盒子阴影:如果您愿意,链接框上的深度。
正常颜色和悬停颜色 #
颜色控制分为 正常 並 悬停 州。与通常的 文本颜色 並 背景颜色的, 你会看到的 前BG颜色, BG颜色之前、和 BG颜色之后。那些额外的图层是幻灯片和填充效果之间的动画,因此当您想要控制显示动画中期的颜色时,请设置它们。
看到作用中的效果 #
Brackets效果在画布上,将链接悬停,每边都滑入一个括号,所以“点击这里”读作“[点击这里]”, 每一个效果在直播预览中都表现得如此,这使得在提交之前很容易尝试几个。
使用创意链接的技巧 #
- 将效果与现场相匹配。 Text Fill 或底线幻灯片之类的微妙的,在段落中坐得很好。为标题和英雄区域保存 3D 幻灯片和十字架(均为 Pro)。
- 观看 BG 颜色。 前面、之前和之后背景可以在动画中冲洗文本,因此请检查链接在整个效果中保持可读性。
- 保持备用标签短。 长长的替代链接文本在动画留下的空间中变得局促。
- 别忘了触摸。 Hover不会在手机上开火,所以休息状态必须自己看完。
需要一个完整的实体按钮而不是文本链接?就是这样 创意按钮小部件。想要一个标题,描述,和按钮在一起吗?看 行动号召小部件.
常见问题 #
什么是 Elementor Creative Links 小部件?
Elementor上添加动画文本链接的主插件小部件,而不是简单的颜色更改,链接会获得括号,文本填充,以及(与Pro)圆圈和3D幻灯片等悬停效果,所有这些都从下拉设置,没有自定义CSS。
包含多少个链接效果?
Widget有22个效果,十个是免费的,包括括号,底线幻灯片,文本填充,三个点,向上移动,十二个需要Pro,包括3D效果,幻灯片,圆圈,边界开关,交叉,3D幻灯片,你在发布之前在Elementor编辑器中预览每个。
创意链接小部件免费吗?
是的。Creative Links 是 Elementor 插件免费 Master Addons 的一部分,具有 10 种效果。Master Addons Pro 添加了其他 12 种效果。请参阅 定价页面 为全面比较。
创意链接和创意按钮有什么区别?
Creative Links 将内联文本链接动画化,例如 “Read more” 或句子中的短语。 Creative Buttons 风格为坚固的带衬垫按钮。选择文本风格的号召性用语的链接和块风格的按钮。
链接悬停效果在移动设备上有效吗?
Hover效果需要鼠标,所以触摸屏上不会触发,设计静止状态看起来完整,链接在手机和平板电脑上仍然工作和读取良好。
包裹起来 #
的 Elementor 创意链接小部件 给你的文本链接移动:22个悬停效果(10个免费),一个图标,以及动画层的颜色控件,没有代码,选择一个效果,设置颜色,你的链接就停止了,只是坐在那里,从这里开始,其余的 主插件小部件库 是值得一看。
