阿里旺旺国际站国际站贸易通TM聊天工具，聊天窗口，显示不了头像

来源：蜘蛛抓取(WebSpider) 时间：2017-07-31 16:00 标签： 阿里国际站有几个橱窗
阿里国际站平台旺旺代码调用全讲解
最近经常有小伙伴们咨询我关于旺旺调用代码在装修和宝贝详情页内的使用方法。其实无论是装修页面还是宝贝详情页内，阿里都已经给出了旺旺聊天的入口，装修页面是模板形式，再加上右侧一个主账号旺旺；宝贝详情页在焦点图右侧的部位，再加上右侧一个产品所属账号的旺旺。理论上应该是够用的，但是有的小伙伴觉得装修页面想做出更漂亮的自定义的旺旺页面，宝贝详情页下部也想加入产品所有人的旺旺。今天就用两个实例给大家分享一下有关旺旺调用代码的使用方法。&
一，装修页面的使用：&
（今天是为了给大家演示效果，所以随意弄了一个简单的版式用作参考使用）&
需要达到的功能效果：1，点击头像可弹出旺旺聊天窗口；2，点击旺旺或名字也可弹出旺旺聊天窗口（这里使用阿里生成代码并且进行过了部分修改，阿里给出了四种代码，我们可根据需求来生成代码，并且可以根据自己的需求来进行代码修改，达到自己想要的视觉效果）&
注释：代码生成地址：&
& 按照惯例，直接上最终效果图：
本次分享的方法没有使用热点。每个业务员的头像与背景图片是分离的，如图背景：
如果小伙伴们喜欢，也可以不使用上面背景图的方式制作，可以把所有的文字都与图片进行分离，本次分享使用的是一张制作好的背景图片（如有机会再跟小伙伴们分享不使用背景图的制作方式）&
小伙伴们只需要把制作好的背景图片和业务员的头像上传到图片银行复制出来它的链接即可。链接植入如下代码中：（不同的设计图，代码是需要调整的，下面代码只符合上图在阿里内的定位）&
target="_blank"&
target="_blank"&
target="_blank"&
(以上代码已在阿里后台进行调试过，小伙伴们自己使用的时候需要根据自己的设计进行修改，代码里面cn需要修改成要调用账号的账户，以上代码仅供参考，不明白的小伙伴可以留言咨询交流)&
以上分享只是页面装修中很多种制作方法的其中一种模式，本分享重在代码调用方法的分享，小伙伴们可以自行设计图片效果。&
二，产品详情页的应用：&
由于阿里平台产品详情页和装修自定义模块所兼容的HTML代码有那么一点点的差别，所以有一些时候我们不能用装修的模式来制作产品详情页。今天也用实例的方式来给大家分享一种宝贝详情页内旺旺的调用方法。&
（本实例同样是为了给大家演示效果，所以随意弄了一个简单的版式用作参考使用）&
需要达到的功能效果：1，点击旺旺图标可弹出聊天窗口；2，点击文字可弹出聊天窗口。&
& 制作完成放入产品详情页效果图如下：
由上图可以看出，这是一个类似名片的展示效果，内部包含内容有：1，企业LOGO；2，企业名称；3，企业主营业务；4，业务员英文名；5，地址；6，电话、传真；7，Email和网址；8，企业二维码旺铺或者联系方式二维码。&
该实例采用图文分离的方式来制作，是背景图加文字的方式，背景图如下：
小伙伴们如有兴趣可以使用该背景图进行试验，所需全部代码如下：&
http://g01./kf/HTB1lP70OpXXXXbXXVXXq6xXFXXXM//HTB1lP70OpXXXXbXXVXXq6xXFXXXM.jpg')
no- width: 750 height: 450"&
重点提示：&
1、本设计中旺旺图标是单独的图片，也需要单独上传到图片空间且取出其链接地址；&
2、文本中有使用邮箱格式，阿里产品详情页是禁止使用邮箱格式的，所以实际操作过程中@符号可用#号替换，如果觉得视觉效果不好，也可以把@符号单独制作到背景图片上，然后采用定位的方式制作文本；&
3、代码中cn需要替换为要调用的旺旺账号；
A-5 Yaqiuhu Industrial Zone, Mumian wan
Village, Buji Town, Shenzhen
target="_blank"&Click and Chat Now
Main Products of the
target="_blank"&http://g02./kf/HTB1yQXfOFXXXXapaXXX760XFXXXg//HTB1yQXfOFXXXXapaXXX760XFXXXg.png"
width="49" height="55" style="margin-left: 75" /&
COMPANY NAME
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。

我要回帖

更多关于 阿里国际站有几个橱窗 的文章

 

随机推荐