《网页设计与制作项目教程》课件5.pptx

1、网页设计与制作项目教程项目五建设第三方网店项目五 建设第三方网店项目目标：能力目标(1)理解网店装修的概念和网店装修的重要性(2)明白网店装修与店铺营销、转化率之间的关系能够让网店专修带动店铺的销售，提高顾客的浏览量(3)学会用有效的方法确定网店的装修风格(4)学会网店建设与设计知识目标(1)网店建设步骤(2)网店建设的要素(3)网店的架构和风格设计(4)网店布局的常用结构网页设计与制作项目教程项目五 建设第三方网店任务1 注册并开通淘宝网店【任务目标】【任务实施】本任务的目标是成功注册并开通淘宝网店一、注册淘宝会员 开淘宝店，需拥有两个账号：淘宝网登录账号与支付宝账号。网页设计与制作项目教程

2、项目五 建设第三方网店1：打开淘宝网，点击“注册”，如图5-1-1所示。2：填写账号信息，填写基本注册信息并提交，如图5-1-2所示。网页设计与制作项目教程项目五 建设第三方网店3 3：提交信息之后需要进行安全验证：点击免费获取验证码，手机会收到6位数字的验证码，如图5-1-3所示。图5-1-3填写验证码网页设计与制作项目教程项目五 建设第三方网店4：设置支付方式，如图5-1-4所示图5-1-4 设置支付方式网页设计与制作项目教程项目五 建设第三方网店5：校验成功后，淘宝账户即注册成功了，如图5-1-5所示图5-1-5 注册成功网页设计与制作项目教程项目五 建设第三方网店二、创建店铺，如图5-

3、1-6、图5-1-7、图5-1-8所示。网页设计与制作项目教程项目五 建设第三方网店三、开店发布宝贝 1：登陆淘宝，点击右上角的卖家中心，进入你的卖家中心管理界面，如图5-1-9所示。图5-1-9 点击卖家中心网页设计与制作项目教程项目五 建设第三方网店2：点击宝贝管理-发布宝贝，进入发布宝贝的页面，如图5-1-10所示。图5-1-10宝贝管理网页设计与制作项目教程项目五 建设第三方网店3：从淘宝提供的宝贝分类为你的宝贝选择一个分类，一般最后的三级或四级分类如果找不到你的宝贝不选也可以。点击我已阅读以下规则，现在发布宝贝，如图5-1-11所示。图5-1-11 发布宝贝网页设计与制作项目教程项目

4、五 建设第三方网店4：根据你的宝贝信息添加其他类型尺寸等项目，宝贝标题处可输入宝贝的标题，建议进行相关的关键词优化操作，提升你的宝贝被搜索到的可能性，如图5-1-12所示。图5-1-12 设置宝贝属性网页设计与制作项目教程项目五 建设第三方网店5：填好宝贝的其他信息，运费模板可根据提示设置，如买家是否承担运费，库存设置一般都采用拍下减少库存，最下面的橱窗推荐可以勾选，这样当买家进入你的淘宝店铺就会优先看到橱窗推荐的宝贝，如图5-1-13所示。图5-1-13填好宝贝的其他信息网页设计与制作项目教程项目五 建设第三方网店6：在宝贝信息页面上传图片，可以选择直接上传图片或从图片空间上传图片，宝贝主图

5、大小不能超过3MB。淘宝宝贝的推荐尺寸为700700以上的图片自动提供放大镜功能，如图5-1-14所示。图5-1-14 上传图片网页设计与制作项目教程项目五 建设第三方网店任务2 装修淘宝网店【任务目标】【任务实施】本任务的目标是对淘宝网店进行装修一、进入装修页面 登录进去卖家中心,再点击左侧菜单栏中的店铺管理“店铺装修”，如图5-2-1所示。图5-2-1进入装修页面网页设计与制作项目教程项目五 建设第三方网店二、设置店招1.制作店招 这是在某个在线制作店招的网站的截图，首先要填写好标题（填写的内容与店招成品的对应关系如图），然后点击“确认提交”，就可以生成想要的图片了，然后在生成图片上右击“

