不用修改主题内文件,方便以后升级
JS
在 /source/js/custom.js
添加以下代码,点击申请一个key
并填入提示位置,修改自己的经纬度
// 进行 fetch 请求
fetch('https://api.76.al/api/ip/query?key=你的key') // 申请地址:https://api.76.al/
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
ipLocation = data;
if (isHomePage()) {
showWelcome();
}
})
.catch(error => console.error('Error:', error));
function getDistance(e1, n1, e2, n2) {
const R = 6371;
const { sin, cos, asin, PI, hypot } = Math;
let getPoint = (e, n) => {
e *= PI / 180;
n *= PI / 180;
return { x: cos(n) * cos(e), y: cos(n) * sin(e), z: sin(n) };
};
let a = getPoint(e1, n1);
let b = getPoint(e2, n2);
let c = hypot(a.x - b.x, a.y - b.y, a.z - b.z);
let r = asin(c / 2) * 2 * R;
return Math.round(r);
}
function showWelcome() {
if (!ipLocation || !ipLocation.data) {
console.error('ipLocation data is not available.');
return;
}
let dist = getDistance(121.413921, 31.089290, ipLocation.data.lng, ipLocation.data.lat); // 修改自己的经度(121.413921)纬度(31.089290)
let pos = ipLocation.data.country;
let ip = ipLocation.ip;
let posdesc;
// 新增ipv6显示为指定内容
if (ip.includes(":")) {
ip = "<br>好复杂,咱看不懂~(ipv6)";
}
// 以下的代码需要根据新API返回的结果进行相应的调整
switch (ipLocation.data.country) {
case "日本":
posdesc = "よろしく,一起去看樱花吗";
break;
case "美国":
posdesc = "Let us live in peace!";
break;
case "英国":
posdesc = "想同你一起夜乘伦敦眼";
break;
case "俄罗斯":
posdesc = "干了这瓶伏特加!";
break;
case "法国":
posdesc = "C'est La Vie";
break;
case "德国":
posdesc = "Die Zeit verging im Fluge.";
break;
case "澳大利亚":
posdesc = "一起去大堡礁吧!";
break;
case "加拿大":
posdesc = "拾起一片枫叶赠予你";
break;
case "中国":
pos = ipLocation.data.prov + " " + ipLocation.data.city + " " + ipLocation.data.district;
switch (ipLocation.data.prov) {
case "北京":
posdesc = "北——京——欢迎你~~~";
break;
case "天津":
posdesc = "讲段相声吧";
break;
case "河北":
posdesc = "山势巍巍成壁垒,天下雄关铁马金戈由此向,无限江山";
break;
case "山西":
posdesc = "展开坐具长三尺,已占山河五百余";
break;
case "内蒙古自治区":
posdesc = "天苍苍,野茫茫,风吹草低见牛羊";
break;
case "辽宁":
posdesc = "我想吃烤鸡架!";
break;
case "吉林":
posdesc = "状元阁就是东北烧烤之王";
break;
case "黑龙江":
posdesc = "很喜欢哈尔滨大剧院";
break;
case "上海":
posdesc = "众所周知,中国只有两个城市";
break;
case "江苏":
switch (ipLocation.data.city) {
case "南京":
posdesc = "这是我挺想去的城市啦";
break;
case "苏州":
posdesc = "上有天堂,下有苏杭";
break;
default:
posdesc = "散装是必须要散装的";
break;
}
break;
case "浙江":
switch (ipLocation.data.city) {
case "杭州":
posdesc = "东风渐绿西湖柳,雁已还人未南归";
break;
default:
posdesc = "望海楼明照曙霞,护江堤白蹋晴沙";
break;
}
break;
case "河南":
switch (ipLocation.data.city) {
case "郑州":
posdesc = "豫州之域,天地之中";
break;
case "信阳":
posdesc = "品信阳毛尖,悟人间芳华";
break;
case "南阳":
posdesc = "臣本布衣,躬耕于南阳此南阳非彼南阳!";
break;
case "驻马店":
posdesc = "峰峰有奇石,石石挟仙气嵖岈山的花很美哦!";
break;
case "开封":
posdesc = "刚正不阿包青天";
break;
case "洛阳":
posdesc = "洛阳牡丹甲天下";
break;
default:
posdesc = "可否带我品尝河南烩面啦?";
break;
}
break;
case "安徽":
posdesc = "蚌埠住了,芜湖起飞";
break;
case "福建":
posdesc = "井邑白云间,岩城远带山";
break;
case "江西":
posdesc = "落霞与孤鹜齐飞,秋水共长天一色";
break;
case "山东":
posdesc = "遥望齐州九点烟,一泓海水杯中泻";
break;
case "湖北":
switch (ipLocation.data.city) {
case "黄冈市":
posdesc = "红安将军县!辈出将才!";
break;
default:
posdesc = "来碗热干面~";
break;
}
break;
case "湖南":
posdesc = "74751,长沙斯塔克";
break;
case "广东":
switch (ipLocation.data.city) {
case "广州":
posdesc = "看小蛮腰,喝早茶了嘛~";
break;
case "深圳":
posdesc = "今天你逛商场了嘛~";
break;
case "阳江":
posdesc = "阳春合水!博主家乡~ 欢迎来玩~";
break;
default:
posdesc = "来两斤福建人~";
break;
}
break;
case "广西壮族自治区":
posdesc = "桂林山水甲天下";
break;
case "海南":
posdesc = "朝观日出逐白浪,夕看云起收霞光";
break;
case "四川":
posdesc = "康康川妹子";
break;
case "贵州":
posdesc = "茅台,学生,再塞200";
break;
case "云南":
posdesc = "玉龙飞舞云缠绕,万仞冰川直耸天";
break;
case "西藏自治区":
posdesc = "
CSS
在 source/css/custom.css
原来的地方覆盖以下代码
#welcome-info {
white-space: pre-wrap;
border-radius: 14px;
--kouseki-welcome-color: #49B1F5;
--kouseki-ip-color: #49B1F5;
--kouseki-gl-size: 16px!important;
}
引入
在主题配置文件_config.{themename}.yml
里inject
配置中的bottom
引入jquery.min.js
inject:
bottom:
- <script type="text/javascript" src="https://unpkg.zhimg.com/jquery@latest/dist/jquery.min.js"></script> # jquery.min.js
在主题配置文件 _config.{themename}.yml
下的inject
配置项中的head
引入custom.css
inject:
head:
- <link rel="stylesheet" href="/css/custom.css">
在aside
配置项中修改
card_announcement:
enable: true
content: <div id="welcome-info"></div>
© 版权声明
THE END
暂无评论内容