How to display the widget «button» for products that consist of more than one part?

In order to display a separate widget for each part of the complete product (for example, a separate one for each of the jacket, the vest and the trousers) it is necessary to do the following: 

Place the main code of the Widget on the product page. You can find it's current version here.

The number of blocks with the "Button" widget code must be equal to the number of products in the complete set. The current version of the "Button" widget code is here.

To transmit the unique code of the complete product in the data-id attribute, add a postfix consisting of 2 characters, a symbol "_" (underline), and a Latin letter (starting with the symbol "a").


The priority of adding postfix is set from top to bottom. For example, in the complete article "men’s suit" with code 0822, consisting of a jacket, vest and trousers, add postfixes in this order:

0822_a - for jacket

0822_b - for vest

0822_c - for trousers


The following is an example of the widget code "Button", for displaying 3 buttons for the complete product "men’s suit":

<!-- AstraFit.button --> <div class="astrafit-wdgt" data-id="0822_a" … ></div> <!-- /AstraFit.button -->

<!-- AstraFit.button --> <div class="astrafit-wdgt" data-id="0822_b" … ></div> <!-- /AstraFit.button -->

<!-- AstraFit.button --> <div class="astrafit-wdgt" data-id="0822_c" … ></div> <!-- /AstraFit.button →


The code of the widget «Button» is in the AstraFit Account


In the AstraFit Account in "All Items" section, all products should be created in accordance to the correct categorization, as well as with a same-name code for example, as shown in the table below:

Parameter data-id / product code in AstraFit Account

Product category in AstraFit Account


Men’s jackets and vests


Men’s jackets and vests


Men’s pants and shorts


Each product of the kit must be digitized in the AstraFit Account. After the completion of all conditions, the widgets "Button" will be displayed on the page with the product.

Have more questions? Submit a request


Please sign in to leave a comment.