新手开店-教你自己动手制作简单精美的店铺装修的方法.docVIP

美美地装修，不花一分钱，你信么？ 本人新手卖家，刚刚开店，经过几天的学习也算是掌握了DIY装修的基本方法，特此把自己的装修过程分享给大家，希望大家喜欢 。 ? 废话不多说上图，这个是我想要打造出来的效果，标准版变身拓展版。（避免广告嫌疑，已经模糊处理），大家可以参考其他金冠店家，选取自己需要的资源。 ? 首先打开 美图秀秀? ? ? 把刚才那个模板编辑下? 选取你需要的内容? 进行裁剪? 大小为750*45? 标准版 自定义页面最大750宽 ? ? ? ? 得到这个图片? 750*45像素 ? ? ? 接下来用到神兵利器 DW 下载地址/soft/458.html ? ? 创建一个新的HTML ? ? 选择布局按钮, ? ? ? 首先选择 布局按钮旁边那个布局表格按钮? 在空白处拖动鼠标绘制一个 750*420的表格? 大小可以直接在下方工具栏处输入数字调整? 。然后点击布局表格按钮旁边那个绘制布局单元格按钮? 在刚刚画好的表格内拖动鼠标绘制单元格? 首先在最顶端绘制一个750*45的单元格用于放顶端那个掌柜推荐? 其次在其下方绘制4个180*300的单元格用于放产品图片 每个与每个之间留有一点空隙? 最后在再4个单元格下方绘制4个180*75的小单元格 用于写产品描述? 绘制好后如下图 ? ? ? 然后用美图秀秀打开 你想要放入的图片? 对该图片进行编辑 把其大小调整为180*300 （避免广告嫌疑，图片随便找的） ? ? ? 点击右上角的尺寸 调整图片大小 ? ? ? ? ? ? 然后再DW中插入图片? ? ? ? ? 在下面这个选项框中选否? ? ? ? 此时会得到如下效果图 ? ? ? 点图片下方那个 180*70的单元格? 然后调整其背景色 ? ? ? ? 在该单元格中输入 产品名称和价格 ? ? ? ? 然后进入自己的图片空间 ? ? ? ? 将刚才插入的图片上传到图片空间，选择好你要放入的分类，以后方便查找，点击添加图片，选择上传的图片 ? ? ? ? ? ? 然后复制该图片在图片空间中的连接代码 ? ? ? ? ? ? ? 回到DW中点击? 点击图片，（点击过图片后，变黑的那段代码就是图片的信息，包括图片的地址和宽 高）然后点击代码 ? ? ? ? ? ? ? ? 进入到代码编辑器中? 替换图片的位置? 将img src=给这里加上刚在图片空间复制的那个代码 width=180 height=300 ? ? ? ? ? 复制好后如下图 ? ? ? 怎样利用淘宝助理批量上传图片到空间? 并替换代码 见这个帖子/catalog/thread/154503htm ? ? 咱们继续? 代码替换后 回到设计界面如下图??刚刚的图片已经被图片占位附所替代 ? ? 然后按照刚刚的步骤 将图片分别插入单元格 ，并替换图片在淘宝空间中的代码 ，并在单元格下方输入宝贝信息?，在顶端拆入 刚刚截图的那个“掌柜推荐 ”做好后如下图? 图片因为已经不再本地保存，所以显示为图片占位符。当把代码复制粘贴到淘宝页面后，就会如期显示图片，请放心。 ? ? ? ? ? ? 然后回到代码编辑器中 全选代码 然后复制? ? ? ? ? 进入店铺装修页面 添加新的自定义页面 ? ? ? ? ? ? ? ? ? 点击编辑 对自定义内容区进行编辑 ? ? ? ? ? ? 选择HTML代码编辑? ? ? ? ? 将刚才在DW中复制的代码粘贴进去? ? ? ? ? 然后点发布 就能看到了 别急还没完? 我们是要做山寨拓展版的? 现在只完成了一半 ? ? ? ? 我们再次在DW中新建一个HTML? 然后制作一个和刚才那个同样高的表格 180*430? ，只有同样高才能看起来像是一个整体，这里要注意同样高（整个页面总共宽是930，主页面占750是固定，所以左侧栏只能有180宽，高度和主页面同高。） ? ? ? ? ? 然后按照刚才的方法，再做1、顶端单元格180*45? 2、 1个图片展示单元格180*300? 3、产品描述单元格180*75 ? ? ? ? ? 按照刚才的方法 加入图片 和产品描述 如下图 ? ? ? ? 然后复制代码， 在左侧栏新建一个自定义模板? 同样按照刚才的方法 将代码粘贴过去? 此时 我们的掌柜推荐就做好了? 效果如下