Instructions for the module «Shoe size chart» for Joomla

First, get the module by clicking the button above «Get module», if the module has already been received, then proceed further.

Installing the module in CMS Joomla 3

Go to your site’s dashboard.

In the top menu, follow the path to the extension installation manager along the path «Extensions» – «Manage» – «Install»:

Joomla 3 Extension Manager

On the page that opens, press the green button and select the archive received on the IWS.BY website when ordering.

After successful installation, you will receive a notification about successful installation:

Joomla 3 Successful Installation Notice

Including the module in CMS Joomla 3

To work, the module must be enabled.

Go to the CMS Joomla 3 module management manager along the «Extensions» – «Modules» path.

On the page that opens, in the search bar, enter the name of the module for a quick search. Name «IWS.BY Shoe size chart».

Only one module we need will remain in the list of modules. There will be a red cross next to the name, click on it to activate the module.

The red cross will change to a green checkmark, the plugin has been successfully activated.

Setting up a module in Joomla 3

In the list of modules, click on the name of the module. The module configuration page will open. Let’s consider the required fields.

First field «License Key».

«License Key» field

It is necessary to fill in the license key received during the registration and download of the plugin from the IWS.BY website. The key must be filled in to receive regular plugin updates. Without this key, an error will be displayed when updating to a new version.

Button settings block.

Field «Button name»

The field indicates the name of the button that opens a pop-up window with a shoe size table.

Option «Enable button styling?»

If you select yes in the option, then the styling options from the fields below will be applied to the button that opens the pop-up window with a table of shoe sizes.

Field «Top padding»

The field specifies the top distance between the border and the text in the button. Indicated by a number in pixels.

Field «Bottom padding»

The field specifies the bottom distance between the border and the text in the button. Indicated by a number in pixels.

Field «Left padding»

The field specifies the distance to the left between the border and the text in the button. Indicated by a number in pixels.

Field «Right padding»

The field specifies the distance to the right between the border and the text in the button. Indicated by a number in pixels.

Option «Background color»

The option is responsible for the background color of the button. Specified in HEX format.

Option «Text color»

The option is responsible for the color of the text in the button. Specified in HEX format.

Option «Case of text»

The option is responsible for the case of the text in the button that opens a pop-up window with a table of shoe sizes.

Option «Text style»

The option is responsible for the style of the text in the button that opens a pop-up window with a table of shoe sizes.

Field «Radius of corners»

The field specifies the radius of rounding of the corners of the button. Indicated by a number in pixels.

Field «Border width»

The field is responsible for the border on the border of the button. Indicated by a number in pixels. If you don’t need a border, set the value to 0.

Option «Border style»

The option is responsible for the style of the border on the border of the button.

Option «Border color»

The option is responsible for the color of the border on the border of the button. Specified in HEX format.

Option «Background color on hover»

The option is responsible for the color of the button when you move the mouse cursor over it. Specified in HEX format.

Option «Hover text color»

The option is responsible for the color of the button text when you hover over it with the mouse cursor. Specified in HEX format.

Field «Border color on hover»

The option is responsible for the color of the border on the border of the button when the mouse cursor is hovering over it. Specified in HEX format.

Next, we move on to the setup block of the table itself.

Option «Included data»

This option is responsible for displaying columns in the table. The table will display only those columns in which the checkboxes are set in this field.

Field «Short name of sizes»

In this option, you can specify other names above the columns. By default, abbreviated names are filled in.

Settings column «Size chart»

These settings are the most important in the module. By default, the module is filled with demo data, but in the data, you can fill the option with your own data. Rows can be moved lower or higher, deleted or added.

Now you need to adjust the display position of the module in the desired location.

Field «Status»

Field «Position»

In this option, you must select the position of the module in the template where the button will be displayed.

Next go to the tab «Menu Assignment»

A tab with one field will open «Module Assignment»

At this point, it is important to select a value, otherwise the module will not be displayed on the site pages. In our case, we chose the value «On all pages».

These are all fields and options, by filling in which on the site you will see a button that opens a table of shoe sizes.