如何做好淘宝店铺悬浮旺旺、悬浮分类

大家在经常在别人的网店看到很拽的悬浮分类、悬浮客服之类的东东，一定很是羡慕，它不光好看，也非常实用，方便顾客联系你和选择所需宝贝分类。在这个竞争激烈的淘宝大家庭里，顾客就是我们的上帝，能给我们的上帝提供方便，那怕只有百分之一的希望，我们也应该做出百分之百的努力！言归正传，下面就教大家如何在自己店铺里DIY悬浮客服、悬浮分类的双悬浮模块！

一.首先来说悬浮客服DIY制作

悬浮客服，所谓悬浮客服也就我们经常在拓展版淘宝网店最边上看到的那组旺旺群客服，它不随着页面的滚动而滚动，始终悬浮在最右边，非常漂亮，也非常实用。尤其在内容比较多的宝贝详情页时，当页面滚动到最底端时，如果没有这组悬浮客服，那么客人试必要回到页面顶部才能看到旺旺客服，从而联系到掌柜，而有了这组悬浮客服，那就不一样了，它会随时出现在客人的眼前，方便客人随时随地和掌柜取得联系，从而达到一种零距离的沟通！

悬浮客服是通过两个代码来实现的，悬浮客服代码和相对应的CSS代码。这两个代码太长，没办法贴在帖子中，请见谅！

注意：这里需要提醒的是：淘宝于8月低升级了系统，很多旺铺模板不在支持开放“完全自定义区”，真是形势赶不上变化，那意思是说标准版从此就不能添加悬浮旺旺和悬浮分类了吗？当然是可以的，还有其他的方法把CSS代码插入自己的店铺。至于到底如何插入CSS代码？那是时分缘下一篇帖子讨论的话题，这里不再赘述。近期很多人和我要代码，我也是不胜其扰，一听说要花钱买代码，没有免费代码送，很多人就不以为然，以为我欺骗了他们，我以我的人格担保，系统没有升级以前，代码是可以用的，而且也是可以免费赠送给你的。由于如此，原来可以赠送给大家的免费代码可能现在已经不能使用，想装悬浮旺旺的，可以去装修市场购买最新版的代码！感谢您的谅解！

1.申请设计师：大家首先检查一下自己的店铺装修页面里有没有完全自定义这项（装修页面-模板-背景设置-完全自定义），如果有的话那就更省事，就可以跳过申请设计师这一步，直接进入到下一步骤。反之如果没有这一项，那么首先要做的是先去ZX.TAOBAO.COM页申请设计师，步骤如下图

打开ZX.TAOBAO.COM页面后，点击申请设计师按钮，申请，过程就不在赘述。申请成功之后，点击设计师后台按钮，如下图所示

下图是进入设计师后台的页面：申请设计师淘宝会开通设计师的权限。时间是7天，申请成功后，7天内要做好悬浮客服和悬浮分类发布，过了7天，就不能再做了

到这里我们已经有了设计师的权限了哦，准备工作就完成了，很简单吧！点击马上设计按钮，进入下一步操作

2.装修我们的店铺，打造DIY悬浮客服：首先进入我们的装修页面。（别告诉我不知道在哪里进！）。你在往哪里看呢？请看下图

点击模板按钮出现下面的页面啦！

到这里，最重要的部分来了哦。点击按钮，出现下面的页面，接着看图

点击完全自定义按钮，出现完全自定义的文本框啦。这里需要提醒的是有的店铺完全自定义文本框里可能没有原代码，空的！没关系，不用担心，不影响的咱的工作，嘿嘿，看图看图！

把相应的悬浮客服的CSS代码复制进去，要做悬浮分类的就放悬浮分类的CSS代码，要做悬浮客服的就放悬浮客服的CSS代码，不能乱放哟！粘贴在原代码的后面即可，不可覆盖原代码，否则会改变网店的原有背景（强烈建议把原来的代码自己拷出来备个份），然后保存。至此我们已经完成了一大半的工作哦。

3.装修首页页面，完成悬浮代码的添加：在首页和宝贝详情页分别添加自定义模块，一般建议在页面的左侧添加自定义模块，主要是为了方便查找编辑，看下图

编辑改自定义内容区。点击编辑HTML源码按钮

然后把悬浮客服代码拷入到自定义区的源代码中。如下图

最后保存！至此，悬浮客服的制作初见雏形！如下图

4.最后更改替换图中相应的链接地址：这也是最重要的一步， 否则客人点击客服中的旺旺，联系不上你，而联系我了，嘿嘿

如图所示，在可视编辑器里双击任意旺旺图标，会出现如下的对话框。

把对话框里的链接地址替换成你自己的旺旺链接地址就好了，不要告诉我你不会（在你网店的旺旺图标上右击鼠标，会出现一个“复制链接地址”，点击它，然后到上面链接地址对话框粘贴，就OK啦。图片链接地址替换同理）

同理，双击收藏本店图标也会出现如下对话框

把上面对话框里的链接地址替换成收藏你自己店铺的链接地址就好了，（在你网店收藏本店图标上右击鼠标，会出现一个“复制链接地址”，点击它然后到上面链接地址对话框粘贴，就OK啦。图片链接地址替换同理），至此，悬浮客服的DIY制作才算大功告成！

最终效果如下图所示

二、悬浮分类的DIY制作方法

悬浮分类的制作方法和悬浮客服的制作过程一样，首先在申请设计师成功的前提下，在背景设置里的完全自定义中加入左侧分类的CSS代码（注明：CSS代码是唯一的，一个CSS代码只对应相应的悬浮代码，不能通用），然后在编辑页面加入添加自定义模块，在自定义模块中加入左侧分类代码（参照悬浮客服的制作过程，有不懂的朋友可以旺我，这里不再赘述!）最终效果如下图所示