Download the plugin

I’ve incorporated the code from this article into a plugin which you can download from the plugins directory. Install and activate this on your site and you can start tracking ecommerce data almost immediately. If you prefer just to grab the code to use in your own project or for more information on setting up tracking in Google Analytics, then read on.

The plugin will work with Easy Digital Downloads or with WooCommerce. Through this article I’ll use EDD as the primary example and cover WooCommerce in a separate post – but most of the information here applies equally to both plugins.

Overcoming my fear of Google Analytics

I love charts and graphs as much as the next person – I really do. I find trawling through datasets to see what can be discovered a genuinely enjoyable pastime. But I freely confess to finding Google Analytics monstrous and intimidating. I’m never entirely sure what I’m doing with various filters, segments, and the seemingly constantly changing interface; and there seem to be so many views and levels that it’s just confusing. For this reason, I’ve always been cautious about getting involved with setting up complex tracking. But not any more…

What is ecommerce conversion tracking?

According to the Google Analytics guide:

Ecommerce tracking allows you to measure the number of transactions and revenue that your website generates

Conversion tracking allows you to monitor what happens when a user performs an action on your site such as making a purchase. The site feeds the data back to Google Analytics.

Tracking can also incorporate advertising your site on networks like Google Ads or Facebook but for the purposes of this article, we’re keeping it simple and just concentrating on ecommerce tracking with GA.

What are the benefits of ecommerce tracking?

For me, it seems that the single most important benefit of ecommerce tracking is to help you establish what channels are your most profitable. By this, I mean that you might find that you get most of your traffic from organic search but most of your sales from newsletters; or you might find that certain types of blog posts result in generating more sales than others. Knowing this kind of information means you can decide where best to focus your efforts on improving sales.

What ecommerce data gets tracked?

For each order that gets placed on your site, the plugin will send back the following transaction details:

• Transaction ID
• Store name
• Order total

Then for each item in the order, it will also send the following data:

• Transaction ID
• Product name
• Product SKU
• Product category
• Product price
• Quantity

Setting up ecommerce tracking in Google Analytics

To get things started, we need to brave the beast that is Google Analytics and enable a couple of settings.

Google Analytics goals

First, we need to create a goal in Analytics. Goals can mean several things, but in our case a completed goal is when a user makes a successful purchase. In Easy Digital Downloads when a user successfully makes a purchase, they’re directed to the Purchase Confirmation page. This means that we can set the Purchase Confirmation page as a goal – if a user lands on that page, it means they’ve bought a product and therefore we’ve achieved our goal.

WooCommerce uses endpoints, meaning that the user is directed to a thank you page which will include an extra order-received element within its URLs.

Creating a goal in Google Analytics

To set your Purchase Confirmation page as a goal, log into your Google Analytics account and click on the Admin button. At the moment, that’s down in the bottom left.

From the Administration view, click on Goals in the third column.

Click the red ‘+ New Goal’ button

Give your goal a name – I recommend something sensible like ‘Purchase Confirmation page’.

Under ‘Type’, select ‘Destination’.

Click the blue ‘Continue’ button

Under Goal Details, choose ‘Begins with’ in the ‘Destination’ field. This is where we will enter the URL of our Purchase Confirmation page. Assuming you haven’t altered this since activating Easy Digital Downloads, you just need to enter /checkout/purchase-confirmation in this field. If you are using WooCommerce, you should enter /checkout/order-received/.

Click ‘Save’.

Set up ecommerce tracking for your site

With your goal successfully created, you can enable ecommerce tracking for your site. From the Goals page, click on Ecommerce Settings.

Under Enable Ecommerce, ensure the Status button is toggled to ‘On’. Click ‘Next Step’ then click ‘Submit’.

Adding tracking code to your own site

Adding the necessary code to your site is the easiest bit. If you’re using the plugin, just install and activate it. You can enter your Google Analytics Tracking ID in Settings > Ecommerce Conversion or, if you’re already using a Google Analytics plugin like Monster Insights, the plugin will automatically start working.

