/ Growth Tactics

Improve Your Search Results With Structured Data (on Shopify or Other eCommerce Platforms)

The SEO Big Three

If you are running an online shop, you are likely already optimizing your website for search engines such as Google or Bing.

In 99% of these cases this means to

  • Research the right keywords for your content
  • Improve the speed of your website
  • Create backlinks to your website

While this simple recipe remains valid until today, there are little known tweaks to tempt more people to click on your organic search results and to drive conversions.

Boost Your SEO With Structured eCommerce Data

One of them is to use structured data to help search engines to understand your website better and display your search results in a better way.

You might say: ‘I am using meta titles and descriptions, what else can I do? Aren’t the search engines doing the rest?’. Well...no. Let me explain why.

How To Make People Click

If you are looking up the term ‘Pie Recipe’ in Google, you already get an idea what this bulky thing named ‘Structured Data’ is about:

Pie Recipe Search Results

If you take a closer look, you might recognize some search results look different: You can see the average rating, but also the amount of reviews and even the amount of calories. These search results are richer and therefore likely tempt more people to click as they already display information upfront.

Because these results are richer, they are called rich search results. Why is this important for eCommerce? Let us look up digital cameras:

Camera Rich Snippets Search Results

These search results also look more appealing than average because the underlying pages use structured data to tell Google what the page semantically is about:

  • Is it a product or a blog page?
  • Is the product in stock?
  • Does the product have a price?
  • Does the product have a rating?

Machine based engines like Google became ‘smarter’ over the years, but the core principles haven’t changed much. Google shows up on your page, crawls its content and then tries to find out if your page is relevant for its users.

Structured data is a way to give search engines an insight in the semantics and the context of your page using their language. It is a relatively new feature that became more and more important for eCommerce SEO.

Why? Because research has shown that pages rank better if people find them useful, e.g. when looking up a product. But there is more to it: You may even segment and target visitors coming through Google in a more efficient yet personal way (see below).

An example: Google might dismiss your page if visitors drop off quickly after they browsed your page finding out the product they were looking for is unavailable. Google and other search engines simply don’t like it when a page doesn’t match with the visitor’s expectation.

Giving search engine users as much information upfront as possible helps you to:

  • Reduce visitor exits
  • Increase your search engine rank

In this tutorial I would like to dive into all aspects of structured data SEO and how it can help you to drive more people to your online shop. We will adapt some code. However, you don’t need to have much coding background for this tutorial.

Keep in mind: While this may improve your ranking and / or organic click-through-rate, you are still focusing on one isolated channel here rather than improving each customer’s journey (we will get to this a little later).

Supported Structured Data Types For ECommerce

Unfortunately there is no single standard for structured data (yet), but you can use one of these common schemas:

  • JSON-LD
  • Microdata
  • RDFa

Google recommends JSON-LD but supports all other schemas as well. In this tutorial I am using microdata, supported by schema.org. If you are new to structured data, this is the easiest way to markup your page content in a structured and machine readable way.

Please note there is no guarantee a search engine will use the structured data provided by you to display your search result as a rich result. However, because search engines are interested in providing useful information to their users, it is somewhat likely.

I am covering microdata and Shopify here, but you can adapt this pattern for almost any other eCommerce platform such as Magento or WooCommerce. Shopify themes can be very different, too. You might even have to ‘transpose’ this tutorial to your theme.

Test Your Online Shop’s Structured Data

Before we are going to look at your code, you might want to check if your platform already supports structured data. In most cases it does, but especially Shopify themes often lack of a proper support making tweaks necessary.

You can test your markup by using Google’s Structured Data Testing Tool to see if Google (and any other search engine) can read the structured data properly. Just enter a product page and you will get to see which structured data objects can be retrieved:

Google Rich Result Structured Data Tester

On the right side you can see the actual HTML code from the page you looked up. On the left side you see all structured data items Google can identify. In case of a product page, at least product name and price should appear. If not, you might want to adapt your theme code.

