WooCommerce Size Chart

• The admin can add size chart templates.
• The admin can add a size chart description text with images.
• The size chart Widget can also be enabled by the admin.
• Global Setting can be used for a Size Chart.
• Customers will see the size chart on the product page and shop page.
• This module increases the customer satisfaction.
• The admin can use multiple-size charts for a single product.

The user will get a zip file which he has to upload in the “Add New” menu option in the WordPress admin panel.

For this, login to WordPress Admin Panel and then Under the Dashboard, hover your mouse over the “Plugins” menu option which brings out a Sub-Menu and then select the “Add New” option.

After this, you will see an option on the top of your page that is “Upload Plugin”, Now clicks the option to upload the zip file.

By clicking on the “Upload Plugin” option, below that you will see a button “Choose File” click on the button to browse for the zip file as per the snapshot below.

After browsing the file, click the “Install Now” button to install the plugin as per the snapshot.

Now when the plugin is installed correctly, then you will see the success message and an option to activate the plugin. Henceforth now, click on “Activate Plugin” to activate the installed plugin.

The admin can manage the module from the admin panel easily.

Moreover, after the successful installation of the module, the admin for the initial configuration can navigate through Webkul WC Addons->Product Size Charts.

Global Settings:

Here, the admin will be able to –

• Enable the size chart option of the products.
• Set the size chart data label as required.
• Enable the required option to show the size chart on the product page.
• Choose the size chart view on the product page as – Popup or Additional Tab or both.
• Set the button position of the Sze chart as – Before Add to Cart or After Add to Cart button.
• Set the size chart button label as required.
• Choose the size chart button color.
• Set the size chart button text color.
• Enter the button border-radius.
• Choose the size chart table border color.
• Set the size chart table border width.
• Enter the size table border width to keep.
• Choose the size chart table header color.
• Set the size chart table header text color.
• Choose the size chart table text color.
• Set the size chart table background color.

Lastly, save the initial configuration settings.

From the configuration section, the admin can easily add a size chart as required.

The admin can add a new size chart by clicking on the Add New Size Charts button.

This navigates the admin to the add new size charts->Add New section as shown below.

Here, the admin can enter –

• Title of the size chart
• Description of the size chart along with the image.

After that, under the Size Chart Table the admin will –

• Enter the size chart table label as required.
• Then add the size chart details – Columns and Rows by tapping the “+” button.

Size Chart Configuration

The admin can now configure the size chart if the Enable Global Settings is disabled.

Here, the admin can mark the checkbox button to use the preset global size chart setting or configure the size chart manually.

Add Products – The admin can select the products for which the admin wants to assign the size chart.

Size Chart Data Label – Here, the admin can enter the label for the description data.

Show size chart on shop page – Select Yes to display size chart on shop page.

Size Chart View – Select the size chart view as a popup, additional tab, or both.

Button Position – Set the position of the size chart button as Before add to cart, or after add to cart.

Size chart button label – The admin can enter the label name of the size chart button.

Color of Button – The button color of the size chart can be set by the admin.

Text Color Of The Button – Set the button text color here.

Button Border Radius – The admin can select the border width within the range 0-5

Size Chart Table Border Color – Select the border color of the size chart table.

Table Border Width – Set the table border width within the range of 0-5

Size Chart Table Header Color – Select the header color of the size chart table.

Table Header Text Color – The admin can select the text color of the size chart header table.

Size Chart Table Text Color – Set the size chart table text color here.

Size Chart Table Background Color – Here, the admin can select the background color of the size chart table.

Lastly, publish the size chart by tapping the Publish button.

From the admin panel, the admin can view and edit the created size charts. The admin can also delete the created size charts as required. Navigate through Product Size Charts->All Size Charts.

Now, the admin can click on the size chart that the admin wants to edit and then edit the size chart accordingly.

The admin can add the widget from the admin panel. To add a Size Chart Widget, the admin can navigate to widget from the admin panel under the Appearance menu and then manage the size chart widget.

Here, the admin can select the widget for a single product size chart or display the list of the size chart. The admin can also set the position of the widget as the sidebar, below the header, and the footer column.

Now, the admin can set the title for the widget, and also select the size chart from the available size chart list.

The size chart will be displayed on the shop page and the product page as configured by the admin.

Now, the customer can click on the Size Chart button to view the size chart as shown in the image below-

The customer can also click on another tab near to the size chart tab to view other details as shown in the image below.

If enabled, the widget of the size chart will also be displayed to the customers as shown in the image below.