淘宝店铺装修完全自学教程-视频课程-学汇网

课程适用范围： 具有Photoshop和Dreamweaver基础的学员或对店铺装修感兴趣的学员。
课程简介： 本套教程可以使一个零基础的菜鸟变成装修达人。随着电商的发展，美工的需求量越来越大，零基础的同学很难入门，看了很多教程不见起色，这是因为学习的知识过于零碎，没有形成统一的课程体系。我们的课程全面讲解从开店到使用淘宝默认模板进行简单装修，以及利用在线生成工具、专业的代码编写软件Dreamweaver实现个性化的、复杂的页面装修效果。教程没有涉及太多视觉设计方面的知识，主要是装修技巧的讲解。相关视觉设计知识，大家也可以在勤学网学习其他专业视觉类课程。

课程基于淘宝店铺进行讲解，主要适用于淘宝店铺装修的同学学习哦~

涉及软件及版本： Photoshop CS6 和Dreamweaver CC 2015 大家可以下载对应版本或者更高版本进行学习。

淘宝天猫店铺装修完全自学教程.jpg 免费开店.jpg 装修工具介绍.jpg 简易页面装修.jpg 尺寸介绍1.jpg 店铺页面设计1.jpg 官方模板展示.jpg 在线生成工具制作家居类店铺页面.jpg 案例效果.jpg 家居类店铺页面1.jpg 家居类店铺页面2.jpg 家居类店铺页面3.jpg 动图效果展示标头.jgp

注：GIF格式图像色彩空间有限，图片失真比较多，主要展示动态过程，实际应用图片会很清晰自然。

轮播海报效果

▽

轮播效果.gif

开关灯效果

▽

开关灯效果.gif

十二卡盘效果

▽

12卡盘效果.gif

自定义布局

▽

自定义布局.jpg

第四章店铺高级装修需要的HTML代码.jpg 第五章店铺高级装修需要学习的CSS样式第六章使用代码装修自定义店铺动态店招图

海报.jpg 自定义店铺2.jpg 自定义店铺3.jpg 自定义店铺4.jpg 动图效果.jpg

旋转木马应用案例

▽

旋转木马案例.gif

带左右按钮的自定义轮播效果图

▽

带箭头的轮播效果.gif

应用弹出层做带有下拉菜单的店招

▽

应用弹出层制作下拉菜单店招.gif

倒计时的应用

▽

倒计时效果.gif

突破950px带有鼠标特效的分类展示区域

▽

鼠标经过指针效果.jpg

第八章.jpg

自定义模块插入视频效果

▽

添加视频.gif

生成动态旺旺效果

▽

动态旺旺.gif

课程目录

第一章认识淘宝后台管理界面
1.1 课程总体规划免费 5分16秒

介绍课程总体内容及学习课程需要做的准备
1.2.淘宝后台常用操作 14分33秒

介绍装修店铺的常用后台操作，包括淘宝默认模板，页面添加，配色处理，模块添加等等。
1.3.店铺装修常用工具介绍 5分4秒

店铺装修需要的软件工具，在线生成工具，以及淘宝开放平台的使用
第二章简易的页面装修
2.1.淘宝首页标准尺寸及淘宝店招装修 35分24秒

淘宝首页标准尺寸介绍及如何利用淘宝默认工具进行简单的店招装修
2.2.首页主体内容装修 23分44秒

使用淘宝默认的模块装修轮播图效果，宝贝分类，宝贝推荐，排行榜等
2.3.分类页装修 14分5秒

使用淘宝默认模块对分类页面进行装修，包括店招的设置，添加和删除模块等。
2.4.详情页装修和发布宝贝 27分53秒

详情页的装修范围及如何设置宝贝信息及详情描述等
2.5.自定义专题页装修和导航条设置 12分18秒

如何添加自定义的专题页面，以及导航条项目设置和添加的方法
2.6.其他两个官方模板的使用 7分31秒

其他两套默认模板的介绍及装修备份还原
第三章使用生成工具装修家居类店铺实战案例
3.1.店铺装修前分析及全局设置 9分5秒

设计稿的展示以及店铺配色等的整体设置及全局分析
3.2.页头店招基础设置 9分58秒

实例讲解通屏店招背景设置及店招主图的装修过程
3.3.使用Photoshop为店招添加链接免费 17分15秒

使用Photoshop对店招设计稿进行切片并添加链接，装修店招的过程演示。
3.4.使用生成工具做自定义导航条 16分49秒

使用在线生成工具制作自定义导航条效果
3.5.全屏轮播海报的制作 20分56秒

