One external link element.

New tab desktop. Same tab mobile.

Mobile browers aren't great and opening external links in a new tab makes for a bad UX. So, this code makes external links open in a new tab desktop, but the same tab on tablet and mobile - the best of both worlds for the UX.

<script>
  document.addEventListener("DOMContentLoaded", function () {
    const links = document.querySelectorAll("a");
    const currentDomain = window.location.hostname;

    // Function to detect if the device is mobile
    function isMobileDevice() {
      return /Mobi|Android/i.test(navigator.userAgent);
    }

    links.forEach((link) => {
      const linkHref = link.getAttribute("href");
      const linkDomain = new URL(link.href).hostname;

      // Skip processing for tel and mailto links
      if (linkHref.startsWith("tel:") || linkHref.startsWith("mailto:")) {
        return; 
      }

    // If links hostname is differnet to currnet hostname, force open in same tab on mobile
      if (linkDomain !== currentDomain) {
        if (isMobileDevice()) {
          // Open in the same tab on mobile devices
          link.setAttribute("target", "_self");
        } else {
          // Open in a new tab on desktop devices
          link.setAttribute("target", "_blank");
        }
      }
    });
  });
</script>
Tagline

Medium length section heading goes here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.