Introduction

Add tooltips to elements using the tooltip shortcode. Choose from four different locations: top, bottom, left, right. There are several additional options including the tooltip color, border radius (rounded corners), border color, opacity, and more.

Example

Maecenas fermentum tincidunt turpis sit amet varius. Proin tristique aliquet pulvinar. Suspendisse potenti. Nam aliquam nulla at nulla hendrerit luctus. Curabitur nisl ligula, malesuada in tincidunt ut, ultrices non tellus. Mauris venenatis, nulla sit amet ullamcorper suscipit, tellus dolor scelerisque ipsum, mattis blandit purus est sed velit. Nulla tincidunt sodales est, non vulputate sem pellentesque in. Sed elit felis, malesuada ac bibendum at, vehicula vitae mi. Ut pharetra turpis ut purus vehicula porta. Ut vehicula sollicitudin laoreet. Cras vulputate, sapien a rutrum condimentum, nisl metus semper elit, at sollicitudin arcu urna nec elit. Cras eget odio leo, et sollicitudin lectus. Donec nibh mauris, rutrum eu dapibus ullamcorper, faucibus et ante.

Top
Bottom
Right
Left

Explore More Shortcodes

Buy Now - Only $30
View shortcodes used to create this page.

[intense_content_section]
<h2>Introduction</h2>
Add tooltips to elements using the tooltip shortcode. Choose from four different locations: <strong>top</strong>, <strong>bottom</strong>, <strong>left</strong>, <strong>right</strong>. There are several additional options including the tooltip color, border radius (rounded corners), border color, opacity, and more.
[/intense_content_section]
[intense_content_section background_type="color" background_color="#f9f9f9" border_top="1px solid #ededed" border_bottom="1px solid #ededed"]
<h2>Example</h2>
Maecenas fermentum tincidunt turpis sit amet varius. [intense_tooltip location="top" title="This is a tooltip on top"]Proin tristique aliquet pulvinar[/intense_tooltip]. Suspendisse potenti. Nam aliquam nulla at nulla hendrerit luctus. Curabitur nisl ligula, malesuada in tincidunt ut, ultrices non tellus. Mauris venenatis, nulla sit amet ullamcorper suscipit, tellus dolor scelerisque ipsum, mattis blandit purus est sed velit. Nulla tincidunt sodales est, [intense_tooltip location="bottom" title="This is a tooltip on bottom"]non vulputate[/intense_tooltip] sem pellentesque in. Sed [intense_tooltip link="#" location="right" title="This is a tooltip on right"]elit felis[/intense_tooltip], malesuada ac bibendum at, vehicula vitae mi. Ut pharetra turpis ut purus vehicula porta. Ut vehicula sollicitudin laoreet. Cras vulputate, sapien a [intense_tooltip location="left" title="This is a tooltip on left"]rutrum[/intense_tooltip] condimentum, nisl metus semper elit, at sollicitudin arcu urna nec elit. Cras eget odio leo, et sollicitudin lectus. Donec nibh mauris, rutrum eu dapibus ullamcorper, faucibus et ante.

[intense_row][intense_column size="3"]
[intense_tooltip location="top" tooltip_background_color="error" tooltip_font_color="#ffffff" tooltip_border_color="error" link="#" title="This is a tooltip on top"]Top[/intense_tooltip]
[/intense_column][intense_column size="3"][intense_tooltip location="bottom" tooltip_opacity="100" title="This is a tooltip on bottom"]Bottom[/intense_tooltip]
[/intense_column][intense_column size="3"][intense_tooltip location="right" link="#" title="This is a tooltip on right"]Right[/intense_tooltip]
[/intense_column][intense_column size="3"][intense_tooltip location="left" title="This is a tooltip on left"]Left[/intense_tooltip]
[/intense_column][/intense_row]
[/intense_content_section]

[intense_snippet snippet_id="Child Theme | Shortcodes/footer" snippet_title="Shortcode Page Footer"]