前几天在知乎的一篇回答，获得了很多人的认可，其实我已经很长时间没做淘宝了，但是能通过文字把自己的一些经验分享给大家，能帮到大家，我很开心。
很多人问我装修的事情。
其实，装修对于新店来说，不是最重要的，但也是不能少的。
今天就给大家带来一份装修教程，个人觉得很详细了，就算你是新手，不会PS，不会敲代码，也能装修出高大上的店铺。
一、PC端
01、店铺招牌
这个是最重要的，因为用户不管在哪个页面预览你的店铺，招牌他们都是能直接看到的。比如宝贝详情页面：
我红框的位置就是小米的店铺招牌，我们在预览这款产品的时候，招牌也会第一时间出现在我们面前，所以店铺招牌是决不能忽略的一个装修部分。
接下来我们就一起来装修一个店铺招牌把~
对于新手来说，有两种方式，第一种肯定就是网上找一些现成的代码放上去，第二种就是自己来设计。
我教你的也是第二种：
1、设计
这里我用到的工具是PS，不会PS的也没关系，我在设计的过程中都会跟你说到我用到的哪些工具。
在设计之前，首先我们要知道，招牌的大小，和淘宝的一些规则。
在淘宝，一个钻以下的店铺可以免费使用专业版，简单的说就是你可以把招牌设置成1920宽度的，如果你到了一个钻或者以上则需要每个月付费50元才能使用。
但是这些我们也是可以通过设计来做到的，所以无需花这50元。
其次就是招牌的高度，高度一般是150，除去菜单栏的就是120，但是我们自己设计一般都是把菜单栏也设计上。比如上面小米的。
因为我没有现成的一钻以下的店铺，我这里就以一钻以上的店铺来给大家演示。
第一步：
这一步如果你不想花那50块钱，背景最好设置纯白色的。其次就是，如果你花了那50块钱，或者你的店铺是一个钻以下的，你就按我下面的方法来操作。
打开PS，新建一个1920X150的画布。（如果你是不打算花那50的话，就创建950*150即可，会方便很多）
我这里就模仿小米这个招牌来为大家演示好了，先简单说下，小米的菜单栏是用的代码，如果你也想做小米那样的你就把上面创建的画布改成 1920X120或者950X120，如果你店铺产品不多，你就跟着我做固定的就可以了，没必要做他们那么复杂。
因为我们的画布是1920宽的，所以我们先要给它标注以下950的位置，方便我们后期好导出。
我这里教大家一个最简单的办法：
重新创建一个950*150的画布把背景设置成黑色，然后叠加到1920X150这个画布上居中对齐。
中间的黑色部分就是我们要添加内容的部分。（在次说明一下，如果你是不打算花那50块钱，或者你店铺是一个钻以下的你就可以直接创建950X150的画布，不需要我这一步操作了。在或者你做的是纯白背景的也直接950X150即可，至于为什么等会我说）
我们先添加好内容在黑色区域，然后把黑色的那个图层给删掉即可。
为了方便，我这里就直接截图操作了~
添加好内容后大概就是这样：
这里要跟大家说明一下，注意看上图后面的一个空调没有在黑色区域。也就是说它不是在招牌位置而是在背景位置。我们直接把它去掉就可以了。
然后我们把黑色图层先隐藏：
大概就是这个样子了。
具体的操作步骤我这里就省略了，因为你只需懂得一点PS基础你就会，用到的工具也就那么两个而已。
设计完成后就导出。
我们先直接保存一份1920X150的。（注意，在次说明，如果你是做其他背景颜色的必须要先保存一份1920X150的作为背景，如果是跟小米一样的白背景可以忽略）
保存好后开始裁剪。裁剪的时候把那个黑色图层打开，然后用裁剪工具两边一拉即可。
裁剪完成后我们看下图片大小，刚好是950*150
然后我们把黑色图层黑删掉。
这样我们的背景和内容区域就设计好了。接着做下一步~
第二步：
这一步我们需要进行切片，也就是说，我们需要把要点击的部分切出来，比如收藏店铺，这里我们需要做一个按钮，或者菜单栏我们需要单独做按钮，就要把他们区分开来。
工具使用：鼠标右键单击裁剪工具然后选择切片工具
这个时候你的鼠标会变成一把刀，然后我们把要点击的部分用这把刀切就好了。
切完之后可以看到，我们把它切成了18张小图片：
然后我们就直接导出，但是现在的导出方式是不一样的。
我们直接用快捷键：SHIFT+CTRL+ALT+S
导出的格式选择：HTML和图像
然后我们就得到了一个images的文件夹，和一个HTML的代码文件
我们先打开这个文件夹把这些小图片上传到淘宝的图片空间。
上传好之后，我们在打开那个HTML文件，右键打开方式选择记事本打开。
然后我们就看到了一堆看不懂的代码，
但是没关系，这个代码我简单说一下你就懂了。
上面的部分，我们不用管，我们直接从这个<tr>开头的位置开始修改代码。
比如第一个：
我红框位置的代码就是第一张图片，我绿框位置就是这张图片的地址，它现在的地址是你文件夹的地址，我们直接把这个位置修改成我们刚刚上传到淘宝图片空间的地址即可。
去图片空间，找到01的这张图片，然后选择复制链接。
然后把它换到我刚刚绿框的位置：
这里要注意，一定要细心，不然新手很容易出错的哦。
简单的说就是 <img src="图片地址"
然后依次更改他们的地址，地址上都有编号，01/02/03，注意不要改错了。
改完之后我们就可以去上传了。
第三步：
点击装修店铺，然后页头点击编辑。招牌类型选择自定义招牌。
直接选择源码模式，把刚刚的代码粘贴进来即可。
注意，我们刚刚设计的店招是150高度的，也就是包含了菜单栏的，所以在编辑的时候原本120高度的我们也要改成150的。
然后点击保存：
因为我是演示，所以我只弄了一张图片。
这个时候你点击收藏其实是没有用的，我们还需要对它进行最后一次编辑。
在次点击编辑的时候可以看到，这里出现了很多方块，其实就是其他图片我没传上来而已。
然后我们选择第一张图片，点击编辑。
因为这里链接的地址是收藏店铺，所以我们去复制收藏店铺的地址。
在店铺位置右键单击收藏店铺按钮，就能复制了。
复制好后，把它粘贴到这里：
在新窗口打开那个√你可以勾上也可以取消，看你喜欢。
然后点击保存，我们再次点击这个位置的时候就会跳转到收藏店铺了。
其他的都是一样的操作，由于图片太多，我就不一一演示了。（不懂的可以评论区问我）
还要注意一点的就是背景颜色。我们还需要设置以下。
默认的是这样的：
我们点击左边的页头，然后把页头背景色去掉即可。
最后就大功告成：
02、店铺banner
banner是需要有一定的设计功底的，但是没关系，因为上次我给大家推荐了“稿定设计”，就算你是零基础也能做出高大上的图片。
打开稿定设计官网，点击电商素材，我们可以直接找一个店铺首页的一整套模板来修改。
这样的好处就是统一，包括店招也可以直接用套装的。
我简单说下步骤，首先选择你喜欢的模板，然后编辑，编辑完成后导出。
比如这个，我编辑好了之后，导出也是这个样子的。
然后我们需要用到PS来切片，方法和上面店招是一样的。但是这个就比较复杂那么一点点。
因为我们需要先切出来店招部分/banner部分/产品部分等设计。然后再去单独切店招的热点（即点击区域）部分。
我们一般做首页设计就是这样做的。先把整体设计好，然后来切图。
假装我现在设计好了一张海报，然后我们需要去把这张海报转换成代码。
直接在稿定设计就可以哦。
点击装修工具，选择全屏轮播
然后在底下找一个你自己喜欢的。
还是老样子，先去把你的海报上传到图片空间，然后把地址复制过来。
然后设置以下参数：
你可以先点击预览一下，没毛病就点击底部的生成代码并复制代码。
回到淘宝装修，把原来的模块全部删除：
然后添加一个950的自定义模块
点击编辑，显示标题选择不显示，然后选择源码模式，把代码粘贴过来：
点击保存，然后预览：
全屏海报就有了。
03、分类/产品区域
产品区域我就不演示了，都是一样的方法，还是一样的通过稿定设计就可以来实现。
比如：
包括客服/优惠券/公告等都可以直接在这里生成代码通过上面的方法去装修。
因为我懒的原因，所以演示没有做全，我知道可能还是会有些新手不懂，但是方法和步骤都是一样的，今天先写PC端的，想看手机端的底下点赞哟。
之前那篇关于运营的回答在这：一个人做淘宝店需要多少技能？
最后，不知道我的教程写的怎么样，总之能帮到大家就可以了。
觉得不错，点个赞同；
写到心里，点波关注；
发挥失常，评论来怼。
有不懂的问题评论区问我即可，看到我都会回复。
不收费，只需要你一个赞😄
网友评论