手把手教你DIY移动站的“一键联系”组件

最近有朋友找我做网站，我是用ECshop给他做的商城。网站做完以后，我这位朋友又让我给他搞一个手机站。当然做一个手机站也不是太难，对于一些小白来说，可能就会有点难度了。【还不会做手机站的，可以正文下的我的博客中找相关文章，我也有介绍过，点击阅读】。

今天这篇文章，我主要是手把手的教大家如何给自己的手机站加上“一键联系”的组件。

什么是“一键联系”的组件?

看一下下图：

这个我相信不少朋友都见过，实际上操作起来也是非常方便。只要是在移动端浏览我们网站的朋友，如果他有购买需求，就可以通过下方的“一键联系”组件直接与我们去的联系，二不用再返回手机的拨号界面、短信界面或者联系到浏览器中打开相应的界面，很大程度上缩短了买家与买家之间的联系时间，提高成交率。

既然这个组件这么好，怎么加?

其实这就关系到div+css了，是要你稍微懂点，都不会太难，如果你自己会拷贝复制呢，可以直接从别人的网站上提取相关代码。

你要是不熟悉div+css，我就简单的给你解释一下，怎么样才可以实现“一键联系”的效果!

好，我们先来看一下我给大家截图的代码：

通过以上不难发现，其实也就是简单的html代码，就可以实现一键联系的效果：

比如：《a href=”tel:13912345678”》电话联系《/a》，这就表示，当访客点击“电话联系”的时候，就会在手机上直接进入拨号界面。

短信咨询,这就表示，可以直接给卖家发短信，也是跳转到发短信的界面。

如果你有购买在线客服服务，你也可以加入你的一键联系的链接，直接跳转到聊天窗口。

下边是一张没有加DIY组件与加了DIY组件的示意图，对比一下，一目了然：

不会设置的朋友可以到我的博客下载代码，或者你就直接拷贝代码段到你的网页中去!