Modals

You can create a modal using the following example. If you want to see details regarding the options you have for modals and how to create them, check out our Bootstrap 4 modals tutorial.

<!-- button that opens the modal -->
<button type="button" class="btn btn-info" data-toggle="modal" data-target="#exampleModal">
  Click for More
</button>

<!-- the modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Here is a modal</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        Modals are a simple way to display information upon request. They let you easily add another layer upon your site and give you the possibility to create popups.
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-success">View More</button>
      </div>
    </div>
  </div>
</div>