《排序2-5公开课.docx》由会员分享,可在线阅读,更多相关《排序2-5公开课.docx(2页珍藏版)》请在第一文库网上搜索。
1、1 .活动1布局淘宝PC端首页A. 画出店铺首布局图。B. 利用DreamWeayerCS66软件制作店铺首页。C.用CSS样式文件美化店铺的首页,操作中注意页面设计简便,网页各元素能够准确定位,使页面的整体效果达到最佳。D.预览测试效果。E.浏览店铺的首页,分析店铺的结构F.调用事先准备好的店标、店招、轮播图片、优惠券、促销图、商品图片等素材。G.店铺首页使用表格及嵌套表格对页面进行合理布局,在表格中插入图像、文本等网页元素。2.创建网页模板A.要制作好一个完整的店铺首页。B.为模板添加可编辑区域C.将现有制作好的店铺首页另存为模板。3.手动更新模板及网页A.在“查看”下拉列表框中设置要更新
2、的范围,选择“整个站点”选项,B.在右侧的下拉菜单中选择站点名“myweb,这样将更新选定站点的所有网页。C.在“资源”面板的模板列表中单击要更新的模板。D. 打开“更新页面”对话框E.在弹出的快捷菜单中单击“更新页面”命令4.创建模板A.执行【文件】【另存为模板】命令。B.在“另存为”文本框中输入名称“temp1ate”,单击“保存”按钮C.在打开的提示对话框中单击“是”按钮,完成模板的创建。此时,将打开temp1ate.dwt”模板文件。D.打开“另存模板”对话框,在“站点”下拉列表中选择umywebw选项E. 先创建一个“myweb的站点,再使用DreamweaverCS6软件打开“素材
3、index.htm,网页5.为模板添加可编辑区域A.选中店铺首页中的轮播图片,执行【插入】【模板对象】【可编辑区域】命令,打开“新建可编辑区域”对话框,在“名称”文本框中输入“hb”,单击“确定”按钮.B.打开“新建可编辑区域”对话框,在“名称”文本框中输入名称“bannerO1”,单击“确定”按钮。C.选中店铺首页中“宝贝推荐”这块的表格,执行【插入】【模板对象】【可编辑区域】命令,打开“新建可编辑区域”对话框,在“名称”文本框中输人名称“bbtj”单击“确定”按钮。D.选中模板文件导航栏中的“首页”文本,执行【插入】【模板对象】【可编辑区域】命令。E.使用相同的方法,为导航栏中的其他对象创
4、建可编辑区域,并分别将其命名为banner02,banner03”abanner04,“banner05mbanner06itbanner076 .新建基于模板的网页A. 在“站点myweb的模板”列表中选择“temp1ate”选项B. 在“站点”列表框中选择“myweb”选项C. 执行【文件H新建】命令,打开“新建文档”对话框。D. 单击“创建”按钮E. 选择“模板中的页”选项卡7 .在网页中添加内容A. 使用相同的方法,先删除导航栏中的其他对象可编辑区域中的内容,并分别输入文字B. 选择“hb”可编辑区域中的内容,按“De1ete键删除,然后执行【插入】【图像】命令,打开“选择图像源文件”
5、对话框,在其中选择需要插入的图片Images下的haibao.jpg,单击“确定”按钮。C. 保存并预览D. 选择导航栏“banner阿编辑区域中的内容,按“De1ete键删除,然后输入“首页二E. 返回网页,将光标定位在插入表格后的第1行中的第-个单元格,执行【插入】【图像】命令,在打开的对话框中选择插入的images下的坚果图像。使用相同的方法将第3行、5行、7行中把图像插入每个单元格内。F. 选择“bbt”可编辑区域中的内容,按“De1ete”键删除,然后插入一张12行x4歹J,表格宽度100%,边框粗细OPX单元格边距、间距为0的表格。G. 将光标定位在第2行、4行、6行、8行中,输入
6、每件商品的相关文本。8 .开启IIS功能A. 打开“Wind。WS功能”窗口,在其功能列表框中单击“Internet信息服务”选项前的复选框,使其呈选中状态。用户也可展开该目录手动选中需要打开的功能。B. 在“程序和功能”窗口右侧的窗格中单击“打开或关闭WindOwS功能”超级链接C. 安装后,可在浏览器的地址栏中输入http:/1oca1host测试是否安装成功D. 单击“确定”按钮,将打开“正更改功能”提示框,等待其安装完成后将自动关闭“Windows功能”窗口,完成I1S的安装。E. 执行【开始】【控制面板】命令,打开“控制面板”窗口,在其中单击“程序和功能”超级链接,打开“程序和功能”
7、窗口。9 .配置IISA. 在窗口左侧“连接”中右击“添加网站二B. IP地址为本机的IP地址,端口默认为80,可根据需要更改端口号。C. 主机名不用填写,单击“确定”按钮。D. 在浏览器地址栏中输入“http10.36.23.146/indexhtniP即可访问我们的“小凡果子铺”T-E. 设置默认文档的优先级。打开网站的默认文档设置。F. 在“控制面板”窗口中的“大图标”查看方式下,单击“管理工具”超级链接G. 在打开的“管理工具”窗口中双击“Internet信息服务(HS)管理器”选项。H. 在“添加网站”对话框中填入网站名称“xfdp”,物理路径为存放网站文件的文件夹,此处填“F:my
8、web”10 .开启FTP功能A. 单击“确定”按钮,完成FTP服务的开启。B. 在“程序和功能”窗口,单击左侧的“打开或关闭WindOWS功能”链接。C. 勾选“FTP服务”复选框D. 打开控制面板,单击”程序和功能”链接。E. 展开“Internet信息服务”下的“FTP服务器”节点I1配置FTP服务。A. 在窗口左侧的“连接”中单击用户名为“SYA023146”的计算机B. 在“FTP站点名称”文本框中输入“Xfdpftp,物理路径一般填写存放网站的文件夹,这里填写F:myweb”。C. 单击“下一步”按钮,在“1P地址”下拉列表框中输入本机(发布网页的计算机)的IP地址“10.36.2
9、3.146”,端口号用默认的21D.在“身份验证”选项区域内勾选“基本”复选框,为了安全,不允许匿名用户登录,而是指用户“webeditor”(出于安全,该用户应该是专门维护网站的,赋予其“读取”和“写入”权限),单击“完成”按钮后FTP服务即会启动。E.单击窗口左侧的“网站”后,在弹出的快捷菜单中单击“添加FTP站点”命令,弹出“添加FTP站点”对话框。F.双击打开Intemet信息服务(I1S)管理器窗口。G.在控制面板窗口中单击“管理工具”按钮。H.勾选“自动启动FTp站点(S)”复选框,在“SS1”选项区域内选中“无”,单击“下一步”按钮。12.设计移动端电商网站首页A.明确每个部分主
10、要展现的内容,以及在淘宝移动端首页制作中需要的模块。B.确定淘宝移动端首页的结构C.打开“优蜜母婴电脑端首页效果,分析“优蜜母婴”PC端首页效果。D.对比移动端首页和PC端首页的布局,分析两者的相同和不同之处。13.制作移动端电商网站首页A. 制作淘宝移动端产品展示部分,主要包括热销产品和新品上市模块。B. 根据淘宝移动端首页布局,制作淘宝移动端首页轮播图模块C.制作淘宝移动端品类导航模块D.打开淘宝移动端装修平台“无线装修”,时移动端的店招模块进行制作,主要修改店招图片和链接。E.制作淘宝移动端优惠券模块F.将制作完成的淘宝移动端首页发布,并且测试“优蜜母婴”移动端店铺首页效果。14.移动端
11、店招模块。A.店招图片可以使用“官方推荐”的图片,不过一般我们会制作自己的店铺店招图片,用“自定义上传二B.从打开的页面“无线运营中心”“店铺装修”中的“店铺首页”进入“无线装修”C.在打开的页面中单击“无线店铺”的“立即装修”选项D.接着输入店招图片链接,或是单击后面的链接图标在“链接小工具”中添加链接。E.进入“卖家中心”页面,单击“手机淘宝店铺”F. 单击中间实时预览中的店招模块,右侧会出现店招的编辑页面。店铺基本信息一般不需要调整。G. 单击+“,会进入“图片小工具”,可以上传新图片,或是事先上传到“图片空间”,然后直接选择图片。15 .移动端首页轮播图模块。A. 在右侧“轮播图模块”
12、编辑页面中,单击“+”,会进入“图片小工具”,可以上传新图片,或是事先上传到“图片空间”,然后直接选择图片。B. 在“店铺装修”的“图文类”模块中选择“轮播图模块”C. 加入链接,输入链接或是单击后面的链接图标在“链接小工具”中添加链接。D. 继续添加第二张轮播图E. 拖入中间预览的虚线区域16 .移动端首页品类导航模块。A. 拖入中间预览图中B. 加入链接,输入链接或是单击后面的链接图标在“链接小工具”中添加链接。C. 上传新图片,或是事先上传到“图片空间”,然后直接选择。D. 在“店铺装修”的“图文类”模块中选择“双列图片模块”E. 在右侧“双列图片模块”编辑页面中,单击“+”会进入”图片
13、小工具”,F. 继续添加第二张图片,操作同上面的操作。17 .移动端首页产品展示部分A. 操作和“智能单列宝贝”基本相同,这里不再赘述。B. 在“店铺装修”的“宝贝类”模块中选择“智能单列宝贝”制作热销产品模块,拖入中间预览图中。C. 在“店铺装修”的“宝贝类”模块中选择“智能双列宝贝”制作新品产品模块,拖入中间预览图中。D. 选择推荐类型,可以选择“自动推荐”或是“手动推荐选择“自动推荐”填写完整筛选条件平台会智能推荐,选择“手动推荐”需要自行添加商品,最多可加6少商品。E. 在右侧“智能单列宝贝”编辑页面中,输入标题“热销宝贝”,可以加入更多链接,输入链接或是单击后面的链接图标在“链接小工
14、具”中添加链接。18 .设计移动端电商网站详情页A. 运用九宫格法提炼宝贝的卖点B. 主要通过筛选和修改PC端宝贝详情页模块,确定在移动端宝贝详情页。C. 根据提供的“优蜜母婴PC端花王妙而舒纸尿裤NB90的宝贝详情页,分析PC端宝贝详情页。D. 查看提供的资源图片“花王妙而舒纸尿裤NB90电脑端详情页”19 .制作移动端电商网站详情页A. 然后在宝贝发布页面中找到“移动端描述二B. 选择详情页图片模块进行修改,可以上移、下移、替换和删除C. 在宝贝发布页面中使用文本编辑导入电脑端描述二D. 在宝贝详情页各个模块制作完成之后,保存宝贝详情页。E. 宝贝发布页面中直接单击“发布”按钮即可。F. 进入“卖家中心”页面,选择“宝贝管理”中的“出售中的宝贝”,选择需要编辑的宝贝。G. 可以单击下方的“+”添加音频、摘要、图片和文字等。H. 登录移动端店铺,找到相应的商品,在手机中测试查看详情页效果