Blogger 讓外部連結自動在新視窗開啟
Blogger 筆記:讓外部連結自動在新視窗開啟。

撰寫文章時或許會加入一些外部連結,Blogger 預設是在相同視窗開啟連結網頁,讀者在瀏覽文章時點擊連結於離開當前網頁,要繼續閱讀內容還要按上一頁非常麻煩。這時加入一段程式讓外部連結自動在新視窗開啟,就能避免上述情況也不必每次設定新視窗開啟,方便訪客瀏覽也增加停留時間。


程式碼:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
jQuery("a").each(function(index) {
var r = new RegExp("^https://whhnote");
if (!r.test(jQuery(this).attr('href'))) {
jQuery(this).attr('target', '_blank');
}
});
</script>
將程式碼中"https://whhnote"改成自己部落格的網址。(例如 https://xiaoyao.tw)

使用說明:

Blogger 後台 →「範本」→「編輯HTML」。(註:編輯 HTML 前請先備份範本。)
Blogger 讓外部連結自動在新視窗開啟

找到 </body>,在上面加入程式碼儲存範本。
Blogger 讓外部連結自動在新視窗開啟

將程式加入後會自動分辨連結,站內連結在相同視窗開啟,外部連結在新視窗中開啟。

2017/12/23 補充:
上面程式碼的『https://whhnote』,用網址作為判斷是否外部連結。這種方式有個缺點,若使用其他外掛(如:相關文章、隨機文章),先連結外部再導回站內文章,同樣會在新視窗開啟。如果有使用自訂網址的話,也會讓所有連結(站內&外部)都在新視窗開啟。

可將判斷條件修改成『http://"+document.domain+"』,判斷是否為相同網域,不同網域在新視窗開啟。修改後程式碼如下:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
jQuery("a").each(function(index) {
var r = new RegExp("^(https://"+document.domain+")");
if (!r.test(jQuery(this).attr('href'))) {
jQuery(this).attr('target', '_blank');
}
});
</script>

參考文章:
讓非本站的外部連結, 自動開新視窗-Hank to hanker-Learning Note