Introduction
Add popover tooltips to elements using the popover shortcode. Choose from four different locations: top, bottom, left, right. There are several additional options including the popover 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.
Explore More Shortcodes
- Alert
- Animated Popular
- Animated Image
- Animated Scroll New
- Audio
- Badge
- Blockquote
- Blog
- Blur New
- Books
- Button
- Chart
- Clients
- Code
- Collapsibles
- Content Box
- Content Section Popular
- Counter
- Coupons
- Custom Post Type
- Definitions
- Device Mockups
- Divider Popular
- Dropcap
- Emphasis
- Events
- FAQ
- Filler
- Flip Box Popular
- Fullscreen Video
- Gallery Popular
- Google Docs Viewer
- Guests
- Heading
- Highlight
- Hover Box
- Horizontal Ruler
- Icon Popular
- Icon List
- If New
- Image
- Image Compare
- Jobs
- Label
- Lead
- Lightbox
- Locations
- Map
- Masonry
- Members
- Menu
- Post Meta Data
- Movies
- Music
- News
- Overlay Popular
- Panel New
- Parallax Scene Popular
- Permalink
- Person
- Popover
- Portfolio
- Post Fields
- Post Media
- Pricing Table
- Progress
- Project
- Promotional Box
- QR Code
- Quotes
- Recent Books
- Recent Clients
- Recent Coupons
- Recent Events
- Recent Jobs
- Recent Locations
- Recent Movies
- Recent Music
- Recent News
- Recent Portfolios
- Recent Posts
- Recent Projects
- Recent Quotes
- Recent Recipes
[intense_content_section]
<h2>Introduction</h2>
Add popover tooltips to elements using the popover 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 popover 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_popover location="top" title="Popover on Top" text="This is a popover on top"]Proin tristique aliquet pulvinar[/intense_popover]. 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_popover location="bottom" title="Popover on Bottom" text="This is a popover on bottom"]non vulputate[/intense_popover] sem pellentesque in. Sed [intense_popover link="#" location="right" title="Popover on Right" text="This is a popover on right"]elit felis[/intense_popover], malesuada ac bibendum at, vehicula vitae mi. Ut pharetra turpis ut purus vehicula porta. Ut vehicula sollicitudin laoreet. Cras vulputate, sapien a [intense_popover location="left" title="Popover on Left" text="This is a popover on left"]rutrum[/intense_popover] 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_popover location="top" tooltip_background_color="error" tooltip_title_background_color="#730202" tooltip_font_color="#ffffff" tooltip_border_color="error" link="#" title="Popover on Top" text="This is a popover on top"]Top[/intense_popover]
[/intense_column][intense_column size="3"][intense_popover location="bottom" title="Popover on Bottom" tooltip_opacity="100" text="This is a popover on bottom"]Bottom[/intense_popover]
[/intense_column][intense_column size="3"][intense_popover location="right" link="#" title="Popover on Right" text="This is a popover on right"]Right[/intense_popover]
[/intense_column][intense_column size="3"][intense_popover location="left" title="Popover on Left" text="This is a popover on left"]Left[/intense_popover]
[/intense_column][/intense_row]
[/intense_content_section]
[intense_snippet snippet_id="Child Theme | Shortcodes/footer" snippet_title="Shortcode Page Footer"]