How to Tag The Image Box Widget for Figma to Elementor?

Table of Contents

Are you using Imagebox to show any key features, benefits, or services on your Figma design? Then you can tag those elements to the Elementor Image Box widget using the UiChemy plugin.

So when you export the design as an Elementor template, that particular section will use the Image Box widget.

What Can be Tagged?

A frame containing an image, a title text and description text can be tagged as an Image Box 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 image box in your design and click on the Widget Tags tab in the UiChemy panel.

Then search for image box and click on the ImageBox widget.

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 some of the options will be auto-filled based on your design.

  1. The image will be auto selected in the Image dropdown.
  2. In the Title dropdown, you have to select the title text.
  3. Then from the Description dropdown, you have to select the description text.
  4. From the Title Html Tag section, you can set the HTML tag for the title.
  5. Once done, click on the Save button to complete the tagging.

Now if you export the design, that element will use the Image Box widget with all your specified information..

exported template with

Note: You might have to make some minor adjustments in the widget settings to match the design, especially those elements that are not tagged.