食用教程

1.下载单页源码,解压放在博客的根目录,上传整个文件目录即可

typecho基于UptimeRobot的友链状态监控页面-1

2.注册并登陆UptimeRobot

3.登录之后,点击Add New Monitor

登录之后会自动跳转,若没有跳转,点击直达访问

typecho基于UptimeRobot的友链状态监控页面-2

  • 在弹出的界面选择Https然后依次网站名称,链接,然后勾选右边的邮箱

typecho基于UptimeRobot的友链状态监控页面-3

  • 添加后点击上方导航栏My settings,然后一直往下滑找到APISettings点击Show/hide然后搜索网站名点击创建

typecho基于UptimeRobot的友链状态监控页面-4

  • 复制api,打开单页目录js/config.js按照已有的样式即可,接下来你要做的就是把每个友情链接的网站和名字都添加一遍,然后放在JS文件中。

typecho基于UptimeRobot的友链状态监控页面-5

typecho基于UptimeRobot的友链状态监控页面-6

  • API配置好后在需要添加的地方添加下面代码
<iframe src="https://博客链接/linkmonitor/index.html" height="540" frameborder="no" border="0" width="100%"></iframe>

typecho基于UptimeRobot的友链状态监控页面-7

效果展示

站点预览

typecho基于UptimeRobot的友链状态监控页面-8

文件下载

此处内容需要评论回复后(审核通过)方可阅读。

如果觉得我的文章对你有用,请随意赞赏