How to Add a Size Chart in WooCommerce and What are the Benefits

May 14, 2025,
How to Add a Size Chart in WooCommerce and What are the Benefits

Adding a size chart guide to your product pages can boost customer confidence and cut down returns. In this guide, we’ll walk you through every step, from picking the right plugin to fine-tuning settings. You’ll learn how a clear WooCommerce size chart improves sales and makes shopping easier for your buyers.

Step 1: Introduction to WooCommerce Size Charts

Why Size Charts Matter for Your Store

A WooCommerce size chart helps shoppers pick the correct size on the first try. Without clear measurements, customers might order the wrong size and return items. A simple chart reduces confusion and builds trust in your brand.

How to Choose the Right WooCommerce Size Chart Plugin

Not all plugins are equal. Look for one that lets you create unlimited charts and choose between tables or images. Make sure it offers easy styling, pop-up or tab views, and shortcode support for flexible placement. A good plugin should feel like a natural part of your store.

A premium WooCommerce size chart plugin gives you far more power and peace of mind than most free options. With a paid solution, you get:

  • Advanced Features: Unlimited charts, image-mode support, CSV import/export, and user-role targeting aren’t usually available for free.
  • Regular Updates: You’ll receive ongoing improvements and compatibility fixes when WooCommerce or WordPress updates.
  • Dedicated Support: Premium plugins come with expert help, so you’re never left troubleshooting on your own.
  • Reliability & Security: A well-maintained codebase reduces conflicts with themes or other extensions.

Below is a quick feature comparison between the FMEAddons premium plugin and typical free WooCommerce size chart plugins:

 

Features

FMEAddons Premium

Free Plugins

 

Create unlimited size charts

 

Table and image modes

 

Tab, popup & shortcode display options

 

Full colour & style customization

 

Assign by product, category & user role

 

CSV import/export of charts

 

Premium updates & support

 

Buy Now

 

You can also buy the product size chart for WooCommerce plugin from Woo Marketplace.

Step 2: Configuring Your Size Chart Settings

Navigating the Plugin Settings Panel

Once you install your WooCommerce size chart plugin, head to the settings panel under WooCommerce. You’ll see options for enabling the chart feature, picking button text, and styling pop-ups or tabs. Spend a few minutes exploring each tab so you know where to find every control.

Key Customization Options

Most plugins let you adjust colors for chart headers, table rows, and pop-up buttons. You can match your store’s theme by choosing background and text colors. Set the pop-up animation fade, slide, or zoom to add a professional touch.

Preparing Your Store for Online Sales

Before adding charts, ensure WooCommerce and WordPress are up to date. Check that your theme doesn’t have hard-coded product tabs that might conflict. A quick backup of your site also gives you peace of mind before making changes.

 

Step 3: Creating and Managing Your Size Charts

Designing Your First Size Chart

In the chart builder, select Table or Image mode. For tables, click the plus icon to add columns or rows. Enter size labels like Small, Medium, Large, and measurements in each cell. If you already have a branded chart image, switch to Image mode and upload the file.

 

Assigning Custom Charts by Category

You can assign each WooCommerce size chart to specific products or entire categories. Use include/exclude rules to target only men’s shirts or women’s shoes. If you run a store with wholesale and retail customers, you can even show different charts by user role.

Step 4: Integrating Size Charts on Product Pages

Embedding Charts with Shortcodes

Shortcodes give you full flexibility for placing your WooCommerce size chart anywhere. Copy the provided [size_chart id="X"] code and paste it into a product description, widget, or custom page. This is ideal if you want charts in sidebars or special landing pages.

Step 5: Enhancing the Shopping Experience

Enabling Size Chart Popups for Quick Previews

Pop-ups let customers view charts without leaving the page. When shoppers click a button labeled “Size Chart,” the chart appears in a modal window. This keeps them focused on the product while accessing all the needed measurements.

Customizing Chart Colors and Styles

A well-styled WooCommerce size chart feels like part of your brand. Use the plugin’s CSS settings to adjust header backgrounds, text colors, and row shading. You can preview changes live so you know exactly how the chart looks on mobile and desktop.