使用在线生成工具突破淘宝默认最小宽度限制，制作全屏轮播海报效果。
3.6.热卖爆款开关灯特效制作 16分41秒

使用在线生成工具制作爆款开关灯效果，以及去除模块间隙的方法。
3.7.通栏图片及12图卡盘的做法 17分11秒

使用在线生成工具制作通栏图片及12图卡盘效果
3.8为店铺添加旺旺区域 24分53秒

主要讲解如何在店铺中添加客服阿里旺旺联系入口，方便买家咨询。
第四章店铺高级装修需要学习的HTML代码
4.1.代码编辑神器Dreamweaver和HTML的联系 14分3秒

认识熟悉代码编辑器Dreamweaver的界面及与HTML的关系详解
4.2.操作文字的常用HTML代码 24分40秒

讲解常用的文字相关HTML标签及用法包括标题标签、加粗、倾斜、段落标签、横线标签、区块标签等
4.3.标签的属性和标签的嵌套 20分8秒

详细介绍标签属性的编写方法及嵌套的原则
4.4.HTML中的超级链接 18分10秒

介绍超链接标签、属性及代码书写规范
4.5.图片标签和图像地图 17分56秒

讲解Dreamweaver插入图片的方法及对应标签，以及如何绘制热点地图
4.6.表格标签的应用 24分55秒

介绍表格的相关标签及用法，以及如何利用表格来制作淘宝店铺装修中的开关灯效果
4.7.表单标签及搜索框的应用 17分5秒

介绍表单标签及利用百度搜索的代码方便快捷制作店铺搜索框
第五章店铺高级装修需要学习的CSS样式
5.1.认识CSS样式和CSS对字体的修改 31分34秒

css样式编写规范及常用文本的CSS样式设置方法。
5.2.元素的尺寸及背景 20分40秒

讲解如何定义网页中元素的尺寸及背景颜色、背景图像和定位等。
5.3.盒子模型的内间距和外边距 20分53秒

讲解css样式盒子模型中内部填充值和外边距属性及实际应用时值的设置技巧。
5.4.盒子模型的边框和类选择器以及火狐浏览器的用法 16分57秒

主要讲解盒子模型的边框编写规范和技巧，类选择器以及火狐浏览器firebug的使用。
5.5.三种不同类型的区块及转换 25分1秒

主要讲解块元素、行元素、行内块元素的特征及相互转换的方法。
5.6.浮动布局和后代选择器 27分43秒

浮动布局的设置方法及原理，后代选择器的编写方式，以及溢出隐藏设置。
5.7.使用浮动做导航条和伪类选择器 27分57秒

使用伪类选择器、项目列表、超链接标签、浮动布局等知识制作淘宝店铺导航栏效果。
5.8.三种定位布局方式 20分17秒

元素相对定位、绝对定位、固定定位的属性设置及实际应用。
5.9 CSS3新增属性 31分46秒

讲解CSS3新增的圆角、阴影及不透明度等参数设置。
5.10.淘宝店铺装修需要的行内样式 11分48秒

如何将Dreamweaver中的CSS样式修改为行内样式，以符合店铺装修代码要求。
第六章使用代码装修自定义店铺
6.1.全屏店招的装修方法 22分2秒

使用Dreamweaver实现全屏店招效果及添加热点地图。
6.2.使用CSS样式控制导航条 27分36秒

使用CSS样式修改设置导航条的样式，制作店招和导航条统一背景图像效果。
6.3.完全自定义的店招和动态图片的制作 19分9秒

完全自定义店招和导航条样式，制作店招上动态图片效果及装修方法。
6.4.使用定位布局为店招添加搜索框 26分19秒

通过使用淘宝自带类样式设置自定义搜索框的定位。
6.5.制作通栏海报 25分57秒

使用系统提供类名打破系统默认宽度制作全屏海报。
6.6.突破950px的专题活动展示做法 34分43秒

讲解活动专题页面切图、制作热点地图以及突破淘宝默认950px宽度的装修方法。
6.7.固定背景做法和优化布局结构 30分52秒

将大面积的背景图片定义为固定背景以及滚动背景的方法，优化店铺装修的结构。
6.8.系统显示与隐藏的类footer-more 29分55秒

使用淘宝自带类样式.footer-more制作鼠标经过时图片显示与隐藏效果等。
6.9.突破950px带有鼠标特效的分类展示区域 32分25秒

结合前面所学知识，讲解了一个综合案例，主要涉及知识点包括浮动布局，定位布局，突破淘宝默认950px宽度，鼠标经过指针变化，图像变化，以及添加跳转链接等。
第七章使淘宝开放平台widget规范和SNS组件
7.1.J_TWidget之Carousel旋转木马 32分1秒

