Social Sharing
      Back to home
      1. Help Center
      2. Track Goals
      3. Social Sharing

      Add and Track Social Sharing Buttons

      THIS ARTICLE WILL HELP YOU:

      Introduction

      Convert Experiments allows you to add social media elements to your pages such as Facebook "Like" buttons, Twitter "Follow" buttons, and Google "+1" buttons. This guide will show you how to (i) add these elements to your website using the Convert Visual Editor and how to (ii) track these social media elements e.g. "Facebook likes" as a goal.

      For sake of simplicity we will use the "Facebook likes" in the steps described below.

      Get the Facebook App ID (Optional)

      You can also track Facebook social interactions in Convert Experiments, without having the Facebook App ID. However, we recommend to have this App ID before continue to the next steps as it has many advantages beyond social tracking.

      1. Login to your Facebook account.
      2. Go to https://developers.facebook.com/apps and then click "Add a new app" button.



      3. Type the name of your new App and then click on "Create App ID".
      4. Then you have to fill in several "Settings" (Platform, Website URL, logo, etc.).
      5. Click on the "App Review" menu and switch the toggle button to Yes to make your app
        public.


      Now your Facebook App is available to public.

      Install Facebook SDK for Javascript in your Website

      Once you have your Facebook App ID, you need to install Facebook Javascript SDK in your website, in order to track Facebook Events in Convert Experiments.

      1. Go to https://developers.facebook.com/docs/plugins/like-button.
      2. Pick the URL of a website or Facebook Page you want to use with the like button.
      3. Paste the URL to the code configurator and adjust settings like the width of your like button. Click the Get Code button to generate your like button code. 
      4. You will see code similar to this:



      5. Follow instructions for step 1 to add the Facebook Javascript SDK to your website.

      Add Social Button to your Website

      You can skip this step if you already have a social button added to your website.

      Go to your experiment and edit it in Visual Editor. Once there, you can create the button in your desired style and retrieve the necessary code from Facebook.

      1. Select and Element with the Visual Editor
      2. The menu will open where you have to Edit HTML
      3. Add the new code from Facebook for the plugin you want your visitors to like:



      4. Here the Like button has been added:

      Install Facebook Social Interaction Tracking Code

      Before you track any likes and dislikes in Convert Experiments, you first need to capture them. You can capture these events by using a method called FB.Event.subscribe(). This method is used to subscribe to a Facebook event and to define a callback function.

      Add this code in your website and replace the event with what you want. Facebook events are available here. GOAL_ID is the Convert Goal ID from the Javascript goal that you will create in the next step.

       
      <script>
      window.fbAsync.Init = function(){
         FB.Event.subscribe('edge.create', function(response) 
           { 
              window._conv_q = window._conv_q || []; 
             _conv_q.push(["triggerConversion", "GOAL_ID"]); 
           } 
        );
      };
      </script>

      If you are loading the Facebook API asynchronously, this code should live in the window.fbAsyncInit function as described on the Facebook JavaScript API documentation page. If you are loading the Facebook API synchronously, this code should live somewhere on the page after the Facebook API JavaScript file has been loaded so that we can ensure the FB object is defined.

      Create Convert JS goal 

      You need to create a JS goal. Give it a descriptive name e.g. Facebook Likes and get the goal ID (to replaced the code in previous step):

      View Conversions in Convert Report

      Once you've added this code to your page and add the goal to your experiment, Convert will begin tracking Like conversions immediately for running experiments.