There are many properties available for a product using microdata, the most important you might want to use are:

  • brand
  • category
  • color
  • depth
  • height
  • logo
  • manufacturer
  • material
  • review
  • Sku
  • offers
  • description
  • image
  • name

Please note that a property itself can have properties. I am going to explain this below.

Using Structured Data for Shopify SEO

I am using Shopify here as an example. If you don’t know Shopify yet, it is an e-commerce platform for online stores and retail point-of-sale systems making it very easy to set up your own online shop in minutes. It offers a great online community as well as hundred of shop themes and plugins.

If you are using another platform, you may skip the next step and just open your product page theme code in your CMS.

Where To Find Structured Data in Shopify?

Adapting code in Shopify can be tricky, as there are many themes available. However, Shopify relies on some standards and files are organized in a certain way.

I am using a Shopify store from one of our clients here. To get to the product template, please do the following steps after logging into your store:

Shopify adapt theme product template

  • Click on ‘Online Store’
  • Click on ‘Customize’ on the right (theme section)
  • Click on ‘Edit Code’ on the left bottom (‘Theme actions’ panel)
  • Select ‘product-template.liquid’

The product-template.liquid file contains all major information on how to display a product page in Shopify.

How to Adapt And Tweak Your Shopify Theme?

Microdata is the easiest way of structuring your page data because you simply can add extra tags and attributes to your HTML elements. You are literally labelling these elements, e.g. by saying ‘this element represents a price section’ or ‘this element contains the product name’.

A product section in Shopify usually looks like this:

<div class=”Product Section”>
<header>
<h1 class=”Title”>{{ product.title }}</h1>
</header>
<div class="Product Content">
[...]
</div>
</div>

You first need make sure the whole product section containing all relevant product information is marked up as a product. In my case the theme added the microdata correctly, but in case it is missing you would need to add it to the top-level div container:

<div class=”Product Section” itemscope itemtype="http://schema.org/Product">
[...]
</div>

By adding itemscope and itemtype you define an area where properties of an object (e.g. ‘Product’) are valid. After we have defined the product scope, we can add more properties to elements nested in the top-level container:

<div class=”Product Section” itemscope itemtype=”http://schema.org/Product”>
<header>
<h1 class=”Title” itemprop=”name”>{{ product.title }}</h1>
[...]
</div>

Now we have declared what the product title is. Please note you can only use properties that are valid for a certain schema, all other properties are ignored by Google and other search engines. Therefore it is recommended to again run a test after you have adapted your code to verify your changes are interpreted correctly.

If you want to markup the product price, you need to define an itemscope for the type Offer before, as the price is a property of ‘Offer’. You can easily nest scopes, but please be careful to follow schema’s structure.

The price section without markup looks like this in my case:

<div>`` <span id="ProductPrice-{{ section_id }}" class="product__price{% if current_variant.compare_at_price > current_variant.price %} on-sale{% endif %}" content="{{ current_variant.price | divided_by: 100.00 }}">
{{ current_variant.price | money }}
</span>
</div>

To make the price readable for search engines, I would need to add the following scopes:

<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span id="ProductPrice-{{ section_id }}" itemprop="price" class="product__price{% if current_variant.compare_at_price > current_variant.price %} on-sale{% endif %}" content="{{ current_variant.price | divided_by: 100.00 }}">
{{ current_variant.price | money }}
</span>
</div>

As you can see, an element can be both, a property of a item (“offers”) and an itemtype scope (“Offer”).

Your Search Results Drive Traffic - All Good?

You use SEO to drive traffic to your website. While this is definitely a good strategy, you are only optimizing your organic traffic channel instead of individual user flows.

What does that mean? Because multi-channel marketing is complex, many marketers focus on improving their existing channels and tend to forget about the big picture. They strengthen channels which prove to be successful, but: Is it really about the channels? Shouldn’t the individual visitor be the center of any marketing effort?

Optimize Your User Flows, Not Your Channels

