阿里巴巴PC店铺装修的自定义模块代码植入方式介绍 _生活知道

文章摘要：店铺里面自定义模块是阿里巴巴甚至淘宝之类的网店进行店铺装修里面最为重要，甚至是唯一的一个途径，所以认识了解自定义模块的代码植入规则是店铺装修一个很重要的前提。
文章的做法和看法是基于阿里巴巴的国内PC店铺装修。读懂本文你可能需要具备以下前提：
1. 对阿里巴巴PC店铺有基础的认知概念;
2. 知道阿里巴巴的自定义模块怎么添加;
3. 基础的HTML和CSS知识。
“自定义内容”顾名思义就是可以DIY东西，当然这个模块本身也是有自身的规矩的，至于这个模块本身有什么使用限制估计是道不尽的，作者看法与其写一大堆失败例子还不如提供写一些证明已经是使用的例子。
1. 使用内联方式写进CSS
红色下划线部分就是内联CSS，一般情况下，阿里的自定义模块不会过滤这里面的CSS样式代码，但是作者发现就上面这一串代码，系统会自动把url(背景图片地址) 这一块给过滤掉，更多的过滤准则只能靠实践中发现然后通过另外的手段去解决了。
【阿里巴巴PC店铺装修的自定义模块代码植入方式介绍】2. 按照常规的写法
常规写法指的是在HTML标签里面写入class或者Id来匹配对应的CSS样式，当然这里是不要通过导入CSS文件的模式导入CSS样式
这种写法的好处是代码清晰分明，容易整理修改，但遗憾的是如果你是直接拷贝进自定义中的代码区域的话淘宝默认的免费旺铺系统模板有三套，你会发现最后的代码会变成下图所示
可以看出来，以上两种方法都不能直接解决问题，因为自定义模块的过滤机制基本毁掉了你整段代码的核心淘宝默认的免费旺铺系统模板有三套，如果你纯粹编写简单的代码，可以用第一种方法进行尝试，但是如果你的代码是一个大模块，显然第一种做法就显得有点笨重了，而且这种方法也不能使用伪类(例如鼠标悬停这种基础伪类 :hover等) 。所以作者重点的分享就在于如何让第二种方法在自定义模块中生效。请关注下一篇文章。
本文到此结束，希望对大家有所帮助！

阿里巴巴PC店铺装修的自定义模块代码植入方式介绍

猜你喜欢