If you’re not using the plugin, you can add the following code:

/**
 * Add conversion script for Google Analytics
 * @since 1.0.0
 */
function ect_ga_conversion_script() {
 // Check we're on the purchase confirmation page
 if ( ! edd_is_success_page() ) {
  return;
 }
 global $edd_receipt_args;
 $payment = get_post( $edd_receipt_args['id'] ); // Post data for payment ID
 $meta = edd_get_payment_meta( $payment->ID ); // Meta data about the transaction
 // Get the payment_key
 if ( isset( $_GET[ 'payment_key' ] ) ) {
  $payment_key = $_GET[ 'payment_key' ];
 } else if ( isset( $edd_receipt_args['payment_key'] ) ) {
  $payment_key = $edd_receipt_args['payment_key'];
 } else if ( isset( $meta['key'] ) ) {
  $payment_key = $meta['key'];
 } else {
  // Key not set
  return;
 }
 // Get some transaction data
 $payment_obj = new EDD_Payment( $payment->ID );
 $total = $payment_obj->total;
 if( isset( $meta['cart_details'] ) ) {
  $cart_items = $meta['cart_details'];
 }
 // Monster Insights changes the ga variable name
 if( function_exists( 'MonsterInsights' ) ) {
   $ga = '__gaTracker';
 } else {
   $ga = 'ga';
 }
 /**
  * Now add the script
  * @link https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce
  */ ?>
  <script>
   <?php echo esc_js( $ga ); ?>('require', 'ecommerce');
   <?php echo esc_js( $ga ); ?>('ecommerce:addTransaction', { 'id': '<?php echo esc_attr( $payment_key ); ?>', 'affiliation': '<?php bloginfo( "name" ); ?>', 'revenue': '<?php echo esc_attr( $total ); ?>', });
   <?php // Add item data for each item in the cart
   foreach( $cart_items as $key => $product ) {
    echo esc_js( $ga ) . "('ecommerce:addItem', {
     'id': '" . esc_attr( $product["id"] ) . "',
     'name': '" . esc_attr( $product["name"] ) . "',
     'sku': '" . esc_attr( edd_get_download_sku( $product["id"] ) ) . "',
     'price': '" . esc_attr( $product["item_price"] ) . "',
     'quantity': '" . esc_attr( $product["quantity"] ) . "'
    });\n";
   } ?>
   <?php echo esc_js( $ga ); ?>('ecommerce:send');
  </script>
  <?php
}
add_action( 'wp_footer', 'ect_ga_conversion_script' );

This function:

• Checks we’re on the Purchase Confirmation page
• Grabs the payment and other transaction data, including all the items in the cart
• Checks whether Monster Insights is enabled: for some reason, Monster Insights changes the Google Analytics object variable name
• Adds the script to the footer. The script passes the transaction data plus data for each item in the cart

How long does it take for data to be recorded?

The data normally takes around 24 hours to hit Google Analytics.

Where do you find the data?

To start viewing the data, head back to Google Analytics. In the left hand menu, click on Conversions then on Goals. For a useful view of which channel is creating the most value for you, click on Acquisition then Overview.

What do you do with the data?

That’s the big question. I’ll be following up with some observations from my own experiences soon.

The post Adding ecommerce tracking to Easy Digital Downloads appeared first on Plugin Republic.

I wanted to do something like the image below – namely, give the user a dropdown box they could use to sort products in different ways, the kind of thing you see on most online stores.

Not being able to find anything, I put together a short plugin that adds a select box to download pages that will modify the query and allow the user to sort products by different parameters. You can download the plugin here or follow the instructions below to build your own.

All the code does is filter the EDD [downloads] shortcode in a couple of places, firstly to modify the query parameters and secondly to add a dropdown box to the list of products. The user can select an option from the dropdown, e.g. ‘Newness’, and the products will now be sorted according to date published. Change the selection to ‘Price (lowest to highest)’ and the products will be listed with the cheapest first.

