淘宝自定义模块代码制作

淘宝旺铺才有自定义模块，如果你是普通店铺请漂过，我的例子是展示9个产品，我就选了9格。

好了，载入图片，效果如下。

然后把图片保存，我们先把这个图片叫做A图片，一会有用的。

现在就可以关闭光影了。

打开DW,在向导页面点击新建HTML文件，开始我们的设计之旅。

可能已进入界面我们都有点蒙，不要慌，特别简单，主要是我这帖子有图片，哈哈。

有的软件进入界面是在代码区，有的是在设计区。

如果是在代码区，然后就点击“设计”这个按钮。

进入设计页面。

好了，设计页面干干净净的，这样我们看着就不会慌手慌脚了。

好了，料来咯。

我们点击菜单栏插入选项，选择图像，这样我们就能导入我们的图片了，把刚才我们做好的9宫格式的广告图片导入。

看到设计窗口下面的属性栏了吗？就是这个。

找到里面有个“矩形热点工具”，点他，然后把光标移动到图片上，我们会发现光标变成了一个小十字。

对了，这个跟QQ截图很像，我们用它圈住图片的一格。

然后我们会看见属性栏变成了这个热点的属性，我们找到链接这栏，把我们对应这款宝贝的地址填进去。

这样我们就完成了一个热点，很像我们的超链接。

然后把9个格子的每个图片都输好它的地址。

这个时候我们要把设计按钮改成代码按钮了。

现在我们看到的一堆代码就是我们设计的这个简单的网页了。

然后呢，我们先把我们那个A图片，上传到图片空间里，提取图片的地址。

马上回来，到代码页面。

然后我们找到我圈起来的这行，这是图片的地址，我们设计的时候，电脑提取的是我们电脑文件夹里的地址，我们要放到店里就要用网络的地址，把刚才提取的地址替换我圈住的地址。

做完这步，我们就离成功很近很近咯。

现在我们把所有的代码都圈上，复制。

OK，可以关闭DW了。

打开我们的店铺，随便点开一个宝贝。

点击装修页面。

然后在上面的模块管理中点添加模块，添加一个“自定义内容区”（这里需要说明下，我开了旺铺，不知道是不是旺铺才有这个版块，其实开旺铺是很必须的），保存。

然后我们在下面找到自定义内容区板块，编辑。

在编辑窗口点击“编辑HTML源码”这个选项。

把刚才我们复制的所有代码粘贴进去。

接着点保存。

然后在页面的最右上角找到发布，点下去，确定。

完成。

你现在打开我们的宝贝详情页面是不是多了一个漂亮的广告了。

我们还可以用同样的原理把我们的左侧栏利用上。

只不过左边的图片最好选用单张的长方形图片，我测了一下，图片宽度在190最合适，高度可以随便。

只有一点需要注意，那就是如果你打算主页的侧栏和宝贝详情侧栏不一样的话，发布装修方案的时候不要点击这个，不然侧栏会都变成主页的侧栏。

这个问题还有疑问的话，可以加幕.思.城火星老师免费咨询，微V.信X号是为: msc496。