After a series of technical tutorials on optimising your self-hosted WordPress for performance and security, it’s time to get a bit non-technical, so starting with this one, I’ll write about optimising your WordPress site for business. That’s why it exists in the first place, right?

One of the most common mistakes site owners do is judging their website by it’s looks alone - this holds even more true with people that buy pre-made themes from one of the theme sellers out there. Granted, great design builds trust, but that alone won’t make your visitors convert; A converted visitor is the one who reached the primary goal (purpose) of your website: They completed a purchase, subscribed to newsletter, submitted a contact form - all valid goals.

It’s a funnel

We call the process of when a visitor first comes to your website to completing the goal the conversion funnel. Depending on the goals that funnel may take only one simple step (like subscribing to a newsletter at the bottom of the blog post) or several complicated ones - such as with eCommerce sites; The customer needs to browse products, add them to shopping card, complete the order, pay for it, etc.

On Codeable, for example, our funnel looks like this:

  • visitor lands on our home page
  • they click a button to post their task/project
  • they fill out a form with project details
  • they receive an estimate
  • they pick a developer to work with
  • they deposit funds into our escrow service
  • after the project is done, they close it
  • they review the developer

There are quite a few steps, but unfortunately in our case, there is no way to shorten that process - after all it’s almost the same as they’d do it in person.

Every additional step increases what we call friction - mental burden imposed upon your visitor because they have to remember all previous steps in order to successfully complete the current one and anticipate/predict/guess future ones.

With increased friction your visitors start to abandon the process at various steps and it’s one of the most important improvements to monitor those drop offs and take action (either by improving copy, removing unnecessary distractive elements or simply removing the step, if possible).

Implement your funnel tracking

Before we can improve any of the steps that make our funnel, we first need to track it thoroughly. One of my favourite tools to track funnel performance (among other things) is called Mixpanel, so we’ll be using that for our tutorial (don’t worry, it’s free to get started).

Once you create an account, the guide will give you a tracking code which you need to paste into header.php, just before the </head> tag (or via a custom field that allows you to paste header scripts in).

WordPress Funnel Mixpanel code
Mixpanel tracking code instructions

As you can see on the screenshot, we’re also required to send a test event, and the best way to do that is by pasting the snippet just after the tracking code. So re-open header.php, and paste the following just after the code snippet you pasted in the previous step:

<script>
  mixpanel.track("Page visit");
</script>

Visit Mixpanel again, and you should see your first event being logged!

WordPress-Funnel-Event-tracked

Set up the events

Now that your tracking is working, remove your test event, because It’ll be triggered on every page, which is what you don’t want. Instead, make sure it only appears on your homepage (or all that you want to track as entry pages).

For the purpose of this tutorial we’re going to define our goal to be a contact form submission which is not on our landing page, so in order for the visitor to do that, they need to click a button on that page, which leads to the contact us page with the form. So the events that need to occur inside this tunnel are:

  • visitor lands on our home page
  • visitor clicks the contact us link
  • visitor clicks the submit button on the form

In order to create the conversion funnel, we first need to track all the events separately. As per Mixpanel documentation, insert the following snippet anywhere in the footer.php (as long as it comes after the HTML with items we’re tracking):

<script type="text/javascript">
  mixpanel.track_links("#mylink", "Contact form link");
</script>

You should, of course change #mylink to the ID of the link that leads to your contact form page.

Now that we’re tracking that, it’s also time to track the form itself, using this snippet (also change the id to match the one your form has):

<script type="text/javascript">
  mixpanel.track_forms("#contact-form", "Contact form submit");
</script>

Feel free to merge the two snippets and show them on all pages as both the link and the form will have unique ids so events won’t be triggered on anything else.

Configure the conversion funnel

Now that all events are being tracked, it’s time to build the funnel in Mixpanel. Visit the dashboard and click on the Funnels button. Since you’re just getting started, create a new funnel (and watch the video!) selecting the tracked events like in this screenshot:

WordPress Conversion Funnel Mixpanel Funnel setup
Mixpanel funnel setup

Note: if you don’t see the events, there are two possible problems; Either your events are not being tracked (improper tracking code implementation) or there have been no events triggered yet. If this is the case, go and complete the whole process by yourself: click the link, submit the form.

Once your funnel is saved, you should see some stats, most commonly like this:

WordPress Conversion Funnel performance
Mixpanel funnel stats

This is fake data but it shows one important phenomenon: Funnel progress can only go down each step. In an ideal world, the funnel would be a straight line, meaning every step would be a 100% success. But since we don’t live in ideal world, your main goals should be identifying steps in which your visitors abandon the process most often and improve them.

Improving the funnel

In our relatively simple scenario, you should ask yourself the following questions to improve the funnel:

  • is the link visible enough?
  • is the link positioned above the fold?
  • does the link stand out enough?
  • does the link text invite visitors to click it?
  • is the form user-friendly?
  • does the form have too much fields?
  • does the form convey value visitors are getting by submitting?
  • are the visitors even my target audience?
  • and plenty more!

While you’re in the mood of asking questions, I have a really simple trick for you; Don’t ask yourself - ask you visitors! This is the base of user experience (UX) testing (which I’ll cover in one of the upcoming tutorials) and it could not be simpler, personally visit a couple of your potential customers and ask them to visit your site and submit the form but don’t guide them through it! Instead ask them to share their thoughts in the process, observe them and write everything down.

Doing so with 5-10 people will reveal more than 80% of all problems your visitors are having inside the funnel and there’s absolutely no reason not to do it - improving the funnel improves your business, right?