1、淘宝天猫网店美工实战-视觉设计+店铺装修+移动端店铺(微课版)第10章装修网店目录 Contents10.1 装修前的准备工作10.2 装修PC端网店10.3 装修移动端网店10.4 课堂实训装修开学季专题页10.1.1 切片与保存图片其具体操作如下。1 添加参考线2 切片图片本例为“女包网店首页”的首页图片创建切片,并将创建的切片保存到计算机中,方便后期装修网店时使用,下面介绍网页切片与保存的方法。10.1.1 切片与保存图片3 设置保存格式4 查看保存效果10.1.2 上传图片至图片空间进行装修或发布商品前,商家可将需要使用的图片上传到图片空间,在需要使用对应的图片时可以直接从中选择。其具
2、体操作如下。1 输入文件夹名称10.1.2 上传图片至图片空间2 单击“上传”超链接4 查看上传的图片3 选择需要上传的图片目录 Contents10.1 装修前的准备工作10.2 装修PC端网店10.3 装修移动端网店10.4 课堂实训装修开学季专题页10.2.1 认识装修模块在进行模块布局前,需要了解网店装修的基础模块。常用的基础模块包括店铺招牌模块、宝贝推荐模块、宝贝排行模块、默认分类模块、个性分类模块、自定义区模块、图片轮播模块等。网店装修的常用模块,如图所示。10.2.2 装修 PC 端网店首页本例将使用“全屏宽图”系统模块装修首页中的一个页面,其具体操作如下。1 装修首页页面2 添
3、加模块10.2.2 装修 PC 端网店首页3 选择要添加的图片4 调整裁剪区域5 选择要添加的图片6 预览装修后的效果10.2.3 装修 PC 端商品详情页1 单击“发布宝贝”超链接2 选择商品类目详情页的装修主要是在发布商品时进行的,当完成详情页的设计后,即可将其上传到图片空间中,再直接通过“淘宝神笔”中的模板生成。下面讲解PC端商品详情页的装修方法,其具体操作如下。10.2.3 装修 PC 端商品详情页4 选择图片5 单击“发布宝贝”超链接 3“立即使用”按钮6 选择宝贝信息10.2.3 装修 PC 端商品详情页7 完成编辑目录 Contents10.1 装修前的准备工作10.2 装修PC
4、端网店10.3 装修移动端网店10.4 课堂实训装修开学季专题页10.3.1 装修移动端网店首页在网店装修中除了涉及PC端,还需要对移动端网店进行装修。下面将使用移动端中的自定义模块对首页进行简单装修,其具体操作如下。1 添加模块2 编辑板式10.3.1 装修移动端网店首页4 单击“上传”按钮5 选择需要上传的图片3 单击“添加图片”超链接10.3.1 装修移动端网店首页7 单击“保存”按钮6 选择图片10.3.1 装修移动端网店首页8 绘制其他矩形并添加图片10 查看预览效果9 添加链接地址10.3.2 装修移动端商品详情页打开“商品发布”页面,单击选中“使用文本编辑器”单选项,单击“添加”
5、按钮,打开“图片空间”对话框,在其中选择需要添加的商品详情页图片,单击“确定”按钮,完成后单击“提交宝贝信息”按钮,即可完成移动端商品详情页的装修。移动端商品详情页装修目录 Contents10.1 装修前的准备工作10.2 装修PC端网店10.3 装修移动端网店10.4 课堂实训装修开学季专题页10.4 课堂实训装修开学季专题页本例将装修开学季专题页,在装修前先使用切片工具进行切片,再上传到图片空间,并进行页面的装修。在装修时将直接使用全屏宽图进行装修,完成后的参考效果如图所示。实训目标10.4 课堂实训装修开学季专题页实训思路根据实训目标,完成本实训主要需进行以下主要操作。(1)打开“开学季专题页.jpg”素材文件,将其进行切片操作。(2)登录淘宝,在“千牛卖家中心”下拉列表中单击“免费开店”超链接进入“千牛卖家中心”页面,在左侧列表框的“店铺管理”栏中单击“图片空间”超链接,进入“素材管理”页面,将切片后的图片上传到“素材管理”页面中。(3)打开“店铺装修”页面,添加“全屏宽度”模块,打开“全屏宽度”对话框,在其中分别添加切片后的图片,并查看完成后的效果。淘宝天猫网店美工实战-视觉设计+店铺装修+移动端店铺(微课版)学习进步