How to implement a product size chart in WooCommerce

High return rates are one of the biggest challenges facing clothes sellers online. You can tackle this simply and effectively with size charts. But how do you add a WooCommerce size chart? Here's everything you need to know.

If you run an online clothing store, size guides are an absolute must. Online shoppers don't get the benefit of sizing a product up in person before buying. They expect a lot more information before you can get them to the checkout.

A product size chart gives them this information in a concise, easily-understandable way. With the power of plugins, a WooCommerce size chart can be as simple for you to make as it is for your customers to understand.

Understanding the importance of product size charts in WooCommerce

A lot of measurement systems have been standardized across the world, but clothing sizes? Not so much. They differ from country to country, even store to store. You could wear a size L shirt from one brand that fits the same as a size S from another.

This poses a problem for e-commerce stores because it's so hard for a customer to verify the fit with 100% accuracy. More than any other product, people love to try clothes in person before buying. We've all ordered something from the internet that just doesn't look as good in the mirror.

The only way around this is to provide as much detail as possible to the user to help them make a decision. But how can you convey a dense clump of information about measurements without overloading the customer or compromising the aesthetic of your product page?

The answer is a product size chart. A product size chart is a visual aid in a table format that contains all the necessary information about sizing for a particular product. They are neat, precise, and easy to read. If you sell clothes, they can be just as effective as a coupon or good SEO.

How size charts influence purchasing decisions

There is a lot of evidence to suggest that product size charts influence purchasing decisions and improve the shopping experience. Even the smallest adjustments to your page can have a big impact and with clothing and e-commerce, the devil really is in the detail.

For starters, the majority of shoppers research their purchases online before buying. With clothing, this means sizing. If the information isn't readily available, the customer will click off your web page and look elsewhere.

People are far more likely to return clothes that they bought online. In fact, the return rate is a staggering 24.4% according to one study. When asked why they returned an item of clothing, up to 80% of respondents said it was a sizing issue. In some cases, customers have such a lack of faith in the accuracy of sizing that they will buy multiple sizes to return the duplicates that don't fit. It's up to online stores to be clearer and more precise about their measurements.

The sizing issue is so persistent that it drives many customers to shop in person rather than online. Sizing is frequently the top reason people opt for in-person shopping when asked. This makes clothing exceptional because, with most other products, people prefer the convenience of home delivery and the greater choice that is provided by shopping online.

In short, online apparel retailers are faced with:

• A sophisticated customer base that will research products before buying
• A very high return rate due to sizing issues
• Intense competition from other stores, online and in person, that can provide more detailed sizing information

The takeaway is that you need to provide clear, detailed information about sizing. The best way to do this is with a size chart, tailored to your range of products. But how do you implement this? What is the best format for a WooCommerce product size chart?

As with many WordPress questions, the first step is choosing the right plugin.

Choosing the right WooCommerce size chart plugin

Remember, this isn't just about the size chart itself. Whichever product size charts plugin you choose should make it easy to add, update and roll out your content at scale and with ease. The last thing you want is to add size charts manually to each product page.

That's why we recommend WooCommerce Product Tabs. This plugin allows you to create unlimited custom tabs with extra information on your product pages. It has several features that make it perfect for implementing size charts.

From your site's dashboard, you'll have a dedicated space where you can access and manage all of your tabs and size charts. You can either have a different size chart for each product, or share size charts across multiple products (e.g. based on category or tag). For example, a clothing store will usually have one size chart for all products in the 'Women's Tops' category, another size chart for products in the 'Women's Shoes' category, and so on.

The user interface is simple and intuitive. Adding and removing information is straightforward, as is creating new tabs and applying them to individual or groups of pages. It's compatible with other add-ons. You can't beat the functionality of this tab manager plugin.

When you add a size chart within a tab, it keeps your page neat. Users don't like pages that are full of popups and visual clutter. A size chart in the form of a tab ensures that all of the information is easily accessible via widget without being distracting.

Most product pages have other information on them too, for example, customer reviews, links to related products, and a description. Using Woo Product Tabs ensures that you can seamlessly integrate everything on the page in an efficient and visually pleasing way.

Learn more about the plugin by watching this video:

Steps to create and customize your product size chart

