Best Practices

• Page Titles tell the user which page they’re on.
• Pelican recommends a Page Title for every page.
• Depending on your project’s information architecture, you may need to replace the h2 with h1.
• Use the button to provide quick access to one common action for the page.
• If a page needs more than one button, use a Bootstrap Dropdown button.
• Use only one H1 per page. (We are using an extra one here only as a documentation sample.)

Usage

<div class="page-title">
  <div class="container-fluid">
    <div class="row">
      <div class="col-12 d-lg-flex justify-content-lg-between align-items-center">
        <div class="mb-2 mb-lg-0">
          <h1 class="page-title-text">
            <span class="icon fas fa-home mr-1" aria-hidden="true"></span>Page Title
          </h1>	
          <p class="mb-0">Use this sentence to briefly describe the purpose of the page.</p>
        </div>
        <div>
          <a href="https://google.com" class="btn btn-primary btn-shadow">
            <span class="fas fa-bolt mr-1" aria-hidden="true"></span>Do This
          </a>
        </div>
      </div>
    </div>
  </div>
</div>