在逛别人的博客的时候,发现了有一种叫go.php
的东西,可以经过自己站点的网页再跳转出去,方便SEO优化。但是像Hexo这类静态博客,想要从源HTML修改链接难度有点大,这里我们采用JavaScript动态修改。
部署Go Jumper到Github Pages
博主根据这个大佬的博客里的二次跳转,魔改了一个静态版:Go Jumper
所以,现在登陆你的Github账号,Fork这个仓库,选择你的个人账户。
Fork完毕后,点击Settings->Pages,将原分支从none
修改为master
,目录保持为/(root)
,然后Save。
这样,你自己的Go Jumper就成功部署在https://[你的Github用户名].github.io/go-jumper/
了。
当然,你也可以绑定自己的域名,或者部署到其他的平台,这里不展开赘述。
修改配置
为了方便,我们这边直接在线修改:打开https://github.com/[你的Github用户名]/go-jumper/edit/master/config.json
,修改以下内容:
1 2 3 4 5 6 7 8 9 10
| { "sitename":"pai233の小站", "allowlist": [ "pai233.top" ], "backTo": { "url": "https://blog.pai233.top/", "sitename": "pai233の小窝" } }
|
修改完成后保存。
动态修改
新建[主题根目录]/source/js/link-checker.js
,内容如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
| $(document).ready(function(){ checkLink(); }); $(document).on('pjax:complete', function () { checkLink(); }); async function checkLink(){ console.log("Running...") let link = document.getElementsByTagName('a'); for(var i=0;i<link.length;i++){ if(link[i].href==="" || link[i].className==="gitter-open-chat-button")continue; if(!await checkLocalSite(link[i].href)){ link[i].href = "https://[你的Go Jumper部署地址]/#"+window.btoa(link[i].href) console.log("edit.") } } } async function checkLocalSite(url){ try{ console.log("check:",url) let domain = url.split("/")[2]; if(domain.endsWith("[你的博客域名]")||domain.endsWith("[本地测试域名]"))return true; return false; }catch(err){ return true; } }
|
然后,我们要将代码注入到主题中,在主题_config.yml
中找到inject
项:
1 2 3 4 5 6 7
| inject: head: - <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> - <script src="/js/link-checker.js"></script> bottom:
|
这样,当博客加载完毕的时候,博客的全部外链就会被加上二级跳转,但是源HTML里的外链不变。
注意
在index.html
中,博主插入了广告代码,有需要的可自行删除:
1 2 3 4 5 6 7 8 9 10 11
| <div id="google-ads"> <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-1820088263747150" data-ad-slot="3739765077"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div>
|