会员服务
default sy_dh
在线客服
如何不用图片创建一个动画按钮 - 实操手册 - 富裕者联盟社区 - Affiliate营销圈

60回答

0收藏

如何不用图片创建一个动画按钮

 

实操手册 实操手册 10714 人阅读 | 60 人回复 | 2023-02-07

刚才我讲过在登陆页面中使用CSS3动画。它们很棒——它们给了你很多吸引眼球的gif动画元素,而且没有文件大小的问题。

但是你要怎么做呢?

好的,今天我将向你展示一个简单的CSS动画的应用:为你的着陆器创建一个动画的CTA。

众所周知,动画CTA可以微妙地提高CTR,但在移动设备上使用它们总是有点棘手,因为添加动画GIF会影响文件大小。但是现在,你可以使用CSS来制作动画,不会出现加载时间变慢的情况——而且它们看起来会比gif更流畅!

做这个需要准备什么?

您将需要能够编辑您的着陆器的HTML,并有HTML标签的基本了解。

除此之外,您不需要任何编码知识就可以使用该技术的基本版本。如果您想学习更高级的Javascript知识,可能会很方便,但我将解释您需要知道的大部分内容。

如何做

设置这个实际上非常简单。

首先,添加一些项目到您的CTA。你需要添加一个名为“attention”的新类,你可能需要更改你的CTA的显示类型为“block”。

要做到这一点,只需再CTA的HTML标签中添加:

class="attention" style="display:inline-block"

比如,如果你的CTA是这样的:

#a href="mytrackerlink.com/blahblah/"#Click Here!#/a#

那么就改成:

#a href="mytrackerlink.com/blahblah/" class="attention" style="display:inline-block" #Click Here!#/a#

现在,就在登陆页面的#/body#标签结束之前,添加以下代码:

好了,你完成了。保存,上传到你的服务器,你会立即看到效果-你的CTA将弹出邀请。

加入社区,可阅读全站10w+资源

 非会员试读19%,加入社区后可阅读全文 

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
分享到:
回复

使用道具 举报

回答|共 60 个

jlgz9612

发表于 2023-2-8 06:10:20 | 显示全部楼层

此帖仅作者可见

使用道具 举报

Blueaphry

发表于 2023-2-8 07:11:07 来自手机 | 显示全部楼层

此帖仅作者可见

使用道具 举报

wxl1231

发表于 2023-2-8 08:53:40 | 显示全部楼层

此帖仅作者可见

使用道具 举报

dapeng

发表于 2023-2-8 10:02:29 来自手机 | 显示全部楼层

此帖仅作者可见

使用道具 举报

犯不着凶

发表于 2023-2-8 10:39:21 | 显示全部楼层

此帖仅作者可见

使用道具 举报

haharenren

发表于 2023-2-8 19:06:50 | 显示全部楼层

此帖仅作者可见

使用道具 举报

liebemachen

发表于 2023-2-8 19:38:56 | 显示全部楼层

此帖仅作者可见

使用道具 举报

御风

发表于 2023-2-9 08:15:06 来自手机 | 显示全部楼层

此帖仅作者可见

使用道具 举报

fcxiehp

发表于 2023-2-9 11:14:41 来自手机 | 显示全部楼层

此帖仅作者可见

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