淘宝上比较漂亮的装修,大部分都是个性化设计,配合模板上独有的功能来实现某种效果,如果单独拿出某个图片,放在其他店铺上,就失去了原有的个性和吸引力,这就是整体设计带来的魅力,时下很多新手店铺,也想要获得此种装修,可能会盗用他人图片,或者自己设计一张,面临的问题就是单张图片,如何加多个链接,并且还要全屏效果,下面通过截图,简单说明如何实现:
1、下图来自淘宝店铺,1920全屏图片,一张图片加上4个优惠券链接,每个都可以单独弹出链接,要实现这种效果,需要使用热点工具生成代码,然后装修后台,添加自定义模块,添加上代码,有些还需要进一步修改代码,才能合格。
2、笔者使用的是【稿定设计】网站热点工具,是免费的,在画布设置里面,填上图片链接(先上传到淘宝图片空间,复制链接,粘贴到此处),【去掉间隙】设置为20,目的是实现与上一个模块无缝拼接,【全屏】默认【开启全屏】,具体如下图所示。也可以在搜索其他热点工具,网上很多,都是免费的。
3、鼠标直接放在图片上拖拉,就可以做出一个热点区域,
4、画出区域之后,在弹出的属性框内,输入链接,这里是优惠券,对应的是优惠券推广链接,如果是产品,那么就可以输入产品链接等,
5、所有热链做好之后,可以先【预览效果】,挨个链接点击试一下,如有问题,返回来在修改,只需要双击热点区域,就会弹出属性框,最后点击【生成代码】,
6、弹出的代码界面上,点击【复制代码】,
7、打开淘宝装修后台,拖动左侧模块中的【自定义区】到需要放置的区域,
8、然后双击模块,进入此模块的编辑界面,点击第一个按钮【源代码】,切换到代码界面,粘贴(文本框内右键单击,弹出菜单)代码后,点击【确定】即可。
一般通用的淘宝热点代码,用在专业版旺铺上不会有问题,但在基础版旺铺上,全屏效果出现问题,如果热点工具上有专门的基础版可选最好,如果没有的话出现问题就要自己手动修改代码。如遇到问题,可以在下方留言讨论。
如果没有的话出现问题就要自己手动修改代码。
请问怎样修改代码可使图片全屏展示呀?
2020-01-15 下午4:12如果有css基础,只需要调整left的值,如果没有代码基础,那就在网上搜搜吧,几句话说不明白。
2020-01-15 下午9:08