|
有些基础的朋友都会自己建站，如果建站积累的经验还不是太多的话，可能只会被原有的网站模板限制。比如拿网站侧边栏的在线客服框来说，由于太多的新手朋友使用的是现成的模板或者是插件，导致侧边栏的客服框要么很丑，要么就是加了第三方的链接，这样，无论是对网站的用户体验还是网站的优化，都不是太好。 我给大家列出来几种常见常见的客服框，哪一种你更喜欢呢？ 9 [. h' x. ]# a0 A" x, @; r
4 Y3 O9 N2 `! N2 n这篇文章，我来教大家怎么给你的网站随心所欲的添加侧边栏在线客服框。为了方便教大家，我以我下载的源码为例来讲解，代码的下载我会放在网盘中提供给你们！ 一、先去网上找一些客服源码。比如你可以搜“网站客服源码”、“网站浮动客服源码”、“QQ在线客服代码”，“在线jQuery客服代码”等。因为大部分提供在线客服代码下载的站，都会有提供演示，所以大家先提前看好哪一种是你想要的，选择好以后下载下载。 二、下载后对文件进行分析，一般情况下，像这样的简单代码都会是一个index.html演示页，一个CSS文件夹，一个JS文件夹和一个Images文件夹。我下载了一个，如下图： + S$ ~/ H/ u' b, j0 N- B: ]
& S0 p8 N0 l. Y
三、当我们下载好以后，可以先看一下在本地打开是否正常显示。 四、用网页编辑工具（dreamwave等）打开index.html，然后找到<body></body>中的客服代码，然后复制到你的网页底部或者是网站的底部模板文件中去。 ; n- F2 L2 o8 T. X5 D
) n& S4 ?! S3 p8 d( @五、在<head></head>中复制两段代码，然后粘贴到你的网站头部或者是网页头部模板文件中去，如图 六、修改调用的css文件和js文件的调用路径。 
七、查看images文件夹中有几张图片，如果你测试添加的客服框没有显示图片，你就在步骤四的<body></body>文件中和步骤六的css文件中找到图片所在链接，修改好即可！
/ O) i( m3 S1 i! ^4 O# M. z+ z; `* Y# k* F8 n1 H- }/ b# a
' A+ q- N9 p7 X9 M. F$ H/ P
2 H4 X' p& P* Z- Q- L7 L a: F- f
经过以上的几个步骤，属于你自己的在线悬浮客服框就已经调试好了，所有的代码都是在你的服务器中安装，并且也完全避免了调用第三方的JS文件的弊端，提高你的网站的加在速度。 建议： 因为网上很多的客服源码都带有第三方的广告信息，比如对方的网址，站名等，下载后请自行检查并去除，保持你的代码干净！ 本文演示代码下载：链接：http://pan.baidu.com/s/1dDlnbUh密码：0pwv
8 `3 Q, `7 a* `3 A1 K, m w. X
1 E4 O* j L; S5 s
文/刘三土博客 一个半路出家转型的自媒体博客 原文出处链接：http://bbs.seowhy.com/thread-37839094-1-1.html
m _* J7 _0 ]' c. u 搜外论坛原创作者：刘三土博客# D+ w4 r# H- g0 D% E
日期：2015-08-22
+ f- K; b: T2 `- U# I) ]$ c$ I7 r | 
