文 | 木凡大人
上期发布了《关于淘宝店铺全屏轮播图制作代码的方法》后,收到网友询问,如何在一张大海报上添加多条链接?
今天@木凡大人就收集整理了关于在一张海报上添加多个链接的三个简单方法,这也许是我最后发布有关淘宝的教程了。话不多说,咱们来看具体操作步骤。
方法一:码工助手
首先打开码工助手,话说我很爱用啊,哈哈。有个<全屏设计代码>,点击进入。
进入后的界面
具体操作界面
注意,先注册登录。不然做好了提示需要注册,内容一下子全没了。
制作好一张海报,大小1920x600尺寸,我是借用了自己平时收藏的海报来做案例。已经上传至淘宝图片空间,具体怎么操作,看之前的教程,这里不赘述。
然后,复制图片地址到码工助手全屏海报制作界面<图片地址>,然后点击载入图片。<店铺类型>按自己店铺类型选择。<模块间隙>这里默认。
<图片链接地址>,可增加多个跳转链接。可以是专题页面,也可以是宝贝链接。建议先添加。
然后在图片上添加热点。因为海报上有四个女模特,所以我加了四个热点,对应四个不同的链接。具体如图:
话说,添加热点时,绿色线框容易飘。这点得吐槽下。这个看手感,你懂得。
然后,预览下效果。保证海报上的四个位置在点击后能跳转到四个不同的链接。
预览OK,然后点击<获取代码>,复制内容。
然后回到卖家中心-店铺装修-自定义区-编辑-标题不显示-源码-插入复制的代码-确定。具体操作,看上一篇。楼主比较懒,不截图了哈,望见谅。
然后预览,当当当~逐个点击下,OK,完美。
方法二:PS切片
这里需要提醒下,PS切片法,目前木凡大人只会制作950宽的海报,全屏的海报可以用第一个方法。这个方法仅针对950尺寸,就是淘宝默认的海报尺寸。
首先制作好一张950x600的尺寸,嘿嘿,换了个尺寸,美女看得更清晰。用PS打开,如图:
点击工具栏的切片工具,如图:
然后把整张图切成四个方块,每个方块的底部要保持在一条线上,蓝色的线框就是,如图:
然后,点击菜单栏-文件-存储为web所用格式。
格式为<仅限图像>,然后保存。
生成了一个image文件夹,有四张图,而且还编好号了。然后把图片上传到淘宝图片空间,如图:
重复步骤,回到卖家中心-店铺装修-自定义区-编辑-标题不显示-插入图片空间图片。
插入图片时,按照123的顺序插入。插入完成,如图:
然后编辑这四张图片,给每个图片添加一条跳转链接。
点击确定,如图:
完整的950大图完成啦!预览,发布站点,完美!
方法三:DW热点
这个方法要求先把海报上传到淘宝图片空间。用的还是宽950的图片,我已经上传到Dreamweaver界面如下:
点击图片,出现如图设置栏,添加热点地区为标红区域。
根据海报需求,我选择的是矩形选框。添加如图所示的热点区域:
想改变选框大小,点击设置区域的黑色箭头就行。选框大小没有要求,随意设置,只要用户在点击图片(如点击购买字眼)时确保能点击到就行。
点击每个热点,在设置区域,添加跳转链接(专题、宝贝链接),目标_blank,表示跳转链接在新窗口打开。
回到拆分界面,把海报地址粘贴到标红的位置。
这里提醒下,如果店铺装修使用多个这种方法的话,把图片上标红的Map位置,改为map1、map2...不然保存后,多个自定义相互之间会有冲突。
最后,还是重复,回到卖家中心-店铺装修-自定义区-编辑-标题不显示-源码-插入复制的代码-确定。预览如图:
点击一个区域,就会出现蓝色色块,这个方法还是不错的,可以制作元素多样的海报,灵活性比较好。
好了,这是制作大海报添加多个链接的三个方法,具体简单或是不简单,看大家的习惯了。
实践是检验真理的唯一标准。
望大家共勉。
- END -
我是@木凡大人,热爱生活,乐于分享。
本文由@木凡大人 原创,转载请注明,请尊重原创。