JS Animated. How to manage Olark Live Chat

Our Support team is ready to present you a new tutorial that shows how to manage Olark chat in your JS Animated template.

Locating chat code

1. Open your cPanel FileManager or connect to FTP.

2. Open corresponding page HTML file for editing and scroll to the bottom of the file to see chat code, similar to the example below:

     
   		<!-- begin olark code -->
   		<script data-cfasync="false" type='text/javascript'>/*<![CDATA[*/window.olark||(function(c){var f=window,d=document,l=f.location.protocol=="https:"?"https:":"http:",z=c.name,r="load";var nt=function(){
   f[z]=function(){
   (a.s=a.s||[]).push(arguments)};var a=f[z]._={
   },q=c.methods.length;while(q--){(function(n){f[z][n]=function(){
   f[z]("call",n,arguments)}})(c.methods[q])}a.l=c.loader;a.i=nt;a.p={
   0:+new Date};a.P=function(u){
   a.p[u]=new Date-a.p[0]};function s(){
   a.P(r);f[z](r)}f.addEventListener?f.addEventListener(r,s,false):f.attachEvent("on"+r,s);var ld=function(){function p(hd){
   hd="head";return["<",hd,"></",hd,"><",i,' onl' + 'oad="var d=',g,";d.getElementsByTagName('head')[0].",j,"(d.",h,"('script')).",k,"='",l,"//",a.l,"'",'"',"></",i,">"].join("")}var i="body",m=d[i];if(!m){
   return setTimeout(ld,100)}a.P(1);var j="appendChild",h="createElement",k="src",n=d[h]("div"),v=n[j](d[h](z)),b=d[h]("iframe"),g="document",e="domain",o;n.style.display="none";m.insertBefore(n,m.firstChild).id=z;b.frameBorder="0";b.id=z+"-loader";if(/MSIE[ ]+6/.test(navigator.userAgent)){
   b.src="javascript:false"}b.allowTransparency="true";v[j](b);try{
   b.contentWindow[g].open()}catch(w){
   c[e]=d[e];o="javascript:var d="+g+".open();d.domain='"+d.domain+"';";b[k]=o+"void(0);"}try{
   var t=b.contentWindow[g];t.write(p());t.close()}catch(x){
   b[k]=o+'d.write("'+p().replace(/"/g,String.fromCharCode(92)+'"')+'");d.close();'}a.P(2)};ld()};nt()})({
   loader: "static.olark.com/jsclient/loader0.js",name:"olark",methods:["configure","extend","declare","identify"]});
   /* custom configuration goes here (www.olark.com/documentation) */
   olark.identify('7830-582-10-3714');/*]]>*/</script><noscript><a href="https://www.olark.com/site/7830-582-10-3714/contact" title="Contact us" target="_blank">Questions? Feedback?</a> powered by <a href="http://www.olark.com?welcome" title="Olark live chat software">Olark live chat software</a></noscript>
   		<!-- end olark code -->

Removing chat

1. Change comments like on the example below, from

     
   		<!-- begin olark code -->
   		Chat code goes here
   		<!-- end olark code -->
   		

   to:

      
   		<!-- begin olark code 
   		Chat code goes here 
   		end olark code -->
   		

2. Alternatively, you can remove the entire code section (it starts with <!– and ends with –>):

     
   		<!-- begin olark code --> 
   		Chat code goes here 
   		<!-- end olark code -->
   		

3. Save file and refresh the page to see changes.

Editing chat

1. Edit content below the following line:

   /*custom configuration goes here (www.olark.com/documentation) */

2. Feel free to change chat id and titles here, e.g. ‘Contact us’, ‘powered by’, ‘Olark chat software’.

     
   		/* custom configuration goes here (www.olark.com/documentation) */
   olark.identify('7830-582-10-3714');/*]]>*/</script><noscript><a href="https://www.olark.com/site/7830-582-10-3714/contact" title="Contact us" target="_blank">Questions? Feedback?</a> powered by <a href="http://www.olark.com?welcome" title="Olark live chat software">Olark live chat software</a></noscript>
   		<!-- end olark code -->
   		

Adding chat

In order to add your own chat to the site pages, you should visit Olark website and Sign up for free account there to generate code for inserting. You can also refer to chat documentation. Paste it to HTML file bottom, save changes and refresh the page.

Please note that you should perform the same changes to each HTML file to apply changes to all site pages.

Feel free to check the detailed video tutorial below: