Size Chart Not Showing on Product Pages? Here’s How to Add It Using a Shortcode

If you are using a custom page builder such as Elementor, Beaver Builder, or any custom WooCommerce single product template, you may notice that the size chart button does not appear automatically on the product page.

This happens because custom templates often bypass WooCommerce’s default hooks.

To fix this, you can manually insert the size chart using a shortcode, allowing you to place the size chart button exactly where you want.

Why the Size Chart Button Is Missing

The size chart button may not appear when:

• You use Elementor or another page builder for single product pages
• Your theme overrides WooCommerce default templates
• Default WooCommerce hooks are not included in the layout

In such cases, using a shortcode is the recommended solution.

Shortcode to Display the Size Chart

Use the following shortcode to display the size chart button anywhere on the product page:

[scfw_product_size_chart]

This shortcode automatically loads the assigned size chart for the product.

How to Add the Size Chart Shortcode

Follow these steps to insert the shortcode into your custom product template:

Step 1: Copy the Shortcode

Copy the shortcode below:

[scfw_product_size_chart]

Step 2: Open Your Page Builder or Template

• Open Elementor, Beaver Builder, or your custom product template
• Edit the Single Product Page

Step 3: Paste the Shortcode

• Add a Shortcode widget (or text block)

• Paste the shortcode where you want the size chart button to appear

  (for example, below the price or near the Add to Cart button)

Step 4: Save and Preview

• Save your changes
• Visit the product page to confirm the size chart button is visible and working

Important Notes

• The shortcode will only work if a size chart is assigned to the product
• The shortcode displays the chart using the selected display style (popup, tab, or inline)
• You can use this shortcode multiple times if needed

Conclusion

When the size chart does not appear on WooCommerce product pages built with custom templates or page builders, using the [scfw_product_size_chart] shortcode is the easiest and most reliable solution.

It gives you full control over placement and ensures the size chart is visible exactly where customers need it.

FAQs

1. Why is the size chart not showing on my product page?

This usually happens when you are using a custom single product template built with Elementor, Beaver Builder, or another page builder that does not load WooCommerce default hooks.

2. Will the shortcode work with all page builders?

Yes. The shortcode works with Elementor, Beaver Builder, Gutenberg, and most custom WooCommerce templates.

3. Do I need to assign a size chart before using the shortcode?

Yes. The shortcode will only display a size chart if one is assigned to the product (via product, category, or tag).

4. Can I place the size chart button anywhere on the page?

Yes. You can place the shortcode anywhere in your template, such as below the price, near the Add to Cart button, or inside a custom section.

5. Does the shortcode support popup, tab, and inline display styles?

Yes. The shortcode follows the display style selected in the size chart settings.

6. Can I use the shortcode multiple times on the same page?

Yes, but it is recommended to use it once to avoid duplicate size chart buttons.

7. Will this shortcode affect other products?

No. The shortcode only displays the size chart for the current product being viewed.

8. Is coding knowledge required to use this shortcode?

No. You only need to copy and paste the shortcode into your page builder or template.