With Colors, you can have a products sizing guide in your products variants:

Screenshot 2022-08-05 at 12.46.54.png

Screenshot 2022-08-05 at 12.46.06.png

To enable it, go to the Theme editor:

  1. Navigate to a product page
  2. Expand the product variant picker block
  3. Fill the different settings in the “Information popup” subsection

Screenshot_2022-08-05_at_12.51.31.png

<aside> ⚠️ Important: for the “Size guide” link to show, you need to fill the “Option name for information popup” **with the same name as the product’s option you want it to show next to, and choose a page in the “Information popup content” setting.

</aside>

If you want to have the same “Sizing chart” page as in our demo stores, you can use this HTML code for that page:

<meta charset="utf-8">
<table width="100%">
	<tbody>
		<tr>
			<td><strong> Size</strong></td>
			<td><strong>S</strong></td>
			<td><strong>M</strong></td>
			<td><strong>L</strong></td>
			<td><strong>XL</strong></td>
		</tr>
		<tr>
			<td><strong>Chest</strong></td>
			<td><span>77</span></td>
			<td><span>82</span></td>
			<td>87</td>
			<td>92</td>
		</tr>
		<tr>
			<td><strong>Length</strong></td>
			<td><span>122</span></td>
			<td><span>123</span></td>
			<td>124</td>
			<td>125</td>
		</tr>
		<tr>
			<td><strong>Waist</strong></td>
			<td><span>67</span></td>
			<td><span>72</span></td>
			<td>77</td>
			<td>82</td>
		</tr>
		<tr>
			<td><strong>Hip</strong></td>
			<td>69</td>
			<td>73</td>
			<td>78</td>
			<td>83</td>
		</tr>
	</tbody>
</table>
<p>All measurements are in cm. If you are unsure of fit, please do not hesitate to <a href="/pages/contact">contact</a>.</p>