If you are using a counter in your Figma design to show some number data then you can tag that element to an Elementor Counter widget using the UiChemy plugin, to make it dynamic when you export it as an Elementor template.
What Can be Tagged?
A frame containing a number, title, prefix and suffix value can be tagged as a Counter widget.
How to Tag?
Select the top level frame of your layout then select the Optimize & Convert option and click the Optimize & Convert button.
Now select the frame or container containing the counter in your design and click on the Widget Tags tab in the UiChemy panel.
Then search for the counter and click on the Counter widget from Elementor.
On the next screen, you’ll get the information of which element you are tagging as what widget.
Then you’ll see widget specific tagging options and most of the options will be auto-filled based on your design.
- The Ending Number field, will be automatically filled but you can click the dropdown to change it. This number will be the ending number of the counter widget.
- The Title field, will be automatically filled but you can click the dropdown to change it.
- In the Starting Number field, you can add the counter starting number.
- From the Separator dropdown, you can select the separator type.
- The Number Prefix field, will be automatically filled if you have added the text in the design.
- The Number Suffix field, will be automatically filled if you have added the text in the design.
- Once done, click on the Save button to complete the tagging.
Note: If your design doesn’t have any prefix text then while tagging you have to manually remove the prefix field data.
Now if you export the design, that element will use the Counter widget with all your specified information.
