首页 > 店长工具帮助中心 > 帮助文档 > 店铺装修

新首页装修教程,不用复制代码就能完成整个店铺的装修!!!

Hello,大泽_店长工具的粉丝们,我们又再一次见面啦!今天给大家带来一个好消息---首页装修功能“重装上阵”啦!前期因为1688对自定义装修的内容做了限制,导致有些内容展示不出,在我们程序员哥哥日夜兼程的努力下终于将首页装修改版上线,新上线的首页装修在操作上更加的便捷,无需复制代码就能进行全店装修,其核心的操作技巧就是通过【图片下载+全屏大图+加热点】不信您往下看!


一、选择模板

1.登录大泽_店长工具,点击开店必备功能的【首页装修】或者店铺装修中的【首页装修】,进入首页装修的模板选择页面,操作如下图所示:

教程288.png 


2.进入模板选择页面后,您可以根据您的行业或者模板的使用次数及收藏人数来选择模板,确定模板后点击【直接使用】进入编辑页面,操作如下图所示:


这就是首页装修的编辑页面

教程377.png


由于新版的首页装修模板目前只支持关联营销、优惠券、分类导航、在线客服以及店铺公告的图片下,所以在后续的功能操作讲解中我们只需对这几个模板进行操作讲解即可。

教程457.png


二、模板制作

1. 店招的制作

教程470.png

由于新版的首页装修模板下载不包含店招图片,如若您需要制作店招,建议使用【店招制作】功能进行,【店招制作】的教程讲解:http://newhelp.fjdaze.com/help_dz/show-17.html

 

2. 轮播海报的制作

教程586.png 

由于新版的首页装修模板下载不包含海报图片,如若您需要制作轮播海报,建议使用【海报/轮播图】功能进行,【海报/轮播图】的教程讲解:http://help.fjdaze.com/tool/159.html

 

3. 优惠券设置

在首页装修模板中找到【优惠券】,点击右上方的设置,即进入优惠券的设置页面,操作如下图所示:

教程742.png 


3.1在【优惠券】设置中,对优惠券的基础信息进行设置,操作如下图所示:

教程2780.png 


3.2基础信息设置完成后再对优惠券的面值大小进行设置,最后再添加优惠券的获取链接,操作如下图所示:教程2832.png


3.3选择相应的优惠券,点击【确定】就完成了优惠券的设置,如若提示无优惠券,则需点击【创建优惠券】进入卖家工作台进行设置,操作如下图所示:

教程2904.png 


3.4优惠券的基础信息及链接都设置完成后,就点击【确定】,这样就完成了优惠券的设置,操作如下图所示:

教程2957.png 


3.5点击【确定】后,您就能看到设置完成的优惠券样式了,如下图所示:

教程2994.png 


4. 分类导航设置

在首页装修模板中找到【分类导航】,点击右上方的设置,即进入分类导航的设置页面,操作如下图所示:

教程21051.png 


4.1基础设置中可以对标题、封面图以及跳转链接进行设置,其中如果模块标题不设置那就不展示,操作如下图所示:

教程21107.png 


4.2基础信息设置完成后确认无误,点击【确定】即可

教程21135.png 


4.3基础信息设置完成后,可对字体、按钮背景以及按钮颜色进行设置,颜色设置完成后点击【确定】,就完成了整个分类导航的设置。

教程21199.png 


4.4确认后的分类导航样式展示如下:

教程21220.png 


5. 关联营销设置

在首页装修模板中找到【关联营销】,点击右上方的设置,即进入关联营销的设置页面,操作如下图所示:

教程21277.png

 

5.1在关联营销的基础设置中可对头部标题、小标题、版块标题、推荐产品、按钮文字等信息进行设置,操作如下图所示:

教程21335.png 


5.2关联营销的基础信息设置确认无误后点击【确定】就完成了此版块的设置,操作如下图所示:

教程21382.png 


5.3确认后您在页面上看到的关联营销样式如下:

教程21408.png 



6. 店铺公告设置

在首页装修模板中找到【店铺公告】,点击右上方的设置,即进入店铺公告的设置页面,操作如下图所示:

教程21465.png 


6.1在店铺公告设置中,依次对基础信息、第一项内容、第二项内容、第三项内容、售前客服和售后客服的信息进行设置,全部设置完后点击确定即完成了店铺公告的设置,操作如下图所示:

教程21553.png 


6.2确认后您在页面上看到的店铺公告样式如下:

教程21579.png 



7. 关联营销设置

这个模板中设置了两个关联营销,所以需再对这一组的关联营销进行设置,操作和之前的一样。在首页装修模板中找到【关联营销】,点击右上方的设置,即进入关联营销的设置页面,操作如下图所示:

教程21679.png 


7.1在关联营销的基础设置中可对头部标题、小标题、版块标题、推荐产品、按钮文字等信息进行设置,操作如下图所示:

教程21737.png 


7.2关联营销的基础信息设置确认无误后点击【确定】就完成了此版块的设置,操作如下图所示:

教程21784.png 


7.3确认后您在页面上看到的关联营销样式如下:

教程21810.png 


8. 以上就是对模板中的关联营销、优惠券、分类导航、在线客服以及店铺公告进行装修和设置,所有的操作方式都可以借鉴以上操作流程,以上模块都设置完成后,点击【下载模板】,操作如下图所示:

教程21901.png 


如若您只需要其中一个模块,也可对其中一个模块进行下载,操作如下图示:

教程21938.png 


点击下载模板后会出现一个提示小弹窗,点击【下载】即可。

教程21968.png 


下载后所有的模板图片都保存在一个压缩包中,需对压缩包进行解压,解压后您会看到以下内容:图片+文本,其中每张图片都配有一个文本,这个文本记录了您在设置这张图片时所添加的链接,后续在安装中会用上。

教程22067.png


三、安装模板

介绍了各个模板的制作,现在来探讨一下安装步骤吧。

1.打开 【卖家工作台】-【旺铺】-【装修旺铺(PC版)】,操作如下如所示:

教程22138.png 


2.分类导航栏的安装

2.1进入后您会看到这样的页面,找到【添加版块】并点击,操作如下图所示:

教程22188.png 


2.2选择【全屏大图】,点击添加,操作如下图所示:

教程22216.png 


2.3添加完全屏大图后会出现一个图片设置的小方框,点击【选择图片】将之前保存的图片依次上传,操作如下图所示:

教程22273.png 


2.4我们需要先上传第一张图片,也就是分类导航栏的图片,双击图片就完成上传,操作如下图所示:

教程22322.png 


2.5图片上传完成后,点击【设置链接】,操作如下图所示:

教程22353.png 


2.6此时需要打开我们的模板解压包,找到第1张图片旁边的标1的文本,操作如下图所示:


2.7点击【设置链接】后进入链接编辑页,页面中有三个链接则需要添加3个热区,需将蓝色小方框覆盖到相应的按钮上,这样用户点击该区域就会发生跳转,然后在文本框中找到对应的链接,将链接复制到链接框中即可,操作如下图所示:

 

2.8链接设置完成后点击“完成”

教程22531.png 


2.9图片和链接都确认上传无误后点击“确定”即完成了导航栏的安装,操作如下图所示:教程22575.png 


2.10导航栏安装后的样式如下所示:

教程22596.png 


3. 优惠券的安装

再次点击“添加模块”,找到【全屏大图】后点击【添加】,操作如下图所示:


3.1添加完全屏大图后会出现一个图片设置的小方框,点击【选择图片】将之前保存的优惠券图片上传,操作如下图所示:

 教程22701.png


3.2优惠券图片上传完成后,点击【设置链接】,操作如下图所示:

教程22735.png 


3.3点击【设置链接】后进入链接编辑页,页面中有4张优惠券即需要添加4个热区,需将每个蓝色小方框覆盖到相应的按钮上,这样用户点击该区域就会发生跳转,然后在文本框中找到对应的链接复制到链接框中即可,操作如下图所示:


3.4链接设置完成后点击“完成”

教程22867.png 


3.5图片和链接都确认上传无误后点击“确定”即完成了优惠券的安装,操作如下图所示:

教程22911.png 


3.6优惠券安装后的样式如下所示:

教程22931.png 


4. 分类导航的安装

在安装的第一步已经对分类导航的安装进行了讲解,此部分的安装可参考以上的安装教程。

4.1点击“添加模块”,找到【全屏大图】后点击【添加】,操作如下图所示:

 


4.2对图片进行上传后,再设置链接,操作如下图所示:

教程23050.png 


4.3点击【设置链接】后进入链接编辑页,页面中有6张模块即需要添加6个热区,需将每个蓝色小方框覆盖到相应的模块上,这样用户点击该区域就会发生跳转,然后在文本框中找到对应的链接,将链接复制到链接框中即可,操作如下图所示:

 


4.4链接设置完成后点击“完成”

教程23185.png 


补充:如若您觉得在对应的文本框中找链接进行复制比较麻烦,您也可点击“链接”按钮进行添加,操作如下如所示:

教程23240.png 


选择相应的产品点击【+】号,再点击【确定】,这样也是可以添加产品链接的哦!操作如下图所示:

教程23288.png 


4.5图片和链接都确认上传无误后点击“确定”即完成了分类导航的安装,操作如下图所示:

教程23333.png 


4.6分类导航安装后的样式如下所示:

教程23354.png 


5. 关联营销的安装

5.1点击“添加模块”,找到【全屏大图】后点击【添加】,操作如下图所示:

教程23401.png 


5.2对图片进行上传后,再设置链接,操作如下图所示:

教程23430.png 


5.3点击【设置链接】后进入链接编辑页,页面中有9个产品即需要添加9个热区,需将每个蓝色小方框覆盖到相应的产品上,这样用户点击该区域就会发生跳转,操作如下图所示:

 

5.4热区添加完后,点击【链接】按钮添加跳转链接,操作如下图所示:

教程23552.png 


5.5选择相应的产品点击【+】号,再点击【确定】,这样就可以添加产品链接的哦!操作如下图所示:

教程23602.png 


5.6链接添加无误后点击【完成】

教程23621.png 


5.7图片和链接都确认上传无误后点击“确定”即完成了关联营销的安装,操作如下图所示:

教程23666.png 


5.8关联营销安装后的样式如下所示:

教程23687.png 


6. 店铺公告的安装

6.1点击“添加模块”,找到【全屏大图】后点击【添加】,操作如下图所示:

教程23734.png 


6.2对图片进行上传后,再设置链接,操作如下图所示:

教程23763.png 


6.3图片和链接都确认上传无误后点击“确定”即完成了店铺公告的安装,操作如下图所示:

教程23808.png 


6.4店铺公告安装后的样式如下所示:

教程23829.png 


7. 关联营销安装

由于这个模板中设置了两个关联营销,所以需再对这一组的关联营销进行安装,操作和之前的一样。

7.1点击“添加模块”,找到【全屏大图】后点击【添加】,操作如下图所示:

教程23920.png 


7.2对图片进行上传后,再设置链接,操作如下图所示:

教程23949.png 


7.3点击【设置链接】后进入链接编辑页,页面中有6个产品即需要添加6个热区,需将每个蓝色小方框覆盖到相应的产品上,这样用户点击该区域就会发生跳转,操作如下图所示:

 

7.4热区添加完后,点击【链接】按钮添加跳转链接,操作如下图所示:

教程24071.png 


7.5选择相应的产品点击【+】号,再点击【确定】,这样就可以添加产品链接的哦!操作如下图所示:

教程24121.png 


7.6链接添加无误后点击【完成】

教程24140.png 


7.7图片和链接都确认上传无误后点击“确定”即完成了关联营销的安装,操作如下图所示:

教程24185.png 


7.8关联营销安装后的样式如下所示:

教程24206.png


以上就是对模板中的关联营销、优惠券、分类导航、在线客服以及店铺公告进行安装,所有的操作方式都可以借鉴以上操作流程【图片下载+全屏大图+加热点】,安装完后点击“预览”,操作如下图所示:

教程24299.png 

预览没发现问题就可以点击【立即发布】,这样整个首页装修就完成了,是不是操作很方便?教程24343.png看完上面的操作是不是瞬间觉得店铺装修原来也可以如此简单,总结来说就是4步骤【模板编辑设置--模板下载--添加全屏大图--设置热点】,全程免去复制代码的烦恼,赶快去试一试吧~不论什么模块装修都可以采用这种方式哦

 

 


以上内容仍未解决您的问题? 联系旺旺客服