Tooltips
Tooltips provide compact help text. Learn how to use them in Wappler, including trigger behavior and placement.
Tooltips
Section titled “Tooltips”Tooltips add short contextual hints. In Wappler you enable a tooltip on an element, then configure its content and behavior from the Properties panel.
Tooltip example
Section titled “Tooltip example”This sample button is selected so you can explore tooltip settings. This step matters because Tooltip example is part of Design View, and understanding that context makes the next action easier to repeat in your own project.
Orient yourself in Properties panel
Section titled “Orient yourself in Properties panel”Start with the wider context in the Properties panel so the next control makes sense in the full workflow. In the next step, you will focus on Tooltip: Title and see how it fits into this area.
Tooltip: Title
Section titled “Tooltip: Title”Use Title to define what the tooltip shows. It can be plain text or a dynamic data binding. This step matters because Tooltip: Title is part of Selection Panels Properties Titlevalue, and understanding that context makes the next action easier to repeat in your own project.
Tooltip: Trigger
Section titled “Tooltip: Trigger”Use Trigger to control when the tooltip appears: hover, click, or focus. This step matters because Tooltip: Trigger is part of Selection Panels Properties Tooltiptrigger, and understanding that context makes the next action easier to repeat in your own project.
Tooltip: Placement
Section titled “Tooltip: Placement”Use Placement to position the tooltip relative to the element. This step matters because Tooltip: Placement is part of Selection Panels Properties Tooltipplacement, and understanding that context makes the next action easier to repeat in your own project.
Tooltip: Animation
Section titled “Tooltip: Animation”Use Animation to enable/disable the default Bootstrap animation. This step matters because Tooltip: Animation is part of Selection Panels Properties Tooltipanimation, and understanding that context makes the next action easier to repeat in your own project.
Tooltip: Allow HTML
Section titled “Tooltip: Allow HTML”Use Allow HTML if your tooltip content includes HTML (use carefully; keep it readable). This step matters because Tooltip: Allow HTML is part of Selection Panels Properties Tooltiphtml, and understanding that context makes the next action easier to repeat in your own project.
Next steps
Section titled “Next steps”Continue with other Components tours or return to the Components menu.