Add A Google Ads Conversion Tracking Tag To Your WordPress Website.jpg

Add A Google Ads Conversion Tracking Tag To Your WordPress Website

Outline

    Original Post

    Add A Google Ads Conversion Tracking Tag To Your WordPress Website


    Original Post

    Add A Google Ads Conversion Tracking Tag To Your WordPress Website

    For Conversions And Conversion Value Bidding Strategy

    There are several bidding strategies available in Google Ads, including conversion, conversion value, clicks, etc. If you want to choose conversions, then conversion tracking tag will be essential.

    Add Global Site Tag

    There are two parts of conversion tracking code that you have to add to your website. First is the global site tag(gtag.js), which is unique and for all conversions. The second part is the event snippet, and it should be installed for each conversion tracking.

    Both codes can be found in the Google Ads > Tools & Settings (At the right top of the page) > Conversion. Of course, you have to create a tracking conversion first.

    gtag.js will be like as below, and you have to insert it between the and tag. You can manually add it to your WordPress theme, through Google Tag Manager, or with a plugin.

    <!-- Global site tag (gtag.js) - Google Ads: xxxxxxxxx -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=AW-xxxxxxxxx"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
    
      gtag('config', 'AW-xxxxxxxxx');
    </script>

    Add Event Snippet

    After setting up the global site tag, we can take a look at the event snippet.

    <!-- Event snippet for conversion name
    In your html page, add the snippet and call gtag_report_conversion when someone clicks on the chosen link or button. -->
    <script>
    function gtag_report_conversion(url) {
      var callback = function () {
        if (typeof(url) != 'undefined') {
          window.location = url;
        }
      };
      gtag('event', 'conversion', {
          'send_to': 'AW-xxxxxxxxx/XXXXXXXXXXXXXXXX',
          'value': 10.0,
          'currency': 'TWD',
          'event_callback': callback
      });
      return false;
    }
    </script>

    In your html page, add the snippet and call gtag_report_conversion when someone clicks on the chosen link or button.

    Generally, we don’t want to track conversions on every page, so it is inappropriate to insert the event snippet to the head tag. As google official document said, you can add an onclick attribute to trigger the conversion event.

    <a onclick="return gtag_report_conversion('http://example.com/your-link');"
    href="http://example.com/your-link">Download now!</a>

    If you use Gutenberg as your WordPress editor, you can switch the block to HTML mode, then add the code. However, if you use the classic editor, or you want to add it to a WooCommerce product page, the onclick attribute will be removed automatically after saving. I guess it is for a security purpose.

    Alternatively, we can complete it with post_meta. There are two steps.

    Step 1. Add Post_Meta Between Head Tag

    Between head tag, add the php code as below. It will display blank if the post doesn’t have a post_meta named google_ads_conversion.

    <!-- Google Ads Conversion -->
    <?php
      $google_ads_conversion = get_post_meta(get_the_ID(), 'google_ads_conversion', true);
      echo $google_ads_conversion;
    ?>

    Step 2. Create A Post_Meta

    By default, admins can add a post meta on the edit page. Create it and paste the event snippet. Of course, you can name it everything, but remember to match with the post_meta key(like google_ads_conversion above).

    Another point is I added a jQuery event to trigger gtag function. Again, you can change the selector (.google_ads_link below) as you want, but remember to add a class, or id, or title in the editor to ensure it works.

    <!-- Event snippet for conversion name -->
    In your html page, add the snippet and call gtag_report_conversion when someone clicks on the chosen link or button. -->
    <script>
    function gtag_report_conversion(url) {
      var callback = function () {
        if (typeof(url) != 'undefined') {
          window.location = url;
        }
      };
      gtag('event', 'conversion', {
          'send_to': 'AW-xxxxxxxxx/XXXXXXXXXXXXXXXX',
          'value': 10.0,
          'currency': 'TWD',
          'event_callback': callback
      });
      return false;
    }
    </script>
    
    <script type="text/javascript">
    jQuery(document).ready(function($){
    	$('.google_ads_link').on('click', function(e){
    		gtag_report_conversion($(this).attr('href'));
    	})
    });
    </script>

    Related Posts

    Learn Python And R On DataCamp. Start Your Data Science Career.



    Related Posts

    A
    Aron

    工業設計系畢業,曾任職知名品牌行銷企劃,做點設計,寫文案也寫網站;目前擔任零售業數據分析師。最近開始練格鬥和Python量化投資。

    Content Protection by DMCA.com

    Leave a Reply

    • Required fields are market * .
    • Your email address will not be published.
    • Please ensure your email address is correct, then you will get a notification once a new comment reply.

    Your email address will not be published. Required fields are marked *