Add Adwords tracking code to order confirmation page in Magento

8 Comments 8th OCT 2009 | Posted by Branko Ajzele in Magento

Adding an Adwords tracking code to order confirmation page in Magento is relatively easy task. One that can be handled under an hour or so if you choose to implement it the proper way. Here is how.

Modify the “app/design/frontend/default/my_custom_theme/layout/checkout.xml” file. Look for section

    <checkout_onepage_success>
        <reference name="root">
            <action method="setTemplate"><template>page/2columns-right.phtml</template></action>
        </reference>
        <reference name="content">
            <block name="checkout.success" template="checkout/success.phtml" type="checkout/onepage_success" />
        </reference>
    </checkout_onepage_success>

And turn it into

    <checkout_onepage_success>
        <reference name="root">
            <action method="setTemplate"><template>page/2columns-right.phtml</template></action>
        </reference>
        <reference name="content">
            <block name="checkout.success" template="checkout/success.phtml" type="checkout/onepage_success" />
        </reference>
        <reference name="before_body_end">
            <block name="google_adwords_tracking" template="checkout/google_adwords_tracking.phtml" type="core/template" />
        </reference>
    </checkout_onepage_success>

Create the “app/design/frontend/default/my_custom_theme/template/checkout/google_adwords_tracking.phtml” file and copy-paste the the Adwords tracking JavaScript code into it.

This code relies on

< ?php echo $this?>getChildHtml('before_body_end') ?>

block call from footer of each template (1column.phtml, 2columns-left.phtml, 2columns-right.phtml, 3columns.phtml). So, as long if haven’t removed this block call from mentioned templates, the above should work.

Thats it.

To post code in comments, place your code inside [code] and [/code] tags.

There are 8 comments (Add Yours +)

Alex Kirsch Says
October 9th, 2009 at 16:30

I would recommend rendering the tracking code in the page content rather then at body end.. It also is a requirement by Google AdWords that it be visible.

All themes (except iphone) include getChildHtml() ?> in success.phtml, so your child html blocks will be rendered in the page content.

so your checkout.xml file would be
bluec Says
October 11th, 2009 at 2:32

Hey,

Do you knw how to generate below values on Magento confirmation page.

For each purchased item…..iterate below values
……..getProductID()
………getProductPrice()
……..getQuantity()
Next Item in cart
quicoto Says
November 9th, 2009 at 12:00

Works, thanks.
Asbar Says
December 13th, 2009 at 17:10

i m Working with adwords for last 5 Year and finally i have made a masterpiece which contains all the solution about Adwords Soo Do me Feedback soo i can make it Better for you people to understand
Yuan Says
December 16th, 2009 at 18:54

Hi Branko,

Excellent article…

One Question:
*************************
If you wish to include more data in the template success.phtml.
What labels should I use?

*** I try to make something like this:
http://pikchurimages.s3.amazonaws.com/pic_KYQ_l.jpg

You see, i need to combine both data: existing and custom (show only if is used my extension: a payment method).

This is my layout file:

page/2columns-right.phtml

checkout.success

** This layout fail, replace completely the Success page. Only display when my payment method is selected. Currently showing all types of payment…

** The “safetypay/confirmation.phtml” template, is responsible for recover all the information of the Success page (include information for default).

Thanks friends! Wait yours comments!
Yuan Says
December 16th, 2009 at 19:02

Sorry, here my Layout code….

<?xml version="1.0"?>
<layout version="0.1.0">
<default>
</default>

<checkout_onepage_success>
<reference name="root">
<action method="setTemplate"><template>page/2columns-right.phtml</template></action>
</reference>
<reference name="content" before="-">
<action method="unsetChild"><name>checkout.success</name></action>
<block name="checkout.success" template="safetypay/confirmation.phtml" type="safetypay/confirmation" />
</reference>
</checkout_onepage_success>
</layout>
Patrick Says
January 13th, 2010 at 21:36

Great, was looking for a way to implement the new asynchronous tracking code of Google analytics in the header. Is quite easy to do now, much appreciated!
suraj Says
March 8th, 2010 at 9:40

Hello all,
I have made a payment extension and that will create a pdf after the successful checkout. for that i want to put a link in the success page so the user can download the pdf from there. how coukld i make this happen from my module itself please help …….