Share & Social

Social Icons allow users to share the page with others.

On this page:

Best Practice

  • Links should open in a new window or tab.
  • This markup doesn’t include the code for sharing.

Usage

<div class="share-social">
  <div class="share-social-body">
    <small>Share this with others!</small>
    <a class="btn" role="button" target="_blank" href="#" title="Share this on Facebook">
      <span class="fab fa-facebook-f fa-fw"></span>
    </a>
    <a class="btn" role="button" target="_blank" href="#" title="Share this on LinkedIn">
      <span class="fab fa-linkedin-in fa-fw"></span>
    </a>
    <a class="btn" role="button" target="_blank" href="#" title="Share this on Twitter">
      <span class="fab fa-twitter fa-fw"></span>
    </a>
    <a class="btn" role="button" target="_blank" href="#" title="Share this in an Email">
      <span class="fas fa-link fa-fw" aria-hidden="true"></span>
    </a>
  </div>
</div>