本节讲解自定义页面的楼层跳转效果,自定义页面相当专题页,是最接近于首页装修的,学完本课内容后,同学们可以在下方评论区进行留言,作业也可以在评论区进行提交,老师会一一解答。
那我们开始今天的课程。
1.打开一个淘宝店铺预览一下效果,有较多的分类实现楼层跳转效果,将图片保存电脑,使用【PS】打开,效果如图所示。
2.来到淘宝装修页面,新建【自定义页面】,在【页面布局】中将两个小块删除,添加一个【布局模块】,如图所示。
3. 将模块移动到上面,在页面编辑里添加自定义模块,将图片素材上传到淘宝,复制图片的代码,在【码工助手】使用【通栏模块】粘贴生成代码,如图所示。
4.在自定义模块粘贴代码,点击确定,预览画面,如图所示。
5.回到【PS】,将图片合适的位置【Ctrl+Shift+C】合并拷贝,【Ctrl+N】新建并粘贴,【另存为Web所用格式】如图所示,
6.将图片上传并复制链接,回到【DW】中,使用矩形选框添加热点地图, 修改地图的名称,在代码页面复制代码,如图所示。