Adding subscriptions.js to Your Site
An introduction to our code snippet for tracking conversions on your site. Note that this is an add-on feature, not included in all Chartbeat service plans.
Conversion is supported for websites using our tracking library (chartbeat.js or chartbeat_video.js), covered in the website tracking guide. Customers planning to use our Conversion add-on should review our Supported Conversion Flows to determine whether or not Conversion is compatible with your conversion flow.
Our subscriptions.js library is responsible for Chartbeat's main conversion tracking functionality on your sites. With subscriptions.js, you can track a user’s journey starting at a paywalled article and continuing through the moment they subscribe. Editorial, product, and subscription teams will be able to use the tool from our Conversion Dashboard and see data in the Real-Time Dashboard and Heads-Up Display. You can also access your top converting articles via the Conversion API.
Once subscriptions.js is loading on your site, you'll need to fire conversion events through the global
chartbeat() function to begin tracking your conversion flows and send key event properties to Chartbeat. There are two requirements for loading subscriptions.js on your site to begin tracking conversions.
Our conversion snippet should be loaded in the
<head> , after chartbeat.js, on all pages including articles and conversion flows. <!-- Chartbeat Conversion -->
<script type="text/javascript">
(function(w,d,s,c,u){
var qf=function(e,a){(w[c].q=w[c].q||[]).push([e,a]);};w[c]=w[c]||qf;
var st=d.createElement(s);
var fs=d.getElementsByTagName(s)[0];
st.async=1;st.src=u;fs.parentNode.insertBefore(st,fs);
})(window,document,'script','chartbeat','https://static.chartbeat.com/js/subscriptions.js');
</script>
<!-- End Chartbeat Conversion -->
The conversion snippet must be loaded after chartbeat.js
Call the global
chartbeat() function to track conversion events when they occur with optional parameters. Events fired after the subscriptions.js script loads will be tracked, and any fired before will not be tracked by Chartbeat.See our Conversion Events to find the full list of the event methods to pass to the
chartbeat() function.chartbeat('event_name', { // CHANGE THIS TO THE SUPPORTED EVENT YOU WANT TO TRACK
pathOverride, // optional
eventLabel, // optional
eventValue, // optional
} );
Only events fired after the subscriptions.js script loads will be tracked
Here's an example of our standard web tracking snippet with the conversion snippet included:
<script type='text/javascript'>
(function() {
/** CONFIGURATION START **/
var _sf_async_config = window._sf_async_config = (window._sf_async_config || {});
_sf_async_config.uid = #####; //CHANGE THIS TO YOUR ACCOUNT ID
_sf_async_config.domain = 'domain.com'; //CHANGE THIS TO YOUR SITE ID
_sf_async_config.useCanonical = true;
_sf_async_config.useCanonicalDomain = true;
_sf_async_config.sections = ''; //SET PAGE SECTION(S)
_sf_async_config.authors = ''; //SET PAGE AUTHOR(S)
/** CONFIGURATION END **/
function loadChartbeat() {
var e = document.createElement('script');
var n = document.getElementsByTagName('script')[0];
e.type = 'text/javascript';
e.async = true;
e.src = '//static.chartbeat.com/js/chartbeat.js';
n.parentNode.insertBefore(e, n);
}
loadChartbeat();
})();
</script>
<!-- Chartbeat Conversion -->
<script type="text/javascript">
(function(w,d,s,c,u){
var qf=function(e,a){(w[c].q=w[c].q||[]).push([e,a]);};w[c]=w[c]||qf;
var st=d.createElement(s);
var fs=d.getElementsByTagName(s)[0];
st.async=1;st.src=u;fs.parentNode.insertBefore(st,fs);
})(window,document,'script','chartbeat','https://static.chartbeat.com/js/subscriptions.js');
</script>
<!-- End Chartbeat Conversion -->
Currently, tracking conversions is only supported for our standard website tracking integration. Though we offer unique visitor tracking integrations for native apps (along with AMP), we cannot provide conversion tracking for these separate platform integrations at this time.
If you are a current customer and this functionality is important to your team, we'd like to hear from you! Shoot us a note at [email protected].
Sites that are using our cookieless tracking or cookieDomain variable are also not supported at this time.
The next page of this guide covers the full list of conversion events available for your team to send to the Conversion tool.
Last modified 3mo ago