淘宝J_TWidget组件之Carousel旋转木马的使用方法介绍。
7.2.旋转木马应用案例详解 39分39秒

通过实例讲解鼠标放置到按钮上实现切换，并且主图实现淡入淡出切换的装修效果。
7.3.带有左右按钮的自定义轮播图 24分30秒

使用旋转木马制作带箭头的轮播图效果，以及定义箭头位置的实际案例。
7.4.J_TWidget之Popup弹出层 28分41秒

J_TWidget之Popup弹出层应用方式讲解以及元素位置、对齐点的原理。
7.5.应用弹出层做带有下拉菜单的店招 37分42秒

使用弹出层制作带有下拉菜单的店招效果。
7.6.倒计时的应用 28分7秒

使用在线生成工具结合Dreamweaver代码制作店铺活动倒计时效果。
7.7.SNS常用的加入购物车、分享组件等应用 30分44秒

加入购物车、分享、喜欢等组件介绍，以及利用组件制作产品交互效果。
第八章装修店铺内页及总结
8.1.店铺内页介绍及插入视频 22分38秒

详情页装修权限以及在装修页面中插入视频的方法。
8.2.动态旺旺图标 16分37秒

为自定义页面添加动态旺旺图标和总结。

第一章认识淘宝后台管理界面
1.1 课程总体规划免费 5分16秒

介绍课程总体内容及学习课程需要做的准备
1.2.淘宝后台常用操作 14分33秒

介绍装修店铺的常用后台操作，包括淘宝默认模板，页面添加，配色处理，模块添加等等。
1.3.店铺装修常用工具介绍 5分4秒

店铺装修需要的软件工具，在线生成工具，以及淘宝开放平台的使用
第二章简易的页面装修
2.1.淘宝首页标准尺寸及淘宝店招装修 35分24秒

淘宝首页标准尺寸介绍及如何利用淘宝默认工具进行简单的店招装修
2.2.首页主体内容装修 23分44秒

使用淘宝默认的模块装修轮播图效果，宝贝分类，宝贝推荐，排行榜等
2.3.分类页装修 14分5秒

使用淘宝默认模块对分类页面进行装修，包括店招的设置，添加和删除模块等。
2.4.详情页装修和发布宝贝 27分53秒

详情页的装修范围及如何设置宝贝信息及详情描述等
2.5.自定义专题页装修和导航条设置 12分18秒

如何添加自定义的专题页面，以及导航条项目设置和添加的方法
2.6.其他两个官方模板的使用 7分31秒

其他两套默认模板的介绍及装修备份还原
第三章使用生成工具装修家居类店铺实战案例
3.1.店铺装修前分析及全局设置 9分5秒

设计稿的展示以及店铺配色等的整体设置及全局分析
3.2.页头店招基础设置 9分58秒

实例讲解通屏店招背景设置及店招主图的装修过程
3.3.使用Photoshop为店招添加链接免费 17分15秒

使用Photoshop对店招设计稿进行切片并添加链接，装修店招的过程演示。
3.4.使用生成工具做自定义导航条 16分49秒

使用在线生成工具制作自定义导航条效果
3.5.全屏轮播海报的制作 20分56秒

使用在线生成工具突破淘宝默认最小宽度限制，制作全屏轮播海报效果。
3.6.热卖爆款开关灯特效制作 16分41秒

使用在线生成工具制作爆款开关灯效果，以及去除模块间隙的方法。
3.7.通栏图片及12图卡盘的做法 17分11秒

使用在线生成工具制作通栏图片及12图卡盘效果
3.8为店铺添加旺旺区域 24分53秒

主要讲解如何在店铺中添加客服阿里旺旺联系入口，方便买家咨询。
第四章店铺高级装修需要学习的HTML代码
4.1.代码编辑神器Dreamweaver和HTML的联系 14分3秒

认识熟悉代码编辑器Dreamweaver的界面及与HTML的关系详解
4.2.操作文字的常用HTML代码 24分40秒

讲解常用的文字相关HTML标签及用法包括标题标签、加粗、倾斜、段落标签、横线标签、区块标签等
4.3.标签的属性和标签的嵌套 20分8秒

详细介绍标签属性的编写方法及嵌套的原则
4.4.HTML中的超级链接 18分10秒

介绍超链接标签、属性及代码书写规范
4.5.图片标签和图像地图 17分56秒

讲解Dreamweaver插入图片的方法及对应标签，以及如何绘制热点地图
4.6.表格标签的应用 24分55秒

介绍表格的相关标签及用法，以及如何利用表格来制作淘宝店铺装修中的开关灯效果
4.7.表单标签及搜索框的应用 17分5秒

