市面上网店模板非常多,比较出名的当属templatemonster(怪兽模板),怪兽模板起源于美国,很快风靡世界。其网站上提供了很多CMS网站模板,包括joomla,WordPress,magento,drupal,mambo等,以及设计精美的ZenCart,magento,oscommerce网店系统的模板。
宝贝描述区代码制作:
1、找到我们上次保存HTML文件及image文件夹,如图所示:
2、用Dreamweaver8.0打开“促销区.html”文件。并切换到“拆分”模式。在此模式下,上半部分为代码区,下半部分为设计区。
3、单元格背景制作:由于宝贝展示区、宝贝描述区、买家必读区、付款方式区及联系我们都要添加内容,为了避免使用层,就必须把文字内容区的图片设为单元格背景,这样就可以保证不管添加多少内容,都可以让宝贝描述模版自动延伸。用鼠标在设计区点击宝贝展示区图片及文字出现区。如图所示:
然后,将鼠标点击代码区如上图所示红方框前的<td>单元格标记的td之后。
此时可以看到在屏幕下方出现单元格背景框。在背景框内填入images/宝贝描述_11.gif,并在左边设置宽为740,高为104,设置完毕之后,删除单元格中的图片,也即删除<img class='lazyload' src='/images/noimg.jpg' data-original= “images/宝贝描述_11.jpg” width = “740” height = “104” alt=””>这一段代码。最终如下图所示:
当然,如果亲们对Html语言熟悉的话,就可以直接手工改写代码了。利用同样的方法处理宝贝描述区、买家必读区、付款方式区及联系我们单元格图片。
4、保存修改后的网页内容。
5、上传图片。由于淘宝不支持本地图片,所以为了宝贝描述模版的图片能正常显示,我们要将images文件夹下的图片全部上传到自己申请的空间当中。
6、用上传的图片替换促销代码中本地图片。这里以上传到www.51.com空间为例来说明如何替换。
登录51空间,找到自己上传的图片。(以宝贝描述_01.jpg为例.)
在此图下方有一个复制按钮,点击复制,就会得到宝贝描述_01.jpg图片的网络地址。然后在Dreamweaver8.0中点击“编辑”菜单,并选择“查找和替换”。
出现如下对话框:
在查找框中输入“images/宝贝描述_01.jpg”,在替换框中粘贴刚才所复制的宝贝描述_01.jpg图片的网络地址。
点击“替换”按钮即可完成宝贝描述_01.jpg本地图片的网络替换。然后用同样的方法,把所有的本地图片全部用网络地址替换过来。全部替换完毕后注意保存。
7、当所有工作完毕后,在Dreamweaver8.0的代码区里,将<!-- ImageReady Slices-->和<!-- End ImageReady Slices -->之间的代码全部选定,并复制下来,然后用记事本新建一个文本文档,并将所复制代码粘贴到新建文本中,以txt格式保存备用。
到此为止我们的宝贝描述模版制作大功告成。
本文整理于互联网,如有侵权,请联系email:kf@53shop.com 进行删除处理。