How to add a Size Guides (charts)?

You are here:
Estimated reading time: 1 min

LinkUsing Rey’s “Size Guides for products” internal module

LinkEnabling the module

Please access the backend and visit Rey theme > Modules Manager and enable Size Guides for Products module, ex: .

LinkCreating the first size guide

Simply visit Rey theme > Size Guides and create a new Size Guide ex: .

You can also import a sample guide just by clicking the “Import Sample guide” from the top toolbar, right next to the “New” button.

This will create a new post pre-filled with 3 tables for different types of measurements.

You can edit the tables just by clicking the cells and filling them up with values ex: .

LinkAssigning a global size guide

Access Customizer > WooCommerce > Product page > Components in Summary > Size guides and pick the newly created guide ex: . You can customize the button’s position and display properties.

If you don’t want a traditional position, you can embed the button or content with either of these two shortcodes [rey_size_guide id="99"] or [rey_size_guide_button id="99"] .

LinkAssigning per product, per category etc.

You can pick specific product categories, tags or attributes ex: .

Or, you can pick per product, in the product’s backend ex: .

LinkEditing in Elementor and using ACF Table widget

If you want more customisation freedom, you can edit the guides with Elementor and be more creative.

If you want to replace the tables in Elementor, please hide the tables ex: and than edit the guide with Elementor, where you can insert an ACF Table element ex: . To pick the correct field name, simply search for “table” or “size” etc.

LinkUsing a plugin

There’s the plugin called “Product Size Charts Plugin for WooCommerce” . It’s probably the best plugin for this sort of functionality. It has custom templates, assignment per category etc.

To install, go to Plugins > Add new and search for “Product Size Charts Plugin for WooCommerce” and you should find it listed there. Click on Install and activate.

Rey has a custom layer on top of this plugin, for example to use Rey’s own modal window to optimize this plugin’s frontend CSS and JS. Also, there are a few settings located in Customizer > WooCommerce > Plugin : Size Charts , in order to change the button style and position in the product page.

Was this article helpful?
Dislike 4
Views: 1990

Suggest article improvements

Please use this form to suggest improvements and report missing or outdated content. Support requests will most likely not be answered and it's best to use the Support Request Form instead. Thanks!