The code is as follows. You can add it to your functions.php file or other suitable location:

/**
 * Get the parameters for ordering that we'll include in our select field
 * 
 * @since 1.0.0
 * @return Array
 */
function sp_edd_orderby_params() {
  $params = array( 
    'newness_asc' => array( 
      'id' => 'newness_asc', // Unique ID 
      'title' => __( 'Newest first', 'sp-for-edd' ), // Text to display in select option 
      'orderby' => 'post_date', // Orderby parameter, must be legit WP_Query orderby param 
      'order' => 'DESC' // Either ASC or DESC
    ),
    'newness_desc' => array(
      'id' => 'newness_desc',
      'title' => __( 'Oldest first', 'sp-for-edd' ),
      'orderby' => 'post_date',
      'order' => 'ASC'
    ),
    'price_asc' => array(
      'id' => 'price_asc',
      'title' => __( 'Price (Lowest to Highest)', 'sp-for-edd' ),
      'orderby' => 'meta_value_num',
      'order' => 'ASC'
    ),
    'price_desc' => array(
      'id' => 'price_desc',
      'title' => __( 'Price (Highest to Lowest)', 'sp-for-edd' ),
      'orderby' => 'meta_value_num',
      'order' => 'DESC'
    ),
    'title_asc' => array(
      'id' => 'title_asc',
      'title' => __( 'Title (A - Z)', 'sp-for-edd' ),
      'orderby' => 'title',
      'order' => 'ASC'
    ),
    'title_desc' => array(
      'id' => 'title_desc',
      'title' => __( 'Title (Z - A)', 'sp-for-edd' ),
      'orderby' => 'title',
      'order' => 'DESC'
    )
  );
  $params = apply_filters( 'sp_edd_filter_orderby_params', $params );
  return $params;
}

The block of code above just creates an array of parameters that we’ll use for the dropdown box and for modifying the query.

/**
 * Filter the [downloads] query
 * @since 1.0.0
 * @param $query The query to filter
 * @param $atts The shortcode atts
*/
function sp_edd_filter_query( $query, $atts ) { 
  // We're going to modify the order and orderby parameters depending on variables contained in the URL
  if( isset( $_GET['sp_orderby'] ) ) {
    // If a orderby option has been set, get the array of parameters
    $params = sp_edd_orderby_params();
    $orderby = $_GET['sp_orderby'];
    // Check the parameter that we've chosen exists
    if( isset( $params[$orderby] ) ) {
      $param = $params[$orderby];
      // Set the query parameters according to our selection
      $query['orderby'] = esc_attr( $param['orderby'] );
      $query['order'] = esc_attr( $param['order'] );
      if( strpos( $param['id'], 'price' ) !== false ) {
        // Specify meta key if we're querying by price
        $query['meta_key'] = 'edd_price';
      }
    }
  }
// Return the query, with thanks
return $query;
}
add_filter( 'edd_downloads_query', 'sp_edd_filter_query', 10, 2 );

This is our function to filter the original downloads query from the shortcode. We check if an sp_orderby parameter has been set and, if so, we use it to update some of the query arguments, notably orderby and order. If the parameter is price-based, we also set a meta_key parameter.

/**
 * Filter the [downloads] shortcode to add dropdown field 
 * @since 1.0.0
 * @param $display The markup to print
*/
function sp_edd_add_dropdown( $display ) {
  $orderby = '';
  // Get the current parameter
  if( isset( $_GET['sp_orderby'] ) ) {
    $orderby = $_GET['sp_orderby'];
  }
  // Get the array of parameters
  $params = sp_edd_orderby_params();
  $select = '';
  if( ! empty( $params ) ) {
    // Build the select field
    $select = '<form class="sp-edd-sorting">';
    $select .= '<select class="sp-orderby" name="sp_orderby">';
    // Iterate through each parameter to add options to the select field
    foreach( $params as $param ) {
      $select .= '<option value="' . $param['id'] . '" ' . selected( $param['id'], $orderby, false ) . '>' . $param['title'] . '</option>';
    }
    $select .= '</select>';
    $select .= '</form>';
    // Add a script to submit the form when a new selection is made
    $select .= '<script>
      jQuery(document).ready(function($) {
        $(".sp-orderby").change( function(){
          $(this).closest("form").submit();
        });
      });
    </script>';
    // Add the select field to the top of the downloads grid
    $display = $select . $display;
  }
  return $display; 
}
add_filter( 'downloads_shortcode', 'sp_edd_add_dropdown', 10, 1 );