Additional Tips

While a WooCommerce size chart helps customers choose the right fit and reduces returns, offering a smooth and fast checkout experience is just as important for increasing sales. Using google address autocomplete for WooCommerce plugin makes the checkout process quicker by automatically filling in address details, which reduces errors and speeds things up. When customers can shop confidently and check out effortlessly, it leads to higher satisfaction and better conversion rates.

1. Importing and Exporting Size Charts via CSV

If you manage multiple charts, CSV import/export saves time. Create a spreadsheet with chart titles, headers, and cell values, then upload it. When you need the same charts on another site, export the CSV and import it there.

2. Migrating Your Charts Between WooCommerce Stores

To move charts to a new store, use the plugin’s built-in export feature. It creates a file you can import on another WooCommerce install. This ensures your WooCommerce size chart configurations and styling transfer seamlessly.

Maintenance and Troubleshooting

Solving Common Size Chart Issues

If a chart doesn’t show up, check assignment rules first. Make sure the product or category matches the chart’s include list. If colors look off, clear any caching plugins and refresh your browser to see updates.

Updating and Upgrading the Plugin

Keep your WooCommerce size chart plugin up to date for the latest features and bug fixes. Regularly check WooCommerce > Extensions for available updates. A valid license ensures you receive timely support and improvements.

Conclusion

Adding a WooCommerce size chart is a simple yet powerful way to enhance your customers shopping experience, reduce returns, and increase conversions. By following the steps outlined in this guide, you can easily set up and customize a size chart for your products. While free plugins can offer basic functionality, premium options like the one from FMEAddons provide superior features, greater control, and a smoother integration process. If you're looking to provide your customers with a seamless and reliable shopping experience, investing in a premium WooCommerce size chart plugin is a worthwhile decision.

FAQs

How do I show a size chart in WooCommerce?

First, install and activate your size chart plugin. Then create your chart (either as a table or an image) and set its display method tab, popup, or shortcode. If you choose a tab, it will appear alongside your product details. For a popup, a “Size Chart” button shows on your product page. If you prefer full control, copy the shortcode (like [size_chart id="X"]) and paste it wherever you like product description, sidebar, or even a custom landing page.

What is the best image size for WooCommerce?

For product images, WooCommerce recommends 800×800 px or at least 600×600 px for a clear, square look. This size keeps your photos sharp without slowing your site. If you’re using larger images, make sure to optimize them for the web so pages still load quickly.

How do I add sizes in WooCommerce?

In your WordPress dashboard, go to Products > Attributes. Create a new attribute called “Size,” then add terms like Small, Medium, and Large. Next, edit or create a product and, under the Attributes tab, assign those size terms. If you also want a dropdown on the product page, enable the attribute in the Variations tab and set up variations for each size.

What is the market size of WooCommerce?

WooCommerce powers around 40% of all online stores, making it the most popular e-commerce platform on the web. Millions of shops use WooCommerce globally, from small boutiques to large brands, thanks to its flexibility and free core software combined with premium plugins.

What size is WooCommerce WordPress?

If you mean the software itself, WooCommerce is a plugin for WordPress, so it doesn’t have a physical size it adds PHP files and assets totaling around 10–20 MB. In terms of image and layout dimensions, you control those in your theme’s settings (product image sizes, gallery, and thumbnail options).

How do I create a size chart in WooCommerce?

After installing your size chart plugin, head to WooCommerce > Size Charts and click Add New. Give your chart a title, choose Table or Image mode, and build your grid or upload an image. Set how you want it displayed (tab, popup, or shortcode), assign it to products or categories, then publish. Your chart is now live on the frontend!

How do I add a size dropdown in WooCommerce?

To show a size selector on a product page, turn your product into a variable product. In the product edit screen, choose Variable product under Product data, then go to the Attributes tab. Add your “Size” attribute and select “Used for variations.” Next, switch to the Variations tab and either create variations automatically or add them one by one. Save changes, and customers will see a size dropdown when they view that product.