更多

淘妆城在线咨询
  • 代理咨询
  • 淘妆城_小淘
  • 点击这里联系淘妆城客服
  • 淘妆城_小艳
  • 点击这里联系淘妆城客服
  • 淘妆城_小玲
  • 点击这里联系淘妆城客服
  • 售后服务
  • 淘妆城_售后
  • 点击这里联系淘妆城客服
  • 淘宝旺旺
  • 淘妆城-淘宝旺旺
  • 淘妆城-淘宝旺旺
  • 关闭客服栏
淘妆城客户留言

文章分类

帮助中心

当前位置: 首页 > 淘宝学院 > 【深入原理 轻松掌握手机端】让你店铺大牌起来

【深入原理 轻松掌握手机端】让你店铺大牌起来

淘妆城 / 2015-04-16
[] [] []


无线淘宝装修的页面里,新增自定义模块已经有一段时间了,想必很多卖家朋友尚且不知道如何着手,且最多设置10个子模块,图片大小可以自行选择拉动;模块可自定义高度,但是区别于PC端的html源码自定义模块,图片基于无线端的自定义可视化框架,有很强的限制性。

   

首先,我们先了解一下无线端自定义的框架结构。将左边自定义模块拖至右边编辑框,如下图

点击自定义编辑模块,发现每个模块都是由8个相同的可视化小方格组成。

每个小方格的尺寸为:76px

整体模块宽度为:8*76px=608px

所以自定义模块的图片宽度必须为608px,高度自定为:76px*n,n为自定义,想多少,就多少,但是不建议太高(加载速度会很慢)。

相信到这里,大家差不多明白了,就是你必须基于这些可视化的方格上设计你想要的图片。

 

鼠标点击红色框右下角箭头可随意拉伸。但是红色框自会贴合靠近的方格边线。就是已76的倍数接近你的鼠标位置。如下图:

 

明白了自定义模块的基本构造,我们就可以在PS新建宽度608px的文件,高度自定(可以随时修改文件的高度)。新建文件之后,点击PS菜单栏:视图/新建参考线(可自己自定义快捷键,方便重复操作)

弹出对话框(如下图):

选择参考线的水平或者垂直模式,依次填入对应的76倍数的位置(注意:默认单位是厘米,改成像素即px)

重复新建参考线之后,如下图(注意参考线必须均分,否则错一步将前功尽弃,因为无线端只认比方格倍数大的图片,不支持小于方格倍数的图片)

新建好水平和垂直的网格之后,你必须基于这些网格进行设计的图片,如下图:

当图片设计完毕,下一步就是要切图了,会使用到了切片工具,切图完毕,ctrl+shift+alt+s组合键导出切片,选择jpg模式。如下图。

将切片上传到空间,回到无线端编辑,根据你倒出来的切片,用鼠标拉伸自定义红色框确定相应的位置,双击确定。在右边选择对应的切片即可。就是这么简单有木有,完全不涉及HTML源码。

 

最后说一下手机端的短链设置,举个例子

下图为PC端宝贝的连接(小技巧:建议大家到出售中的宝贝复制宝贝连接,这样得到的连接会比较短,加载会快些)

PC:http://item.taobao.com/item.htm?id=43540382114

那无线端的连接怎么设置呢,其实很简单,把PC:http://item.taobao.com/item.htm?id=43540382114前面红色的部分换成http://h5.m.taobao.com/awp/core/detail.htm?即可,最后的手机短链是:http://h5.m.taobao.com/awp/core/detail.htm?id=41426940784

 

最后点击确定,自定义模块轻松搞定!

 

 



下一篇: Empty! 上一篇: 【创业经验】怎样让你的淘店脱颖而出?
© 2005-2024 淘妆城 版权所有,并保留所有权利。
淘妆城品牌化妆品批发中心 天河区东圃国际购物广场
Tel: 020-32636572 QQ 6851289 QQ 2892577 QQ 83280140 QQ 231221 淘宝旺旺淘妆城批发 淘宝旺旺淘妆城旺
ICP备案证书号:闽ICP备13006884号-2
共执行 100 个查询,用时 0.117224 秒,在线 321 人,Gzip 已禁用,占用内存 3.841 MB
Powered by ECShop v2.7.3   Licensed

粤公网安备 44011802000154号