--- title: "How to Tag The TP Heading Title Widget for Figma to Elementor?" url: https://uichemy.com/docs/how-to-tag-the-tp-heading-title-widget-for-figma-to-elementor/ date: 2024-04-08 modified: 2026-04-14 author: "Sagar Patel" description: "Are you using unique titles in your Figma design to highlight sections? Then you can tag those elements as the Heading Title widget from The Plus Addons for Elementor using..." word_count: 617 --- # How to Tag The TP Heading Title Widget for Figma to Elementor? ## Key Takeaways - UiChemy allows tagging elements as the Heading Title widget from The Plus Addons for Elementor. - Modern style requires a frame with main title text, extra text, and description text for tagging. - Animated Split style can be applied to a frame containing only the main title text. - Exporting the design after tagging uses the selected Heading Title widget style with specified information. Are you using unique titles in your Figma design to highlight sections? Then you can tag those elements as the Heading Title widget from The Plus Addons for Elementor using the UiChemy plugin.  So when you export the design as an Elementor template, that particular section will use the Heading Title widget. ## What Can be Tagged? When you want to tag an element as the Heading Title widget from The Plus Addons for Elementor, it can be tagged with different preset styles. Some presets require different design layouts. **Modern** - A frame containing the main title text, an extra text, and a text as a description can be tagged as a Heading Title widget with the Modern style. **Animated Split** - A frame containing the main title text can be tagged as a Heading Title widget with the Animated Split style. **Other Styles** - For the rest of the preset styles, a frame containing the main title text and a description text can be tagged as a Heading Title 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**. - First, select the **Step by Step Method **and click on the** Start **button. - Select the top-level page or frame of your layout, then click on the **Next **button. - Under the **Widget Tagging Mode** tab, select the **Manual Widget Tagging** Option. - 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**. - After that, under the **Tag Widgets** tab, choose the frame or container that contains your element (Widget). Then, search for the **Heading Title** widget from **The Plus Widgets** in the UiChemy panel and select it. Here, you’ll see [all the supported Elementor widgets](https://uichemy.com/docs/widgets-compatible-with-figma-to-elementor-conversion-in-uichemy/). 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. ### Tag as Modern Style - From the **Style** field, you have to select **Modern**. - In the **Heading Title** field, you have to select the title text from the dropdown. - In the **Sub** **Title** field, you have to select the description text from the dropdown. - In the **Extra Title** field, you have to select the extra title text from the dropdown. - 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 Heading Title widget from The Plus Addons for Elementor with Modern style with all your specified information. ![](https://uichemy.com/wp-content/uploads/2024/04/exported-template-with-tp-heading-modern.gif) > *Note: Make sure The Plus Addons for Elementor plugin is installed and activated and the widget is activated as well. You might have to make some minor adjustments in the widget settings to match the design, especially those elements that are not tagged.* ### Tag as Other Style - From the **Style** field, you can select any style except Modern and Animated Split. - In the **Heading Title** field, you have to select the title text from the dropdown. - In the **Sub** **Title** field, you have to select the description text from the dropdown. - In the **Extra Title** field, don’t select anything as these don’t support extra titles. - Once done, click the **Save **button to complete the tagging, and you’ll see a Tagged successfully message. ![](https://uichemy.com/wp-content/uploads/2024/04/uichemy-tag-tp-heading.gif) Now, if you export the design, that element will use the Heading Title widget from The Plus Addons for Elementor with your selected style, with all your specified information. ![](https://uichemy.com/wp-content/uploads/2024/04/exported-template-with-tp-heading.gif) > *Note: Make sure The Plus Addons for Elementor plugin is installed and activated and the widget is activated as well. You might have to make some minor adjustments in the widget settings to match the design.* ## Frequently Asked Questions **Q: What if the Heading Title widget doesn't appear after tagging?** A: If the Heading Title widget doesn't show up after tagging, ensure that The Plus Addons for Elementor plugin is installed and activated. This is crucial because the widget relies on this plugin to function correctly. Additionally, check if the widget itself is activated within the plugin settings, as this can prevent it from appearing in your Elementor layout. **Q: What is the best method for tagging the Heading Title widget?** A: The Step by Step Method is recommended for tagging the Heading Title widget. This method allows for more control over the tagging process, ensuring that you can select the exact elements you want to tag. Itu2019s particularly useful when working with complex layouts, as it guides you through selecting the top-level frame and the specific widget options available in the UiChemy panel. **Q: Does tagging the Heading Title widget affect responsiveness?** A: Tagging the Heading Title widget correctly is crucial for maintaining responsiveness across devices. UiChemy achieves 95% responsive accuracy for designs exported to Elementor. If the tagging is done improperly, it could lead to layout issues on mobile or tablet views. Always preview your design after tagging to ensure it looks good on all screen sizes.