Popover example

Popovers & Tooltips

The Right Way - Admin Template

Popovers

Four options are available: top, right, bottom, and left aligned.

data-container="body" data-toggle="popover" data-placement="top" title="..." data-content="..."

data-container="body" data-toggle="popover" data-placement="right" title="..." data-content="..."

data-container="body" data-toggle="popover" data-placement="left" title="..." data-content="..."

data-container="body" data-toggle="popover" title="..." data-placement="bottom" data-content="..."

Dismissable

Use trigger focus to hide popover on click outside.

data-toggle="popover" data-trigger="focus" title="..." data-content="..."

Hoverable

Use trigger hover to get popover shown on hover.

role="button" data-toggle="popover" data-trigger="hover" title="..." data-content="..."

Tooltip example

Use attribute data-toggle="tooltip" to init tooltip on element. data-placement for placement, and title for information.

data-toggle="tooltip" data-placement="top" title="Tooltip on top"

data-toggle="tooltip" data-placement="right" title="Tooltip on right"

data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom"

data-toggle="tooltip" data-placement="left" title="Tooltip on left"

Template settings
Information

Use this panel to configure template settings and layout options.

Layout option
Backgrounds
Header options
Container
Navigation options
Sidepanel options
Content options