This function filters the downloads shortcode markup and adds a select field above the product listing. We use the sp_edd_orderby_params function to get our list of parameters then add them one by one to the select. The select is wrapped in a form so we use a small bit of jQuery to submit the form whenever the user selects a new value.

Remember: this will only work with the [downloads] shortcode, not on archive or taxonomy pages.

The post Product Sorting for Easy Digital Downloads appeared first on Plugin Republic.

What this can mean is that a user might click on the Checkout link in the main navigation menu when they haven’t yet added the product to the cart. By default, Easy Digital Downloads just shows a simple message in this situation:

It’s fine as far as it goes: it’s factually accurate but doesn’t provide the user with any further options. (The default WooCommerce checkout page adds a ‘Return to Store’ button if there’s nothing in the cart). However, rather than just add a link back to the homepage, I thought it would be better to add a widget area to this page that would allow me to be more flexible with additional content – notably, I wanted to add the option for the user to add the product to their cart direct from this page without needing to go elsewhere on the site.

In the theme’s functions.php file, I registered a new widget area specifically for the empty checkout page:

function singularity_widgets_init() {
  register_sidebar( array(
   'name' => esc_html__( 'EDD Empty Checkout Page', 'singularity' ),
   'id' => 'empty-checkout-page',
   'description' => esc_html__( 'Add widgets here.', 'singularity' ),
   'before_widget' => '<section id="%1$s" class="widget %2$s">',
   'after_widget' => '</section>',
   'before_title' => '<h5 class="widget-title">',
   'after_title' => '</h5>',
  ) );
}
add_action( 'widgets_init', 'singularity_widgets_init' );

(Note that I’m using a theme I’ve developed myself so I’m happy adding this to the functions.php file. If you’re using a commercial theme, you should probably be using a child theme.)

Because EDD is well coded it was easy to find a hook – edd_cart_empty – that I could use to add the widget area. Note that this hook only fires if the checkout page is empty – we don’t want to display this additional content when the user has a product in their cart.

function singularity_add_widget_to_checkout() {
  dynamic_sidebar( 'empty-checkout-page' );
}
add_action( 'edd_cart_empty', 'singularity_add_widget_to_checkout' );

Now, there’s a new widget area available on the page when the checkout is empty. I added the Download Details widget and now the user can purchase the product direct from the empty checkout page.

Of course, you can add any content here you want. It just seemed that the purchase shortcode was the most natural – especially on a site selling just one product.

EDD Empty Cart

You could, as it turns out, use the EDD Empty Cart plugin to achieve something similar – though this particular extension doesn’t include a widget area.

The post Add content to empty EDD checkout page appeared first on Plugin Republic.

In my ongoing quest to make plugin files as neat as possible, I added the updater code snippet in one of the plugin files, not in the main plugin file. Testing this out, I found that available updates weren’t being picked up by sites that had my plugin installed. Moving the constants and the code snippet to the bottom of my main plugin file fixed the problem.

All this is implicit (I think) in the guidance but it took me a while to figure out that it’s crucial. The code snippet makes use of __FILE__ which should be pointing to the main plugin file. If you wanted to move the code snippet to another page within the plugin, you’d need to set a constant that pointed back to the main plugin file.

The post Updates not available with EDD Software Licensing appeared first on Plugin Republic.