Size Guide

DEMO

First - go to WPBakery Page Builder > Role Manager and under the user roles, choose the post type Custom and check the post type you want to use the WPBakery Page Builder (nasa_block)

Simply go to Static Blocks > Edit Size Guide

You can use this HTML to create the initial Size guide and edit it to what you want

<div class="padding-top-30">
<h3 class="font-200 nasa-bold-800 text-center margin-bottom-20">Size Guide</h3>
[vc_tta_tabs alignment="center" tabs_display_type="2d-no-border" el_class="nasa-tab-spacing-2px"][vc_tta_section title="DRESSES" tab_id="1589532434092-39326f20-f92f"]
<table class="nasa-info-size-guide">
<thead>
<tr>
<td>Size</td>
<td>Chest</td>
<td>Waist</td>
<td>Hips</td>
</tr>
</thead>
<tbody>
<tr>
<td>XS</td>
<td>34</td>
<td>28</td>
<td>34</td>
</tr>
<tr>
<td>S</td>
<td>36</td>
<td>30</td>
<td>36</td>
</tr>
<tr>
<td>M</td>
<td>38</td>
<td>32</td>
<td>38</td>
</tr>
<tr>
<td>L</td>
<td>40</td>
<td>34</td>
<td>40</td>
</tr>
<tr>
<td>XL</td>
<td>42</td>
<td>36</td>
<td>42</td>
</tr>
<tr>
<td>2XL</td>
<td>44</td>
<td>38</td>
<td>44</td>
</tr>

<tr>
<td class="padding-top-25 nasa-font-color" colspan="4">
<p class="margin-bottom-0 text-center">All measurements are in INCHES</p>
<p class="margin-bottom-0 text-center">and may vary a half inch in either direction.</p>
</td>
</tr>
</tbody>
</table>
[/vc_tta_section][vc_tta_section title="T-SHIRT" tab_id="1589532434106-71fc7663-4dd4"]
<table class="nasa-info-size-guide">
<thead>
<tr>
<td>Size</td>
<td>Chest</td>
<td>Waist</td>
<td>Hips</td>
</tr>
</thead>
<tbody>
<tr>
<td>2XS</td>
<td>32</td>
<td>26</td>
<td>32</td>
</tr>
<tr>
<td>XS</td>
<td>34</td>
<td>28</td>
<td>34</td>
</tr>
<tr>
<td>S</td>
<td>36</td>
<td>30</td>
<td>36</td>
</tr>
<tr>
<td>M</td>
<td>38</td>
<td>32</td>
<td>38</td>
</tr>
<tr>
<td>L</td>
<td>40</td>
<td>34</td>
<td>40</td>
</tr>
<tr>
<td>XL</td>
<td>42</td>
<td>36</td>
<td>42</td>
</tr>

<tr>
<td class="padding-top-25 nasa-font-color" colspan="4">
<p class="margin-bottom-0 text-center">All measurements are in INCHES</p>
<p class="margin-bottom-0 text-center">and may vary a half inch in either direction.</p>
</td>
</tr>
</tbody>
</table>
[/vc_tta_section][vc_tta_section title="BOTTOMS" tab_id="1589603995287-a8a98115-f879"]
<table class="nasa-info-size-guide">
<thead>
<tr>
<td>Size</td>
<td>Chest</td>
<td>Waist</td>
<td>Hips</td>
</tr>
</thead>
<tbody>
<tr>
<td>XS</td>
<td>34</td>
<td>28</td>
<td>34</td>
</tr>
<tr>
<td>S</td>
<td>36</td>
<td>30</td>
<td>36</td>
</tr>
<tr>
<td>M</td>
<td>38</td>
<td>32</td>
<td>38</td>
</tr>
<tr>
<td>L</td>
<td>40</td>
<td>34</td>
<td>40</td>
</tr>
<tr>
<td>XL</td>
<td>42</td>
<td>36</td>
<td>42</td>
</tr>
<tr>
<td>2XL</td>
<td>44</td>
<td>38</td>
<td>44</td>
</tr>

<tr>
<td class="padding-top-25 nasa-font-color" colspan="4">
<p class="margin-bottom-0 text-center">All measurements are in INCHES</p>
<p class="margin-bottom-0 text-center">and may vary a half inch in either direction.</p>
</td>
</tr>
</tbody>
</table>
[/vc_tta_section][/vc_tta_tabs]
</div>

Next: Go to Theme Options > WooCommerce Extended > Size Guide to select Size guide

Create Size Guide by Elementor Header & Footer Builder - Custom Block

If your site uses Elementor: go to Theme Options > Elementor Header & Footer Builder > Add New or Edit Size Guide (Template: Custom Block).

How to import JSON file:

In addition, you can override the Size Guide for Root Category Product (Parent=0)

All the products in this category will display this size guide

Size Guide for each product (High priority)

Please navigate to Products → Edit Product → In this Product Tab choose Additional → Additional → Choose the Size Guide table that you created in the Static Block

PreviousRequest a Call Back NextDelivery & Return

Last updated 1 month ago

Was this helpful?