Shards

Both popovers and tooltips require the 3rd party Popper.js library.

Popovers

At a minimum, popovers can be created using the data-toggle="popover" and data-content="..." attributes. Below is a more specific example:

<button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Toggle Popover
</button>

Tooltips

Tooltips use the title attribute instead. Below is a basic example:

<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">
  Hover Me!
</button>

For more configuration options, make sure you check out the official Bootstrap 4 documentation on popovers and tooltips.