「教學」讓網站內的外部連結自動在新分頁開啟

部落格已經經營了一段時間,但是 Google Analytics 發現網頁跳出率一直都很高。一般來說,如果部落格文章內有跳轉其他網站的外部連結,希望不要直接跳轉,而是在新分頁開啟,可以使用 HTML 語法來達成;不過在 Logdown 是使用 markdown 語法來編輯文章,因此沒有 target="_blank" 這樣的語法,雖然 Logdown 編輯器也支援直接輸入 HTML 語法,但如果每個外部連結都要這樣在 markdown 與 HTML 之間切換,實在是很麻煩,況且之前已經寫過那麼多文章,要一個一個修改對懶惰蟲來說實在做不到。

如果只是要讓連結在新分頁開啟,可能還單純一點;但在這個狀況下,是希望部落格內部連結,如:文章與文章之前,可以直接跳轉,不需要開新分頁(畢竟還是在部落格內)但若是跳轉到外部網站,才會觸發開新分頁的指令。這個看似很複雜的功能,其實數行 javascript 就可以達成,因此現就在把它加在網站 <head> 裡面吧!

在網站中加入 javascript 語法

  <script type='text/javascript'>
    window.onload = function() {
      var links = document.links;
      for (var i = 0, linksLength = links.length; i < linksLength; i++) {
        if (links[i].hostname != window.location.hostname) {
          links[i].target = '_blank';
        }
      }
    }
    </script>

如此一來,所有外部連結都會自動在新分頁開啟;而部落格內的其他文章連結(相同網域)則會直接跳轉,是不是很方便呢?當然了,如果不想直接寫在 html 內,也可以自行製作 .js 檔案,再嵌入網站即可。

comments powered by Disqus