After you've installed and activated WooCommerce Product Tabs, go to Products → Product Tabs. Click 'Add New' to get started. From this screen, you can create a size chart tab. I've named mine 'Size Chart' to keep it simple.

Creating an HTML table

For the size chart itself, i.e., the table with all of the numbers and information, we'll be using HTML. No knowledge of coding is required so don't be intimidated! Even though it sounds complicated, this is actually a simple process that comes with some serious advantages down the line:

Let's say you're a store owner who sells designer dresses in five sizes, from small to 2XL. Your customers will need to know which sizes correspond to which measurements, namely the bust, waist, hips, and length. That means you'll need a table with six columns and five rows.

First, find a free, online table generator tool. I recommend using Tables Generator which is what I've shown below. Navigate to the HTML tab on the site. Click on File, then New Table. You'll be prompted to give the dimensions of your table, in our case it's 6x5. A size chart table can be as big as you need, but the more concise the better.

Next, double-click on each square in the grid to add text. I filled out the text in my table as shown below.

Make sure you check the box that says 'Don't generate CSS', then click Generate. There is a green button that lets you copy the resulting HTML to your clipboard. Navigate back to the size chart page on your site. Paste your code into the Text tab (shown below).

Now, when you go back to the Visual tab, you should see a preview of your new size table. To add your new size chart tab to a single product, simply scroll down to Product (see below) and check the box of whichever item you want the tab to appear next to.

Now view the WooCommerce size chart table on the product page. You'll see that all the details like the text color and font automatically match your WordPress theme, so everything integrates nicely together.

Adding multiple size charts to different products

What do you do if you need more than one WooCommerce size chart? Suppose you sell men's T-shirts as well as women's dresses. You'll need two separate size guides. Repeat the steps to make a new, separate size chart in a product tab.

As you can see below, we now have a second, simpler size chart for T-shirts. To apply this chart to your store's T-shirt, but not to the designer dress, simply scroll down to products, check the T-shirt box, and leave the designer dress box unchecked.

You can make as many different size charts as necessary for your store. There are endless use cases. You can have different size charts for different types of clothes, different genders, different countries, the list goes on.

Why stop there? One of the great advantages of WooCommerce Product Tabs is its range of utility. Earlier, we pointed out how online clothing customers are hungry for as much detail as possible. Adding a chart image and other content is a great way to provide this.

This allows you to provide all the necessary information to those customers that need it without overcrowding your product page.

Assigning and managing your product size charts

As your store grows and you add more clothes and more size guides, a default size chart or two might not be enough. The task of assigning and managing your product tabs becomes more complex. Thankfully, WooCommerce Product Tabs gives you all the necessary tools to handle everything at scale and the ability to make unlimited size charts.

Instead of assigning your size chart to one particular product, you can apply it to a whole category or specific products. In my example store, there are five different categories, but you can have as many as you need.

If I want to add my Dress Size Guide to all of the dresses in my store, I simply open the tab in question, navigate to Product categories, and check the 'dresses' box.

This allows you to quickly and easily add a product size guide to many different products at once. If you need to update or edit any of your tabs at any point, all you have to do is edit the tab and choose which products, categories or tags to display size chart on.

It's very important that you keep your size charts accurate and up to date. If the information is incorrect, you will frustrate your customers, lose repeat business and wind up worse than when you started.

Enhance your WooCommerce store with effective size charts

Accurate, effective size charts are absolutely crucial for the success of your online clothing store. The return rate for online apparel is extremely high and you must do everything you can to mitigate this. Size charts will:

The WooCommerce Product Tabs plugin has everything you need to create, implement and manage these size charts. This is the best way to make your clothing store as smooth, practical, and visually appealing as possible. It's easy to set up, and yet comes with detailed documentation and an expert support team.

You can add new product tabs at the touch of a button. The HTML product size tables automatically format your charts to match the theme of your website. The customization options are endless, so you can tailor your size charts to meet the specific needs of your store.

Now that you have a grasp of the basics, why not experiment with the plugin's settings? You can add almost anything to a WooCommerce size chart, including but not limited to text, images, shortcodes, downloads, and videos. Give your customers a unique and enjoyable shopping experience!