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

您所在的位置:网站首页 wedo模块介绍 阿里巴巴PC店铺装修的自定义模块代码植入方式介绍

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

2023-04-22 09:22| 来源: 网络整理| 查看: 265

0 分享至

用微信扫码二维码

分享至好友和朋友圈

文章的做法和看法是基于阿里巴巴的国内PC店铺装修。读懂本文你可能需要具备以下前提:

1. 对阿里巴巴PC店铺有基础的认知概念;

2. 知道阿里巴巴的自定义模块怎么添加;

3. 基础的HTML和CSS知识。

“自定义内容”顾名思义就是可以DIY东西,当然这个模块本身也是有自身的规矩的,至于这个模块本身有什么使用限制估计是道不尽的,作者看法与其写一大堆失败例子还不如提供写一些证明已经是使用的例子。

1. 使用内联方式写进CSS

红色下划线部分就是内联CSS,一般情况下,阿里的自定义模块不会过滤这里面的CSS样式代码,但是作者发现就上面这一串代码,系统会自动把url(背景图片地址) 这一块给过滤掉,更多的过滤准则只能靠实践中发现然后通过另外的手段去解决了。

2. 按照常规的写法

常规写法指的是在HTML标签里面写入class或者Id来匹配对应的CSS样式,当然这里是不要通过导入CSS文件的模式导入CSS样式

这种写法的好处是代码清晰分明,容易整理修改,但遗憾的是如果你是直接拷贝进自定义中的代码区域的话,你会发现最后的代码会变成下图所示

可以看出来,以上两种方法都不能直接解决问题,因为自定义模块的过滤机制基本毁掉了你整段代码的核心,如果你纯粹编写简单的代码,可以用第一种方法进行尝试,但是如果你的代码是一个大模块,显然第一种做法就显得有点笨重了,而且这种方法也不能使用伪类(例如鼠标悬停这种基础伪类 :hover等)。所以作者重点的分享就在于如何让第二种方法在自定义模块中生效。请关注下一篇文章。

特别声明:以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布,本平台仅提供信息存储服务。

Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.

/阅读下一篇/ 返回网易首页 下载网易新闻客户端


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3