Make external links open in new tab

Add `target` and `rel` attributes to some `a` elements using javascript. See https://jekyllcodex.org/without-plugin/new-window-fix/ via https://stackoverflow.com/questions/47605214/jekyll-github-page-post-links-open-in-new-page/58882587#58882587 `jekyll-target-blank` plugin seems not working on GitHub Pages. See keithmifsud/jekyll-target-blank#32 (comment) and keithmifsud/jekyll-target-blank#27 (comment)
nooriro · Apr 11, 2023 · f8717e6 · f8717e6
1 parent ccca342
commit f8717e6
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 0 deletions.
diff --git a/_includes/new-window-fix.html b/_includes/new-window-fix.html
@@ -0,0 +1,15 @@
+<script>
+// Open external links in a new window
+// See https://jekyllcodex.org/without-plugin/new-window-fix/
+function external_new_window() {
+    var anchors = document.getElementsByTagName("a");
+    for (var i = 0; i < anchors.length; i++) {
+        var a = anchors[i];
+        if (a.getAttribute("href") && a.hostname !== location.hostname) {
+            a.target = "_blank";
+            a.rel = "noopener";
+        }
+    }
+}
+external_new_window();
+</script>
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="{{ page.lang | default: site.lang | default: "en" }}">
+
+  {%- include head.html -%}
+
+  <body>
+
+    {%- include header.html -%}
+
+    <main class="page-content" aria-label="Content">
+      <div class="wrapper">
+        {{ content }}
+      </div>
+    </main>
+
+    {%- include footer.html -%}
+    {%- include new-window-fix.html -%}
+
+  </body>
+
+</html>