How to Tag The Animated Headline Widget for Figma to Elementor?

Key Takeaways

  • UiChemy allows tagging Figma designs as the Elementor Animated Headline widget for animation.
  • A frame containing three texts can be tagged as an Animated Headline widget using UiChemy.
  • UiChemy Pro license is required to tag Elementor Pro widgets.

Table of Contents

If you want to make your Figma design’s title animate in your Elementor template, just tag it as the Elementor Animated Headline widget using the UiChemy plugin.

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

What Can be Tagged?

A frame containing three texts can be tagged as an Animated Headline widget.

How to Tag?

To do this, you can choose between two options: Step by Step Method or Express Conversion.

Here, we’ll go with the Step by Step Method.

  1. First, select the Step by Step Method and click on the Start button.
  2. Select the top-level page or frame of your layout, then click on the Next button.
  3. Under the Widget Tagging Mode tab, select the Manual Widget Tagging Option.
  4. Next, under the Manage Auto Layout tab, you’ll see two options:It’s already in Auto Layout and Convert to Auto Layout. We’ll go with the first option.
  5. After that, under the Tag Widgets tab, choose the frame or container that contains your element (Widget). Then, search for the Animated Headline widget from Elementor Pro in the UiChemy panel and select it. Here, you’ll see all the supported Elementor widgets.

Note: You need to have a UiChemy Pro license to tag Elementor Pro widgets.

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.

  1. From the Before Text dropdown, you have to select the before text.
  2. Then, from the Highlighted Text dropdown, you have to select the text you want to animate.
  3. Finally, in the After Text dropdown, you have to select the after text.
  4. Once done, click the Save button to complete the tagging, and you’ll see a Tagged successfully message.

Now, if you export the design, that element will use the Elementor Animated Headline widget with your selected texts and animation.

exported template with animated headline

Note: Since this is a pro widget make sure the Elementor pro plugin is installed and activated. You might have to make some minor adjustments in the widget settings to match the design, especially those elements that are not tagged.

About the Author

Photo of Sagar Patel CEO of UiChemy
CEO · UiChemy · 11 years experience

Sagar is the Founder & CEO of POSIMYTH Innovations, with 10+ years building WordPress products trusted by 100,000+ websites globally. He has led the development of The Plus Addons for Elementor, Nexter, WDesignKit, and UiChemy, all built hands-on from concept to launch. His work focuses on making website building faster, more flexible, and accessible for creators and businesses worldwide.

WordPressFigmaUI DesignWeb DesignElementorBricksAutomationClaudeAI

Related Frequently Asked Questions


What should I do if the Animated Headline widget isn't animating after tagging?

If the Animated Headline widget isn't animating, first ensure that you have selected the correct frame containing the text and tagged it properly in the UiChemy panel. Also, verify that the Elementor Pro plugin is installed and activated, as the Animated Headline widget requires it. If everything seems correct, check the widget settings in Elementor for any adjustments that might be needed to match your design.

What is the best practice for tagging multiple text elements in Figma?

When tagging multiple text elements in Figma for the Animated Headline widget, group them into a single frame. This ensures that all related texts are animated together. Use the Manual Widget Tagging Option in UiChemy to select the frame and specify the before, highlighted, and after texts accurately. This approach helps maintain the intended design and animation flow.

Are there any limitations when using the Animated Headline widget with UiChemy?

One limitation is that you need a UiChemy Pro license to tag Elementor Pro widgets like the Animated Headline. Additionally, ensure that your Figma design adheres to the requirements for tagging; for instance, the frame must contain three text elements. If these conditions aren't met, the widget may not function as expected in Elementor.

How do I know if my Figma design is compatible with Elementor?

To determine if your Figma design is compatible with Elementor, check if it includes supported widgets as outlined in the supported Elementor widgets documentation. Ensure that you are using the UiChemy Figma Plugin to tag elements correctly, as this will facilitate a smooth conversion to Elementor.

Last reviewed: April 14, 2026