Tooltips & Popovers

Tooltips & Popovers Shortcodes

Check out all the Tooltips & Popovers options and can be set in different styles with Porto Tooltip, Porto Popover shortcodes.


Default

[porto_tooltip position=»top» btn_class=»danger» text=»tooltip here» tooltip_text=»Default Tooltip» text_before=»consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus» text_after=»consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus» prefix=»Lorem ipsum dolor sit amet, » suffix=» consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. «][porto_tooltip position=»top» btn_class=»danger» text=»tooltip here» tooltip_text=»Default Tooltip» text_before=»consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus» text_after=»consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus» prefix=»Vestibulum ante ipsum primis in faucibus » suffix=» luctus et ultrices posuere cubilia Curae; In eu libero ligula. Fusce eget metus lorem, ac viverra leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta.»]

Positions

[porto_tooltip type=»btn» position=»left» text=»Tooltip on Top» tooltip_text=»Tooltip on top» el_class=»m-r-md»][porto_tooltip type=»btn» tooltip_position=»right» position=»left» text=»Tooltip on Right» tooltip_text=»Tooltip on right» el_class=»m-r-md»][porto_tooltip type=»btn» tooltip_position=»bottom» position=»left» text=»Tooltip on Bottom» tooltip_text=»Tooltip on bottom» el_class=»m-r-md»][porto_tooltip type=»btn» tooltip_position=»left» position=»left» text=»Tooltip on Left» tooltip_text=»Tooltip on left»]

Popover

[porto_popover type=»btn» btn_skin=»primary» popover_position=»right» popover_trigger=»focus» text=»Show Popover» popover_title=»Lorem ipsum dolor sit amet.» popover_text=»Lorem ipsum dolor sit amet, consectetur adipiscing elit.»]