淘宝旺铺自定义内容区装修模板代码使用教程

淘宝旺铺中，自定义内容区内容区可以显示店铺公告，人气宝贝，店长推荐，新品发布，联系方式等。如下图：

淘宝店铺自定义内容区要编辑源文件，装修涉及的代码，一般都是放在自定义模块里的。一般来讲，自定义模块根据位置分左侧模块、右侧促销自定义模块等。这些代码的使用方法都一样，不同的只是模板的位置不同、大小不同而已。这里我们以旺铺右侧自定义模块代码的插入为例子，给大家讲讲如何插入模板代码。

 在插入代码前，请先添加你需要的自定义模块。在添加好模块后，按以下步骤插入代码：

第一：

第二：

第三：

第四：

第五：

第六：

第七：点击插入图片按钮，插入空间图片。插入图片前要把图片上传到博客，或者提供免费相册的网站等。粘贴图片地址后，就可以显示你的宝贝图片了。

第八：

第九：点击发布，查看效果。

玉苗苗童装店 http://shop101986353.taobao.com/

http://ymmtzd.taobao.com

主营: 女装，女鞋 童装，母婴用品，捷易通代理全国话费自动充值软件。

.欢迎大家前来选购

 

第二篇：淘宝店铺装修模板：图片轮播的源代码

<DIV class="box J_TBox">

<DIV class="shop-custom no-border ">

<DIV class=bd>

<DIV class=custom-area>

<DIV class=xzmm>

<DIV class=J_TWidget data-widget-config="{'effect': 'scrollx','autoplay': 'auto','circular': true}" data-widget-type="Tabs">

<ul class=ks-switchable-nav>

<li><em>本店新款</em> </li><li><em>热门浏览</em> </li><li><em>推荐宝贝</em> </li><li><em>人气宝贝</em></li></ul><DIV style="WIDTH: 2992px; LEFT: -748px" class=ks-switchable-content>

<DIV style="DISPLAY: block; FLOAT: left" class=xzmm-single>

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=300>

<TBODY>

<TR>

<TD height=228>

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 228px; OVERFLOW: hidden"> <TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=228>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i1/T2SJBNXj8bXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i3/T2u0BNXllbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i1/T2bdFNXiNbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR>

<TR>

<TD style="LINE-HEIGHT: 10px; FONT-SIZE: 1px" height=10><br></TD></TR>

<TR>

<TD style="BACKGROUND: url(/imgextra/i4/T2Vo8EXcFMXXXXXXXX-436375523.jpg); HEIGHT: 62px">

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 62px; OVERFLOW: hidden">

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=62>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center>&nbsp;&nbsp;&nbsp; <font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改<br></font>惊喜价：50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center>&nbsp;&nbsp;&nbsp; 室<font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font> <br>惊喜价：50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center>&nbsp;&nbsp;&nbsp;<font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font> <br>惊喜价：50元</DIV></TD>

<TD

width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></DIV>

<DIV style="DISPLAY: block; FLOAT: left" class=xzmm-single>

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=300>

<TBODY>

<TR>

<TD height=228>

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 228px; OVERFLOW: hidden"> <TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=228>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i4/T2adBNXmhbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i3/T2A0xNXn8bXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i1/T2bdFNXiNbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR>

<TR>

<TD style="LINE-HEIGHT: 10px; FONT-SIZE: 1px" height=10><br></TD></TR>

<TR>

<TD style="BACKGROUND: url(/imgextra/i4/T2Vo8EXcFMXXXXXXXX-436375523.jpg); HEIGHT: 62px">

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 62px; OVERFLOW: hidden">

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=62>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font> <br>惊喜价：50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font> <br>惊喜价：50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font> <br>惊喜价：50元</DIV></TD>

<TD

width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></DIV>

<DIV style="DISPLAY: block; FLOAT: left" class=xzmm-single>

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=300>

<TBODY>

<TR>

<TD height=228>

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 228px; OVERFLOW: hidden"> <TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=228>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i4/T2adBNXmhbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i3/T2A0xNXn8bXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i1/T2bdFNXiNbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR>

<TR>

<TD style="LINE-HEIGHT: 10px; FONT-SIZE: 1px" height=10><br></TD></TR>

<TR>

<TD style="BACKGROUND: url(/imgextra/i4/T2Vo8EXcFMXXXXXXXX-436375523.jpg); HEIGHT: 62px">

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 62px; OVERFLOW: hidden">

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=62>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改<br></font>惊喜价：50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font>） <br>惊喜价：50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font>）<br>惊喜价：50元</DIV></TD>

<TD

width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></DIV>

<DIV style="DISPLAY: block; FLOAT: left" class=xzmm-single>

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=300>

<TBODY>

<TR>

<TD height=228>

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 228px; OVERFLOW: hidden">

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=228>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i4/T2adBNXmhbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i3/T2A0xNXn8bXXXXXXXX-730628354.jpg"></A></TD>

<TD width=30><br></TD>

<TD height=228 width=228><A target=_blank><img style="WIDTH: 220px; HEIGHT: 220px"alt=""

src="/imgextra/i1/T2bdFNXiNbXXXXXXXX-730628354.jpg"></A></TD>

<TD width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR>

<TR>

<TD style="LINE-HEIGHT: 10px; FONT-SIZE: 1px" height=10><br></TD></TR>

<TR>

<TD style="BACKGROUND: url(/imgextra/i4/T2Vo8EXcFMXXXXXXXX-436375523.jpg); HEIGHT: 62px">

<DIV style="WIDTH: 748px; FLOAT: left; HEIGHT: 62px; OVERFLOW: hidden">

<TABLE border=0 cellSpacing=0 cellPadding=0 width=748 height=62>

<TBODY>

<TR>

<TD width=14><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改</font> <br>惊喜价：50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改<br></font>惊喜价: 50元</DIV></TD>

<TD width=30><br></TD>

<TD style="LINE-HEIGHT: 16px; COLOR: #565555; FONT-SIZE: 12px" height=62 width=228>

<DIV align=center><font color=#2d2d2d>此处输入商品名称或商品简单描述内容，鼠标点击即可修改<br></font>惊喜价：50元</DIV></TD>

<TD

width=14><br></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></DIV></DIV>

<DIV style="CLEAR: both"></DIV></DIV></DIV></DIV></DIV></DIV></DIV> <DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

<DIV></DIV>

这是本人收集的，和朋友们一起分享