Page Comparison

Documentation and examples for adding Bootstrap popovers, like those found in iOS, to any element on your site. Refer to the below URL for more information on Bootstrap Popovers.

• Popovers Documentation

Enabling Popovers

• Go to Appearance > Settings > Theme

• Under Bootstrap Settings select the Popovers tab

• Image Added

• Select Popovers (Enable popovers everywhere)

• Click Save Configuration at the bottom of the page

Creating Popovers

• Go to the page where you would like to add a Popover. The below code is an example of a Popover. For a LIVE example of this. Refer to https://drupal.maricopa.edu/example-pages/various-bootstrap-elements

  Code Block
  <button type="button" class="btn btn-lg btn-danger" data-bs-toggle="popover" data-bs-title="Popover title" data-bs-content="And here's some amazing content. It's very engaging. Right?"> Click to toggle popover</button>

• Copy and paste this code