6、图片另存为”，这样店招就做好了。如图5-2-2所示。图5-2-2 提交店招网页设计与制作项目教程项目五 建设第三方网店2.点击编辑（淘宝店铺）在装修店铺的页面，选中店招的部分，单击“编辑”，如图5-2-3所示。图5-2-3店招的“编辑”网页设计与制作项目教程项目五 建设第三方网店3.上传制作好的店招图片 进入编辑后选择自定义招牌，然后点击“插入图片空间图片”图标，再选择“上传新图片”或从淘盘选择，最后上传已经制作好的店招图片，然后保存，这样店招的部分就设置好了，如图5-2-4所示。图5-2-4 上传店招图片网页设计与制作项目教程项目五 建设第三方网店三、店铺页面版本对比，淘宝店版本分为专业版和

7、基础版，如图5-2-5所示。图5-2-5店铺页面版本对比网页设计与制作项目教程项目五 建设第三方网店1.模版风格的选择 模版的风格有多种颜色选择，具体的选择要根据你所设计的整体色调来决定。首先点击“页面装修”（红框）“配色”，然后选择颜色（如天蓝色）,最后点击“保存”，如图5-2-6所示。图5-2-6模版风格的选择网页设计与制作项目教程项目五 建设第三方网店2.店铺页面内的各个部分的安排布局 首先点击“布局管理”，然后在“蓝色框”内的内容可以随意拖动调换位置，另外“自定义内容”区域和“添加布局单元”（橙色框）可以根据需要选择添加，如图5-2-7、图5-2-8所示。网页设计与制作项目教程项目五

8、建设第三方网店四、玩转自定义内容1、首先，点击“编辑”，如图5-2-9所示。图5-2-9 自定义内容网页设计与制作项目教程项目五 建设第三方网店2、然后，可以点击“源码”图标，如图5-2-10所示。图5-2-10“源码”网页设计与制作项目教程项目五 建设第三方网店3、接着，在百度上搜索“免费淘宝模版代码”，然后把代码复制粘贴在“绿色框”的区域，再点击多一次“源码”这个图标，就可预览效果了。如图5-2-11、图5-2-12所示。图5-2-11 代码复制粘贴网页设计与制作项目教程项目五 建设第三方网店图5-2-12 预览源码效果网页设计与制作项目教程项目五 建设第三方网店五、发布店铺 图片和文字都

9、设置好以后，点击“预览”，对局部进行一下调整，如果没问题的话再点击发布，这样淘宝店面就装修好了，如图5-2-13所示。图5-2-13发布店铺网页设计与制作项目教程项目五 建设第三方网店六、手机淘宝店铺管理1、进入卖家中心，点击店铺管理中的“手机淘宝店铺”，如图5-2-14所示。图5-2-14手机淘宝店铺管理网页设计与制作项目教程项目五 建设第三方网店2、进入手机淘宝店铺管理界面，如图5-2-15、图5-2-16所示，选择“立即装修”，为手机端编辑宝贝的信息和宝贝的图片，注意手机端也要去编辑和上传宝贝图片，这样相当于开通手机端的宝贝页面，方便手机用户买家查看和购买，如图5-2-17所示。图5-2

10、-15 手机淘宝店铺管理界面网页设计与制作项目教程项目五 建设第三方网店图5-2-16 手机淘宝店铺各模块网页设计与制作项目教程项目五 建设第三方网店图5-2-17 装修手机淘宝店铺网页设计与制作项目教程项目五 建设第三方网店【项目总结】【项目总结】在本项目中，介绍了建设网店的基本步骤与流程。注册并开通淘宝网店后，就要对店铺进行适当的装修，掌握店招设置、模板使用、自定义内容设计，图片、色彩、多媒体的综合运用等知识。网页设计与制作项目教程项目五 建设第三方网店【项目检测】【项目检测】一、练习题1.在淘宝网上注册店铺需要什么条件，要准备些什么资料？2.比较京东店铺和淘宝店铺的异同。二、拓展训练 以女装为素材，设计一个女装店铺的首页，要求以产品的风格作为网页配色的依据，制作出店招、导航条、轮播图、分类栏目和商品展示区，要求页面合理布置，大方得体。网页设计与制作项目教程项目五 建设第三方网店