导图社区 京东网店装修设计方案分享
京东网店装修设计方案分享、不切图加热点。(推荐使用)此方法也可用于990px的详情页的制作、1、将效果图上传到商品管理下面的图片空间、2、复制该图片的代码;
编辑于2022-11-22 11:11:14 广东京东网店装修设计方案分享
设计规范
LOGO
尺寸:180×60px
格式:JPG、PNG、gif
首页
banner
尺寸:990×250px
格式:JPG、PNG、gif
宣传banner
不允许出现其他网址的链接或提示
不允许出现商家的客服联系方式及实体店等
店招
950×150px
轮播banner
950(固定宽)×550(以内)px
店铺分类栏
宽:≤180px
左侧促销
宽:≤210px
店铺收藏(分享)
优惠券发放
右侧促销
宽:≤730px
活动预告
主推产品宣传图
轮播图片
优惠券
品牌简介
尺寸
宽:740px,高:不限
格式
JPG
大小
1M以内
内容
介绍公司
主图
规格
800×800px
72ppi
JPG
300K以内
首图
背景:白底(家纺、服装分类除外,详见行业标准)
商品区域:780×780px
参考线:10px、790px
辅图
背景:无要求
包括:正面、背面、侧面、细节
详情页
规格
宽:990px
高:不限
大小:1M以内
内容
不能出现市场价
不能出现淘宝用语
亲、包邮、正品、原价、市场价……
团购
普通团
入口图
440×293px
50k以内
主图
800×800px
300k以内
品牌预定团
入口图
440×293px
50k以内
入口图2
990×200px
60k以内
主图
800×800px
300k以内
首页装修
店招导航
方法一:背景实现
优势:简单稳定
劣势:超出990部分无法添加链接
操作:①点击布局设置②设置区域背景实现全屏
方法二:通过全屏代码
优势:局限少,990px外也可加链接
劣势:不稳定
全屏代码:
<div style="height:180px;"> <div style="margin-left:-960px;width:1920px;left:50%;position:absolute;"> 内容 </div></div>
高度:自定义
方法三:不使用公共头部,直接在页面中做
优势:直接在通栏百分百布局下添加自定义模块,简单方便
劣势:商品列表、搜索结果等页面都需要单独制作
搜索框特效代码
搜索 牛到哭的镇店之宝就这么D的商品推荐就这么D的商品推荐就这么D的商品推荐就这么D的商品推荐
蓝色清爽下拉带图片轮播导航代码
查看所有商品 促销专区 新品速递 超值热卖 秋冬必备 特价专区 包邮专区 漆面养护 洗车去污 车蜡系列 划痕修复 封釉镀膜 清洁护理 车体清洁 内饰清洁 内饰保养 系统养护 玻璃清洁 轮胎轮毂养护 内饰精品 超值套装 头枕颈枕 抱枕 空调被 腰垫靠垫 车内小套饰 座垫 脚垫 方向盘套 车内挂件 实用配饰 汽车香氛 竹炭去味 车内吊香 仪表台香水 香水补充液 超值专区 毛巾 海绵 手套 蜡扫 其他工具 最新促销活动    首页有惊喜 镇店之宝 雨刷专区 降温大促 新车必备 反季亏本清仓 新品抢先 品牌故事
收藏夹代码及连接
方法一:
使用代码(懂代码的推荐使用)修改文字,可改成图片
<div class="j-module" module-function="addFavorite" module-param="{title:'京东商城', url:'http://www.jd.com'}" style="cursor: pointer;"> <div> <span>加入收藏</span> </div></div>
方法二:
链接修改链接和文字
javascript:window.external.AddFavorite('http://www.jd.com/','京东')
关注店铺代码及关注链接
方法一:
写代码(会代码的推荐使用)
<div class="j-module s_attention" module-function="follow" module-param="{type:'shopId',id:'自己的店铺ID',node:'.item'}" style="cursor: pointer;"> <span class="item">关注我</span></div>
方法二:
直接加链接,适合代码菜鸟
代码如下:javascript:S_ifollow.follow('shopId', shopId, 'shop-attention');直接在链接里添加以上代码即可
京东客服代码生成
http://www.jy47.com/tool/jd/201508/00000117.html
自定义样式命名
必须以.user为前缀
如:.user-banner{}
全屏代码
全屏轮播图代码
  
关联版式做成990px
方法一:
不切图加热点。(推荐使用)此方法也可用于990px的详情页的制作
1、将效果图上传到商品管理下面的图片空间
商品管理→图片管理
2、复制该图片的代码;
3、进入dw编辑热点,如果图片只是单个链接或没有连接,此步骤可省略
33333.jpg
4、复制以上代码到关联版式,注意切换到代码模式下再粘贴
4444.jpg
5、保存,去商品管理设置管理板式即可!
方法二:
PS中切图
990左侧菜单左右滑动轮播特效代码
     建缘设计 建缘设计 建缘设计 建缘设计 建缘设计
       推荐 7月18日  JUST US项链时尚饰品小时代系列吊坠项坠925纯银Tiny Time 女款项链 ¥299.00 建缘设计,倾力奉献  JUST US纯银吊坠商场新款简洁时尚饰品项链水滴皇冠项坠 光之要义 吊坠+41cm十字银链 ¥328.00 建缘设计,倾力奉献  JUST US纯银吊坠商场新款简洁时尚饰品项链水滴皇冠项坠 光之要义 单坠 ¥229.00 建缘设计,倾力奉献  JUST US情侣对戒专柜新款磨砂镶钻男女戒指拼接指环 露西亚的猫咪 女戒11号 ¥329.00 建缘设计,倾力奉献  JUST US情侣对戒专柜新款磨砂镶钻男女戒指拼接指环 露西亚的猫咪 女戒13号 ¥329.00 建缘设计,倾力奉献