Redirect Ecwid Paypal Orders to Custom “Thank You” Page

[box type=”note”]Update: Ecwid has added this post to their knowledge base and I’ve been getting a lot of traffic to this post. Your question or concern might not be covered here so if you want help or would like to hire me to assist with your Ecwid store email me steve@stevestruemph.com or call at 573-289-0090.[/box]

I recently needed to add Google Ad Words tracking code to a web page of a WordPress website running the Ecwid e-commerce software. There’s an easy way to do this and a more custom approach that gives you control of the URL. I wanted to share my techniques for both approaches. I’m sure there are other ways to approach this so feel free drop me a line in the comments section below.

First, I recommend that you enable Auto Return in Paypal. Login to Paypal, go to “Profile → More Options → My selling tools → Website Preferences” page. The return URL will be http://app.ecwid.com/paypalstandard/STOREID where STOREID is your numerical Ecwid store id. This number is found in your Ecwid dashboard.

The easiest way to add conversion tracking to your “Thank You” page is to place your Conversion Tracking Code by adding it in your Ecwid store settings. In Ecwid you will go to the “System Settings → General → Cart” page and find the “Checkout options” section. Then enable the “Affiliate code on “Thank you for your order” page” option and paste your tracking code into the window.

The customer is sent to Paypal’s website to complete checkout. Once the transaction is successful they are taken back to your website to a page that is generated by Ecwid. This page, a “Thank you for order” page with the tracking code, displays details of the purchase.

The URL for this Ecwid generated thank you page is different with each order, for example, you may see a URL like this: www.yourwebsite.com/shop/?ecwid_product_id=77577575#!/~/orderConfirmation

A Unique Url for the Tracking Code

If you need a static URL for this tracking code this is where things get a little trickier.

1. Go back to Ecwid Dashboard →  System Settings → Cart and disable “Affiliate code on “Thank you for your order” page”.
2. Create a new page template in your WordPress theme. Download and make a copy of your “page.php” file. Rename it something like “page-template-thank-you-tracking.php”. After the opening < $php tag add the following and name the template. You can use any name, the name will show up in the page templates list when editing a page in the WordPress Dashboard:
   /**
   * Template Name: Thank You Tracking
   */

   Then paste in your tracking code from Google AFTER the body tag. Get the simple HTML tracking code from Google Ad Words. Save your custom page template file and upload it to the root of your WordPress theme folder.

3. Create a “Thank You” page in WordPress. For this step, simply add a new page in the WordPress Dashboard the same as you would any other page except you will choose your custom page template. Add some content that you want the customer to see after they complete their order and publish the page. Note: This page should not be included in any of your website’s nav menus.
4.  In a later step we will add Ecwid code to a page directly in the page editor. But first you will need to add a “preserve” shortcode to  Wordpress to prevent it from filtering out some characters. Follow the instructions here to add some simple code to the Functions file. Once you have this in place you can place code in the editor, in HTML mode, and wrap it with the shortcode: <div class=”code”>[preserve][/preserve]</div>
5. Assuming you are using the Ecwid WordPress plugin, you will place the redirect code underneath the Ecwid shortcode code on your shop page with the editor set to HTML mode (rather than visual) WordPress. Wrap the redirect script in the “preserve” shortcode.
   The Ecwid Shortcode:
   [ecwid_script] [ecwid_minicart] [ecwid_searchbox] [ecwid_categories] [ecwid_productbrowser]

   The Ecwid Redirect Script. Note: Replace the “confirmationPageURL” with the link to your custom thank you page:

   <script>
   var confirmationPageURL = “https://www.yourwebsite.com/shop/thankyou”;
   // Add handler for Ecwid’s OnPageLoad event
   if (
   typeof(Ecwid) == ‘object’
   && typeof(Ecwid.OnPageLoad) == ‘object’
   ) {
   Ecwid.OnPageLoad.add(function(page) {
   // Redirect user if needed
   if (
   typeof(page) == ‘object’
   && ‘ORDER_CONFIRMATION’ == page.type
   ) {
   window.location = confirmationPageURL;
   }
   });
   }
   </script>

At this point you should be able to run a test Paypal transaction through your Ecwid store. If everything is set up correctly you will go through the checkout process then to Paypal to complete your purchase and back to your website’s custom “thank you for your order page”. This page will contain the Google Conversion tracking code.