UI Builder tab component

yella123
Tera Expert

6 hours ago

I created a tab component called Action. When I hover on Action I Need, Like Text ' this is Action Tab' like this. 

yella123_0-1781594295766.png

How to this in UI Builder.

 

0 Helpfuls
  • 131 Views
1 REPLY 1

Yogesh11bhatt
Kilo Guru

3 hours ago

Hi @yella123 ,

 

The screenshots show that you are currently inspecting the properties of the parent Tabs 1 container component. The parent container does not control hover text for individual tabs.

1. Select the Specific Tab

In the left-hand Content Tree, expand your Tabs 1 component and click directly on the Action node. This will update the right-hand Configuration pane to show the properties specific to that individual tab.

2. Check for Tooltip-Related Properties

Once the individual tab is selected, review the Configuration pane for properties such as:

  • Tooltip

  • Title

  • Aria Label

If your ServiceNow release exposes one of these properties, you can enter:

This is Action Tab

and save the page.

3. The Icon Workaround (Release Dependent)

In many UI Builder releases, the standard Tabs component does not expose a dedicated tooltip property for text labels. If you do not see one, you can try adding an icon next to your Action label. While not universally true across all versions, some icon implementations within UI Builder expose accessibility labels or specific properties that can display a hover tooltip.

4. Custom Component Approach

If a text-only hover tooltip is a strict requirement and the out-of-the-box component does not expose the necessary property, a custom component or macroponent will likely be required. The standard Tabs component restricts injecting arbitrary HTML attributes (such as title) into the tab label.

Hope this helps clarify your options in UI Builder!

 

Please mark this answer as Helpful if it resolves your question. 🙂

 

Thanks,
Yogesh Bhatt

0 Helpfuls