淘宝店铺模板制作――傻瓜式热点模版

如何制作淘宝模板？体现个性的时代，如何才能把模板加入自己的元素后运用到自己的店铺呢？自己动手丰衣足食。自制模版不求人，和淘宝学堂一起学习如何结合PS和DW制作自己喜爱的模板啦。在开展如何制作淘宝模板工作之前，要准备好两个软件：Photoshop和Dreamweaver。这里先发个样本上来大家看下哈。这个可以放到店铺首页的哦，跟我们平时从装修市场购买到的模板是一样的原理。工作分两步完成：第一步：用Photoshop打造出整个图片。我用的是PhotoshopCS3，其他版本的也差不多。首先，打开软件，新建空白文件，拓展版为950像素宽度，标准版为750像素宽度，具体高度根据自己的要求确定。然后，在菜单视图那里周出参考线。这个是为了制作出来的宝贝图片的整齐性而做的。接着，就是为空白文件添加图片了，我这里制作的是8张图的模板，以这个为例。打开将要合成的8张图片。由于制作过程的重复性我就只以一张图片作示范哦。最后，把图拉过去模板中，用自由变形工具合理缩放，大小合适就可以了，有多余的就删除。看下图，第一个图完成了哦。其他的逐张拉过去，缩放到需要的大小就OK了哦，不要忘记写上你宝贝的名称和价格。最终效果如下：是不是很美观呢，淘宝模板图的制作过种大概就这样，如果您觉得还不够好看，也可以自由发挥哦，例如在宝贝旁边加个“新品”“包邮”之类的词也可以的。到这里第一步工作算是完成了，当然最后不要忘记保存制作好的图片，保存为JPG格式的就可以了。第二步：超简单！只在把图片上传到淘宝空间就可以了。如图：第三步：用Dreamweaver2004制作代码。实现点击图转跳到宝贝详情页面的功能。下面我们一起来学习，不难的。（1）让我们打开Dreamweaver2004（软件版本自定）软件，界面如下：（2）就在菜单栏的“插入”中插入第一步中制作好的图片。看图示：看到了吗？这就是第一步中制作好的淘宝模板图片，插入到Dreamweaver软件界面的图，到了这里，是不是觉得不难呢，其实真的不难，下面到了最为重点的步骤了，就是为图片添加超链接。不用想了，直接点击矩热点工具，然后就对图片选择热点位置，看我的操作哦：选择了矩形热点工具后就在图片的相应位置画出正确的位置。下图：（3）：为选择好的区域添加超链接，这个链接，就是您相应宝贝的链接呢，比如我这里宝贝：再把复制到的链接粘贴就可以了，另外“链接”选项下面的“目标”要选择“blank”，这个可以帮助你在新的窗口打开超链接。下面看图：好了，其他的图添加超链接方法重复上面的方法就是了，不明白可以问我，本人的旺旺全天服务。我这里是8张图片，依次把8张图片的超链接添加后就完成这一步了。下面就是获取代码：这时您就可看到一连串的烦人的东西了，跟着我去做，不会错的哦：不过不用急，我教您，傻瓜式的照做就可以了。不过这里的话，要回到第二步，从淘宝空间里面获取刚才上传JPG图片的代码：复制好空间图片代码后就让我们再次回到Dreamweaver软件代码界面吧。把从图片空间获取的代码粘贴到代码窗口的底部空白处（为了方便得到图片的代码），然后复制双引号里面的代码，注意看下面图示的红色文字哦：这一步很重要，无法用文字说明，只能在截图上说明，注意看啦：最后一步：复制图示下面位置的代码，用于添加到自定义内容区的代码看到这里工作差不多了，成功是留给有耐心的人的：我们现在可以回到店铺装修的页面了，看图：保存，并发布装修内容就可以了，自己去首页试点击下，看能不能转跳，这个样的制作方法屡试不爽呢。如何制作淘宝模板？自己动手，想怎么设计就怎么设计，也不用花钱去买模板了。