介绍表单标签及利用百度搜索的代码方便快捷制作店铺搜索框
第五章店铺高级装修需要学习的CSS样式
5.1.认识CSS样式和CSS对字体的修改 31分34秒

css样式编写规范及常用文本的CSS样式设置方法。
5.2.元素的尺寸及背景 20分40秒

讲解如何定义网页中元素的尺寸及背景颜色、背景图像和定位等。
5.3.盒子模型的内间距和外边距 20分53秒

讲解css样式盒子模型中内部填充值和外边距属性及实际应用时值的设置技巧。
5.4.盒子模型的边框和类选择器以及火狐浏览器的用法 16分57秒

主要讲解盒子模型的边框编写规范和技巧，类选择器以及火狐浏览器firebug的使用。
5.5.三种不同类型的区块及转换 25分1秒

主要讲解块元素、行元素、行内块元素的特征及相互转换的方法。
5.6.浮动布局和后代选择器 27分43秒

浮动布局的设置方法及原理，后代选择器的编写方式，以及溢出隐藏设置。
5.7.使用浮动做导航条和伪类选择器 27分57秒

使用伪类选择器、项目列表、超链接标签、浮动布局等知识制作淘宝店铺导航栏效果。
5.8.三种定位布局方式 20分17秒

元素相对定位、绝对定位、固定定位的属性设置及实际应用。
5.9 CSS3新增属性 31分46秒

讲解CSS3新增的圆角、阴影及不透明度等参数设置。
5.10.淘宝店铺装修需要的行内样式 11分48秒

如何将Dreamweaver中的CSS样式修改为行内样式，以符合店铺装修代码要求。
第六章使用代码装修自定义店铺
6.1.全屏店招的装修方法 22分2秒

使用Dreamweaver实现全屏店招效果及添加热点地图。
6.2.使用CSS样式控制导航条 27分36秒

使用CSS样式修改设置导航条的样式，制作店招和导航条统一背景图像效果。
6.3.完全自定义的店招和动态图片的制作 19分9秒

完全自定义店招和导航条样式，制作店招上动态图片效果及装修方法。
6.4.使用定位布局为店招添加搜索框 26分19秒

通过使用淘宝自带类样式设置自定义搜索框的定位。
6.5.制作通栏海报 25分57秒

使用系统提供类名打破系统默认宽度制作全屏海报。
6.6.突破950px的专题活动展示做法 34分43秒

讲解活动专题页面切图、制作热点地图以及突破淘宝默认950px宽度的装修方法。
6.7.固定背景做法和优化布局结构 30分52秒

将大面积的背景图片定义为固定背景以及滚动背景的方法，优化店铺装修的结构。
6.8.系统显示与隐藏的类footer-more 29分55秒

使用淘宝自带类样式.footer-more制作鼠标经过时图片显示与隐藏效果等。
6.9.突破950px带有鼠标特效的分类展示区域 32分25秒

结合前面所学知识，讲解了一个综合案例，主要涉及知识点包括浮动布局，定位布局，突破淘宝默认950px宽度，鼠标经过指针变化，图像变化，以及添加跳转链接等。
第七章使淘宝开放平台widget规范和SNS组件
7.1.J_TWidget之Carousel旋转木马 32分1秒

淘宝J_TWidget组件之Carousel旋转木马的使用方法介绍。
7.2.旋转木马应用案例详解 39分39秒

通过实例讲解鼠标放置到按钮上实现切换，并且主图实现淡入淡出切换的装修效果。
7.3.带有左右按钮的自定义轮播图 24分30秒

使用旋转木马制作带箭头的轮播图效果，以及定义箭头位置的实际案例。
7.4.J_TWidget之Popup弹出层 28分41秒

J_TWidget之Popup弹出层应用方式讲解以及元素位置、对齐点的原理。
7.5.应用弹出层做带有下拉菜单的店招 37分42秒

使用弹出层制作带有下拉菜单的店招效果。
7.6.倒计时的应用 28分7秒

使用在线生成工具结合Dreamweaver代码制作店铺活动倒计时效果。
7.7.SNS常用的加入购物车、分享组件等应用 30分44秒

加入购物车、分享、喜欢等组件介绍，以及利用组件制作产品交互效果。
第八章装修店铺内页及总结
8.1.店铺内页介绍及插入视频 22分38秒

详情页装修权限以及在装修页面中插入视频的方法。
8.2.动态旺旺图标 16分37秒

为自定义页面添加动态旺旺图标和总结。

正在加载...

淘宝店铺装修完全自学教程

老师的其它课程