How to work with Structured Data for variable products in WooCommerce

In SNIP there is a very easy way to work with product variations from WooCommerce. Here is how it’s done in a few simple steps:

As you may know: setting up structured data for every product can be a lot of work. But not if you work with SNIPs functionality that I called “Global Snippet“. It’s a super handy and also powerful tool that allows you to build almost anything.

A feature within “Global Snippets” is called “Loop”. It allows you to create schemas (or sub-schemas) by looping over items. This is especially interesting for breadcrumbs (looping over all categories) or for any archive page (loop over all found posts).

But the loop functionality can even do more. It allows you to loop over variation products as well!

Variable products in Structured Data (AggregateOffer)

Let’s have a look how variable products should look like in Structured Data.

In the simplest case, nothing changes to the schema except the “offer” attribute. SNIP has a field type “WooCommerce: Offers”. It outputs an AggregateOffer schema that prints the lowPrice and highPrice properties.

This shows search engines that it’s a variable product and the price varies, depending on attributes.

Example output:

{
    "name": "Ultricies Malesuada Ornare",
    "offers": {
        "@context": "http:\/\/schema.org",
        "@type": "AggregateOffer",
        "lowPrice": "20.00",
        "highPrice": "40.00",
        "priceCurrency": "GBP",
        "offerCount": 4,
        "url": "http:\/\/wp-buddy.local\/product\/ultricies-malesuada-ornare\/"
    },
    ....
    "@context": "http:\/\/schema.org",
    "@type": "Product"
}

Variable products in Structured Data (Multiple Products)

However there is another way: You can loop through all the variable products. For this you need to build your own Offer sub-schema that the loop uses. Here is an example:

  1. Choose “Offer” es the schema for the offer attribute.
  2. Choose “Variable products (WooCommerce)” for the loop.
  3. Add all the properties for the Offer-Schema that you need.

SNIP will then loop through all variable products using the Offer-Schema. This is how it could look like:

{
    ....
    "offers": [
        {
            "url": "http:\/\/wp-buddy.local\/product\/ultricies-malesuada-ornare\/?attribute_size=X",
            "priceCurrency": "GBP",
            "price": "0.00",
            "availability": "https:\/\/schema.org\/LimitedAvailability",
            "@context": "http:\/\/schema.org",
            "@type": "Offer"
        },
        {
            "url": "http:\/\/wp-buddy.local\/product\/ultricies-malesuada-ornare\/?attribute_size=L",
            "priceCurrency": "GBP",
            "price": "40.00",
            "availability": "https:\/\/schema.org\/LimitedAvailability",
            "@context": "http:\/\/schema.org",
            "@type": "Offer"
        },
        {
            "url": "http:\/\/wp-buddy.local\/product\/ultricies-malesuada-ornare\/?attribute_size=M",
            "priceCurrency": "GBP",
            "price": "30.00",
            "availability": "https:\/\/schema.org\/LimitedAvailability",
            "@context": "http:\/\/schema.org",
            "@type": "Offer"
        },
        {
            "url": "http:\/\/wp-buddy.local\/product\/ultricies-malesuada-ornare\/?attribute_size=S",
            "priceCurrency": "GBP",
            "price": "20.00",
            "availability": "https:\/\/schema.org\/LimitedAvailability",
            "@context": "http:\/\/schema.org",
            "@type": "Offer"
        }
    ],
    "@context": "http:\/\/schema.org",
    "@type": "Product"
}

As you can see: SNIP outputs an array of Offer-Schemas.