Support external links.

5 files changed, 33 insertions, 0 deletions

diff --git a/README.md b/README.md
index a395191..42c15dd 100644
--- a/README.md
+++ b/README.md
@@ -26,4 +26,6 @@ keywords = "..."
 googleSiteVerification = "<google-site-verification-code>"
 search = "..."  # baidu, google, bing, duckduckgo
 dateFormat = "Mon Jan 2 15:04:05 MST 2006"  # see: https://gohugo.io/functions/format/#gos-layout-string
+externalLinkIcon = true
+externalLinkNewWindow = true
 ```
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 58bb855..546ccc4 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -61,5 +61,6 @@
   </footer>
   {{ template "_internal/google_analytics.html" . -}}
   {{ partial "github-corner.html" . -}}
+  {{ partial "external-links.html" . -}}
 </body>
 </html>
diff --git a/layouts/partials/external-links.html b/layouts/partials/external-links.html
new file mode 100644
index 0000000..07de0d9
--- /dev/null
+++ b/layouts/partials/external-links.html
@@ -0,0 +1,17 @@
+{{ if or .Site.Params.ExternalLinkIcon .Site.Params.ExternalLinkNewWindow -}}

+<script>

+window.onload = function(){

+    var links = document.getElementsByTagName('a');

+    for (var i in links) {

+        if (links[i].hostname != window.location.hostname) {

+{{ if .Site.Params.ExternalLinkIcon -}}

+            links[i].className += 'external';

+{{ end -}}

+{{ if .Site.Params.ExternalLinkNewWindow -}}

+            links[i].setAttribute('target', '_blank');

+{{ end -}}

+        }

+    }

+}

+</script>

+{{ end -}}

diff --git a/static/css/main.css b/static/css/main.css
index c10ec68..d302c5a 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -122,6 +122,13 @@ h6 a:hover {
     color: #f80;
 }
 
+a.external {
+    background-image: url("/images/external-link-icon.svg");
+    background-position: center right;
+    background-repeat: no-repeat;
+    padding-right: 13px;
+}
+
 header nav {
     padding: 10px 0;
     text-align: right;
diff --git a/static/images/external-link-icon.svg b/static/images/external-link-icon.svg
new file mode 100644
index 0000000..de5c461
--- /dev/null
+++ b/static/images/external-link-icon.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>

+<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12">

+	<path fill="#fff" stroke="#36c" d="M1.5 4.518h5.982V10.5H1.5z"/>

+	<path fill="#36c" d="M5.765 1H11v5.39L9.427 7.937l-1.31-1.31L5.393 9.35l-2.69-2.688 2.81-2.808L4.2 2.544z"/>

+	<path fill="#fff" d="m9.995 2.004.022 4.885L8.2 5.07 5.32 7.95 4.09 6.723l2.882-2.88-1.85-1.852z"/>

+</svg>