Visitor personalization means to put marketing back on its feet. What matters most is giving the right response to a specific user at the right time. Not the search engines you optimize for nor the tools you use should restrict this response, but rather where your user is at during the individual decision making process.

Let me explain this...

Where Are My Users?

The above question can be answered in a simple and a sophisticated way.

The usual perspective is to look at channels that drive (high quality) traffic, meaning: “Where are my users - so I can approach them?”

However, smart marketers are thinking differently: “Where are my users - in their heads, in this moment?”

In most cases you would want to address your users on your website, right there when they are actually browsing and exploring your products. Why? Because your website usually is the spot where sales are closed while your several channels such as search engines, email, social, retargeting etc. lead to it.

Don’t get me wrong: To address users on your website you still need those channels for two reasons:

  • Quantity: To drive traffic.
  • Quality: To collect data from this traffic.

The central idea of a personalization system such as Intempt is to segment users based on data coming in from multiple sources like search engines, email, social or retargeting to then guide these users on your website (like shop owners do when you are in a physical store).

And you may even predict your user’s next steps and take action using collected data from previous users (see below).

Many marketers believe if visitors click on an organic search result this means their SEO works and the specific page ranks high.

While this isn’t wrong to believe, they still focus too much on the channel instead of their actual visitors. Let me give you an example: We already touched on the price point before when discussing the structured data template. If your product range is small, it is comparably easy for your visitors to understand the pricing structure and available options your shop offers.

However, the larger the product catalog gets, the trickier it is for them to find products that match with their expectations so they would buy.

How to Guide Your Visitors So They Don’t Get Lost?

This applies especially if someone is a first time visitor coming from a search engine and not being familiar with your website. It is very likely this visitor will never return if no pleasing products are displayed within the first 2 minutes.

If you analyzed your website traffic, you might have experienced this already: visitors coming from search engines such as Google behave differently compared to visitors coming from social networks, paid ads or referred websites (e.g. a blog).

One of the reasons is organic visitors only get to see a tiny snippet of the actual landing page whereas a visitor influenced by a blog post might be already familiar with the landing page’s content.It is crucial to display products to visitors coming from search engines they are likely to buy within this short time frame to drive conversions, especially when it comes to market segments like fashion, jewelry or home decoration where visitors often show indecisive purchase behaviour.

There is a correlation between huge product catalogues and a indecisive buying patterns. When starting their businesses, many retailers don’t know which products their visitors will buy, so they add as many products as possible to their catalogues (this applies especially to dropshipping). This strategy however fuels a indecisive purchase behaviour even more and increases the likelihood for visitors to get lost in the catalogue and to drop off and never come back.

A popular method to guide visitors in the right direction is to display recommended products. Based on previous purchase patterns, the current customer journey is compared against these patterns.

While this is definitely a good way to approach the problem outlined above, it requires a huge database of existing customer journeys to be effective. Also it doesn’t distinguish between first time and returning visitors, so first timers only get to see the default recommendation.

Wouldn’t it be great to offer personalized catalogs per visitor right off the bat?

Deliver Personalized Category Pages On a Per Visitor Basis

On Shopify, users get to see category pages displaying products in a default sort order (based on your Shopify settings), e.g. ‘Best selling’ or ‘Newest’.

But visitors are unique: Some (even subconsciously) pick rather expensive products, others browse only cheap items. Then there are visitors who browse both kinds of products, so no behaviour pattern is visible from a price point of view.

What if you could automatically alter the sort order based on the visitor’s previous browsing behaviour so it is more likely visitors convert?

This is what on-site behavioral merchandising is about. It simply means to:

  • Track your visitors behaviour on your website
  • Segment them based on this behaviour
  • Change your website individually in real time
  • Grow by increasing engagement and revenue

You may say: ‘Visitors can change the sort order at any time’. While this is true, wouldn’t it be better to already deliver the right sort order to the right visitor based on the visitor’s behaviour?
Especially when considering the fact that many visitors don’t use the setting options a shop system offers to them?

