Code Examples

From ClickTale Wiki
Jump to: navigation, search

These code examples, tips and explanations can help get the most from your investment in ClickTale analytics.

  1. Standard Tracking Code 
    <!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script type="text/javascript">
if(document.location.protocol!='https:')
  document.write(unescape("%3Cscript%20src='http://s.clicktale.net/WRc4.js'%20type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
if(typeof ClickTale=='function') ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
</script>
<!-- ClickTale end of Bottom part -->
  2. HTTPS enabled Tracking Code 
    <!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script type='text/javascript'>
document.write(unescape("%3Cscript%20src='"+
 (document.location.protocol=='https:'?
  'https://clicktale.pantherssl.com/':
  'http://s.clicktale.net/')+
 "WRc4.js'%20type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var ClickTaleSSL=1;
if(typeof ClickTale=='function') ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
</script>
<!-- ClickTale end of Bottom part -->
  3. FetchFromWithCookies 
    <!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script type="text/javascript">
if(document.location.protocol!='https:')
  document.write(unescape("%3Cscript%20src='http://s.clicktale.net/WRc4.js'%20type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
ClickTaleFetchFromWithCookies.setFromCookie(/^ASPSESSIONID.*/);
// add a similar line for each additional cookie variable
 
ClickTaleFetchFrom = ClickTaleFetchFromWithCookies.constructFetchFromUrl();
 
if(typeof ClickTale=='function') ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
</script>
<!-- ClickTale end of Bottom part -->
  4. ASP.NET Integration Module inc. HTTPS - ClickTaleScripts.xml 
    <?xml version="1.0" encoding="utf-8" ?>
<scripts>
<script name="Top" DoNotReplaceCondition = "(&lt;!-- ClickTale Top part --&gt;)">
<![CDATA[<!-- ClickTale Top part -->
<script type="text/javascript">
var WRInitTime=(new Date()).getTime();
</script>
<!-- ClickTale end of Top part -->]]>
</script>
<script name="Bottom" DoNotReplaceCondition = "(&lt;!-- ClickTale Bottom part --&gt;)">
<![CDATA[<!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script type='text/javascript'>
document.write(unescape("%3Cscript%20src='"+
(document.location.protocol=='https:'?
'https://clicktale.pantherssl.com/':
'http://s.clicktale.net/')+
"WRc4.js'%20type='text/javascript'%3E%3C/script%3E"));
</script>
<script type='text/javascript'>
ClickTaleFetchFrom="http://%RootPath%/ClickTaleCache.ashx?t=%CacheToken%";
var ClickTaleSSL=1;
if(typeof ClickTale=='function') ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
</script>
<!-- ClickTale end of Bottom part -->]]>
	</script>
</scripts>
  5. PHP Integration Module (HTTP only) - ClickTaleScripts.xml 
    <?xml version="1.0" encoding="utf-8" ?>
<scripts>
  <script name="Top" DoNotReplaceCondition = "&lt;!-- ClickTale Top part --&gt;">
    <![CDATA[
<!-- ClickTale Top part -->
<script type="text/javascript">
var WRInitTime=(new Date()).getTime();
</script>
<!-- ClickTale end of Top part -->]]>
  </script>
  <script name="Bottom" DoNotReplaceCondition="&lt;!-- No ClickTale --&gt;" InsertBefore="&lt;!-- ClickTale Bottom part Here --&gt;|&lt;/body&gt;">
    <![CDATA[<!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script type="text/javascript">
if(document.location.protocol!='https:')
  document.write(unescape("%3Cscript src='http://s.clicktale.net/WRb.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
ClickTaleFetchFrom="%FetchFromUrl%";
if(typeof ClickTale=='function') ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
</script>
<!-- ClickTale end of Bottom part -->]]>
  </script>
</scripts>
  6. Selective Recording with PHP Control Script 
    <!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script src="ClickTaleControl.php" type="text/javascript"></script>
<script type="text/javascript">
if(typeof ClickTale=='function') ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
</script>
<!-- ClickTale end of Bottom part -->
  7. Selective Recording with PHP Control Script - HTTPS Enabled 
    <!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script src="ClickTaleControl.php" type="text/javascript"></script>
<script type="text/javascript">
var ClickTaleSSL=1;
if(typeof ClickTale=='function') ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
</script>
<!-- ClickTale end of Bottom part -->
  8. J2EE Integration Module inc. HTTPS - ClickTaleScripts.xml 
    <?xml version="1.0" encoding="utf-8" ?>
<!-- Put this in the root of the web site -->
<scripts>
  <script name="Top">
    <![CDATA[
<!-- ClickTale Top part -->
<script type="text/javascript">
var WRInitTime=(new Date()).getTime();
</script>
<!-- ClickTale end of Top part -->
]]>
</script>
<script name="Bottom" DoNotReplaceCondition="&lt;!-- No ClickTale --&gt;" InsertBefore="&lt;!-- ClickTale Bottom part Here --&gt;|&lt;/body&gt;">
<![CDATA[
<!-- ClickTale Bottom part -->
<div id="ClickTaleDiv" style="display: none;"></div>
<script type='text/javascript'>
document.write(unescape("%3Cscript%20src='"+
(document.location.protocol=='https:'?
'https://clicktale.pantherssl.com/':
'http://s.clicktale.net/')+
"WRc4.js'%20type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
if(typeof ClickTale=='function')
{
var ClickTaleSSL=1;
ClickTaleFetchFrom="http://%RootPath%/ClickTaleCache?h=%CacheToken%";
ClickTale(PROJECTID,RECORDINGRATIO,"PARTITIONID");
}
</script>
<!-- ClickTale end of Bottom part -->
]]>
  </script>
</scripts>
  9. Using jQuery to simulate clicks on hidden items 
    jQuery("#menu > li").click(function(){
    ClickTaleExec("jQuery(\"#" + jQuery(this).find("a").attr("id") + "\").trigger(\"click\")");
});
    jQuery("#nav > li").mouseover(function () {
    var len = jQuery(this).prevAll("li").length;
    var code = "jQuery(jQuery('#nav > li')[" + len + "]).addClass('over')";
    if (typeof ClickTaleExec == "function") {
        ClickTaleExec(code);
    }
});
  10. Overcoming click propagation issues
    Original(propagation prevented): 
    jQuery(document).ready(function() {
        for(var nav in subnavs) {
            jQuery('#a_'+subnavs[nav]).click(function() {
            showSub(String(this.id).substring(2));
            return false;
            });
       }
});

    New (propagation allowed): 

    jQuery(document).ready(function() {
        for(var nav in subnavs) {
            jQuery('#a_'+subnavs[nav]).click(function(event) {
            showSub(String(this.id).substring(2));
            event.preventDefault();
            });
       }
});
  11. Preventing the browser back/refresh function causing postback to repopulate sensitive form fields 
    <!-- ClickTaleExcludeBlock -->
<input id="Sensitive_Field_1" class="Field" type="text" maxlength="11" value="32" name="Sensitive">
<!-- EndClickTaleExcludeBlock <input id="Sensitive_Field_1a" class="Field" type="text" maxlength="11" name="Sensitive"> -->
    Note: The ClickTale Top section of Tracking Code will remain the same
Retrieved from "http://wiki.clicktale.com/index.php?title=Code_Examples&oldid=2908"
Personal tools