免费店铺装修淘宝全屏店招模板在线制作教程(图文)

来源:刚哥哥网店装修联盟   发布时间:2018-08-22 21:14
在追求颜值的时代,网店养眼度也影响着的店铺经营。淘宝店铺的装修设计趋势是大气、活力、接地气,今天刚哥哥为大家讲讲免费店铺装修淘宝全屏店招模板代码的在线制作。

(该教程仅适用于专业版或智能版旺铺,基础版店铺添加全屏店招教程点击这里

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

操作步骤:

一、登录刚哥哥后台,添加店铺

1、打开刚哥哥会员中心页面,这里进入
 
2、选择QQ或者手机号码登录;

免费店铺装修淘宝全屏店招模板在线制作教程(图文)
 
3、添加店铺名称,添加店铺ID(什么是店铺ID,怎么查找店铺ID,点击这里

如果已经添加有店铺,设置店铺为默认即可。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

二、选择全屏店招模板,设置,生成代码

1、选择全屏店招模板(这里查找全屏店招模板)。

2、设置全屏店招模板

进入选择好的全屏店招模板,根据页面提示,进行设置。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)



不同的全屏店招效果不一样,设置的内容也会有所不同。

比如这个模板,需要设置“店铺名称”和“副标题”,其他模板可能有更多设置,但方法都类似。

我们按照提示填写,店铺名称是你在登录刚哥哥后台添加店铺的时候填写的,这里可以修改也可以保持不变。

3、设置完成,点击页面的“预览”按钮,查看设置效果。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

4、全屏店招模板的安装

如果设置没有问题,预览后,回到页面,点击“生成代码”按钮。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)


三、安装全屏店招模板

1、复制店招代码和设置店招高度

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

A、首页第一步,安装店招代码

点击“复制店招代码”按钮,会自动复制。如果没有复制成功,在上面的代码框里,鼠标右键,全选,再右键复制。

进入淘宝店铺装修后台,点击招牌模块右上角的“编辑”按钮。如果没有招牌模块,请在左侧模块里,拖动招牌到右侧导航位置。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

店铺招牌编辑里,招牌内容——招牌类型,首先选择“自定义招牌”。

再次,点击自定义内容里的“源码”按钮,如下图:

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

在所有操作按钮变成灰色后,代码框里粘贴店招代码,如下图:

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

B、设置店招高度

这里设置店招的高度,在“复制店招代码”按钮的位置,有提示数值,一般是120,部分模板会有不同,如果模板显示不正常,要看看这里的设置。

所有设置完成后,点击界面上的“保存”按钮。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

下面就是店招代码和高度设置后的效果:

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

三、导航样式代码的安装

1、复制导航样式代码

点击“复制导航样式代码(专业版或智能版)”,不能复制的话,在上面的代码框里,鼠标右键,全选,再右键复制。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

2、进入淘宝装修后台,鼠标放在导航位置,点击“编辑”按钮

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

点击“显示设置”,在代码框里,粘贴刚复制的导航样式代码。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)


粘贴代码后,点击左下角的“确定”按钮。如下图所示:

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

四、页头背景、页面背景图片设置

注意:只有淘宝专业版或者智能版店铺才能设置页头和页面背景,基础版店铺请学习基础版安装全屏店招模板教程。

A、下载图片

在刚哥哥全屏店招模板制作的复制代码位置第2项“下载背景图”

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

根据提示,先在图片上鼠标右键,另存为,保存图片到你的电脑(重命名为页头背景图,页面背景图)。

注意:部分全屏店招模板只提供了“页头背景图”,就说明模板只需要设置页头背景。

B、上传图片

进入淘宝装修后台,左侧点击“页头”模块,首先,取消勾选“页头背景色”的“显示”按钮

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

然后,“页头背景图”位置,点击“更换图片”按钮,正确的界面如下图:

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

找到刚保存到电脑的页头背景图片,这里上传。

上传完成后,根据模板提示,设置图片“背景显示”方式和“背景对齐”方式。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

需要对照模板要求进行相应设置,如下图:

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

页头背景图片设置完成后,必须点击最下面的“应用到所有页面”,只有这样,你的列表页面和宝贝详情页面顶部的店招才会是全屏的。

免费店铺装修淘宝全屏店招模板在线制作教程(图文)

同理,“页面”,页面背景图的设置和页头背景图一样的方法,这里就不做演示。

五、发布装修

店招代码、导航样式代码、页头背景图、页面背景图都设置好以后,点击装修页面右上角的“发布站点”按钮,这样全屏店招模板就安装成功了。

在此强调三点:

1、在粘贴店招代码的时候,必须点击源码按钮后,所有的操作按钮变灰色的时候,再粘贴店招代码。

2、上传页头背景图之前,必须先把“页头背景色”的“显示”按钮,取消勾选。

3、只有淘宝专业版或者智能版店铺才能设置页头和页面背景,基础版店铺请学习基础版安装全屏店招模板教程。

(该教程仅适用于专业版或智能版旺铺,基础版店铺添加全屏店招教程点击这里

以上就是刚哥哥与大家分享的免费店铺装修淘宝全屏店招模板在线制作教程(图文)。
 
分享到:
刚哥哥淘宝店铺装修网,提供免费淘宝店铺装修教程模板、网店装修图片素材代码,让你的淘宝店铺装修事半功倍。
本站部分内容来源于网络或网友上传,如有侵犯您的权益,请告诉我们,立即删除处理!
Copyright © 2011-2022 刚哥哥淘宝店铺装修网 All rights reserved.
蜀ICP备17022167号-3