The Online Shop

To dive into on-site behavioral merchandising, let us take a look at this Shopify shop from one of our clients:

Online Shop Homepage

Online Shop Category Page

It is a typical apparel shop with a large catalog containing hundreds of products. In other words: An ideal candidate for our campaign.

Change The Default Category Page Sort Order

As you might know, Shopify allows to display collection and category pages with a preset of different sort orders:

  • Manually
  • Best selling
  • Product title A-Z
  • Product title Z-A
  • Highest price
  • Lowest price
  • Newest
  • Oldest

Let us define the visitor’s behavior that matches our campaign segment first:

If a first-time visitor coming from Google browses three high priced products in a row, I would consider this visitor to be interested in high priced items and therefore would like to display category pages with a sort order different from the default sort order: Highest Price on top instead of New on top. This will help the visitor to get oriented.

Returning visitors and visitors from other traffic sources such as social, paid or other referral websites I explicitly would want to exclude from this campaign because I would not want to disturb their visitor journey or run other campaigns on these segments

To this, we need to override the menu item links by adding a sort order query.

A default Shopify category link would look like this:

my_shop_url.com/collections/my_collection

whereas a ‘treated’ link with a sort order highest to lowest price would look like this:

my_shop_url.com/collections/my_collection?_=pf&sort=price-descending

Create An On-Site Behavioral Merchandising Campaign on Intempt

With Intempt it is easy to deliver personalized category or collection pages based on the actual behaviour of a visitor. It doesn’t take more than 10 minutes to create such a campaign.

You don’t need to collect a lot of visitor data before running the campaign nor trust in any machine learning logic. You are still in full control of the strategy while the campaign runs automatically.

Install Your Tracker

To set up such a campaign, you would first need to install the Intempt tracker - a code snippet similar to Google Analytics - collecting each visitor’s behaviour.

Create Your Event

Afterwards you may create an event to identify high priced items. Similar to the structured data examples outlined above, you would simply need to tell Intempt what the price and a product page is by adding some additional code to your website.

Create Your Segment

Now you can easily create a visitor segment. The segment in our case could look like this:

  • A visitor coming from Google browsing
  • A t-shirt
  • Above $100
  • More than two times
  • Within last 30 seconds (recency)

Note that the first visitor property is fixed. The Intempt tracker stores all information available from the HTTP header, such as the referral website host, in this case Google.

The other four properties are behavioral properties segmenting the visitor (browsing) behavior.

Information about the product such as the product category or the vendor can be retrieved

  • directly via the page URL (if it contains this information) or
  • by using a script submitting this data to Intempt

whenever a visitor browses a category or a product page.

Data from the referer (Google) is combined with data from the actual website and merged into a powerful personalization campaign.

This remains is a very broad segment we are just using for this tutorial. You might would want to attach a certain product category to it or add additional constraints. Intempt is versatile, you can add as many conditions as you like when creating a segment. Or as many segments as you like.

Set Up Your Campaign

The last step is to create a campaign. The campaign is used to define the entry segment outlined above but also a goal event for evaluating the success. You may also add additional rules when the campaign should trigger.

Create Your Event Listener

Let us now get back to your online store.

You are tracking your visitors behaviour. If this behaviour matches a certain pattern (segment) the Intempt server is sending back a signal to the script running on your website.

An additional script running on your store (an event listener) now overrides every category link as soon as the signal arrives.

A default visitor would have this experience when browsing the t-shirt section:

Online Shop Normal User

...while a visitor coming from Google and browsing at least three t-shirts with a price above $100 in a row would see this:

Online Shop Treated User

On-Site Behavioral Merchandising Helps You To Increase Revenue

Combining off- and on-page strategies help you to ignite and influence visitor journeys and increase revenue while gaining you full control over your campaign.

If you are struggling with large product catalogues and fragmented visitor segments, this approach can be your swiss knife in marketing. Just be personal, in a smart way.

Ready To Boost Your Sales Via On-Site Behavioral Merchandising?