Halo-Theme-Hao主题1.3.9修改版配置美化
原项目仓库地址:点击进入
Hao主题1.3.9修改版GitHub项目仓库:点击进入
侧栏侧栏小板报
先去申请一个免费地址: 免费获取教程,后台填入。
主题内置好配置信息,后台侧栏获取坐标直接输入就行了。
下面是小板报的配置信息。
// 访客欢迎信息模块(适配 Cloudflare Worker 版) —— PJAX安全版
let ipLocation;
// 默认中心点(博主位置)
const WELCOME_DEFAULT_CENTER = { lng: 111.64, lat: 21.54 };
function getWelcomeCenter() {
const cfg = (window.GLOBAL_CONFIG && GLOBAL_CONFIG.source && GLOBAL_CONFIG.source.welcome)
? GLOBAL_CONFIG.source.welcome : {};
const rawLng = (cfg.locationLng ?? '').toString().trim();
const rawLat = (cfg.locationLat ?? '').toString().trim();
const lng = rawLng === '' ? NaN : Number(rawLng);
const lat = rawLat === '' ? NaN : Number(rawLat);
return {
lng: Number.isFinite(lng) ? lng : WELCOME_DEFAULT_CENTER.lng,
lat: Number.isFinite(lat) ? lat : WELCOME_DEFAULT_CENTER.lat
};
}
function getDistance(e1, n1, e2, n2) {
const R = 6371;
const { sin, cos, asin, PI, hypot } = Math;
const P = (e, n) => { e*=PI/180; n*=PI/180; return {x:cos(n)*cos(e), y:cos(n)*sin(e), z:sin(n)}; };
const a = P(e1,n1), b = P(e2,n2);
const c = hypot(a.x-b.x, a.y-b.y, a.z-b.z);
return Math.round(asin(c/2) * 2 * R);
}
function fetchIpLocation() {
let myUrl = (GLOBAL_CONFIG?.source?.welcome?.key || "").trim();
if (!myUrl.startsWith('http')) {
myUrl = 'https://api.nsmao.net/api/ip/query?key=' + myUrl;
}
$.ajax({
type: 'get',
url: myUrl,
dataType: 'json',
success: function (res) {
const d = res.data || res;
if (res.code === 200 || res.status === "success" || d.ip) {
// 核心修正:补全省份和城市的“省/市”后缀,确保 switch 匹配成功
let p = d.prov || d.region || d.regionName || "";
let c = d.city || "";
if (p && !p.endsWith("省") && !p.endsWith("市") && !p.endsWith("自治区") && !p.endsWith("特别行政区")) p += "省";
if (c && !c.endsWith("市") && !c.endsWith("区") && !c.endsWith("县")) c += "市";
ipLocation = {
ip: d.ip || d.query,
location: {
lat: parseFloat(d.lat) || 0,
lng: parseFloat(d.lng) || parseFloat(d.lon) || 0
},
ad_info: {
nation: (d.country === "CN" || d.country === "United States" || d.country === "US" || d.country === "中国") ? "中国" : (d.country || "外国"),
province: p,
city: c,
district: d.district || ""
}
};
showWelcome();
}
}
});
}
function showWelcome() {
if (!ipLocation) return;
var box = document.getElementById('welcome-info');
if (!box) return;
const { lng: myLng, lat: myLat } = getWelcomeCenter();
const dist = getDistance(myLng, myLat, ipLocation.location.lng, ipLocation.location.lat);
let nation = ipLocation.ad_info.nation;
let province = ipLocation.ad_info.province || "";
let city = ipLocation.ad_info.city || "";
let district = ipLocation.ad_info.district || "";
let ip = ipLocation.ip;
let desc = '带我去你的城市逛逛吧!';
let pos = "";
// 区分国内与国外逻辑
if (nation === "中国" || nation === "CN") {
// 强制拼接成:广东省 深圳市 区
pos = `${province} ${city} ${district}`.trim();
switch (province) {
case "北京市": desc = "北——京——欢迎你~"; break;
case "天津市": desc = "讲段相声吧"; break;
case "河北省": desc = "山势巍巍成壁垒,天下雄关铁马金戈由此向,无限江山"; break;
case "江苏省":
switch (city) {
case "南京市": desc = "这是我挺想去的城市啦"; break;
case "苏州市": desc = "上有天堂,下有苏杭"; break;
default: desc = "散装是必须要散装的"; break;
}
break;
case "广东省":
switch (city) {
case "广州市": desc = "看小蛮腰,喝早茶了嘛~"; break;
case "深圳市": desc = "今天你逛商场了嘛~"; break;
case "阳江市": desc = "阳西!博主家乡~ 欢迎来玩~"; break;
case "佛山市": desc = "黄飞鸿的故乡,咏春拳打一套~"; break;
case "东莞市": desc = "世界工厂,今天搬砖辛苦啦~"; break;
case "珠海市": desc = "看情侣路,去长隆玩了嘛~"; break;
case "中山市": desc = "孙中山故里,今天去哪里吃乳鸽?"; break;
case "惠州市": desc = "去西湖散步,去海边看日出了吗?"; break;
case "江门市": desc = "五邑侨乡,陈皮炖汤喝了吗?"; break;
case "汕头市": desc = "牛肉火锅安排上了吗?潮汕美食名不虚传~"; break;
case "湛江市": desc = "去吃生蚝了吗?海鲜大餐走起~"; break;
case "茂名市": desc = "荔枝之乡,今天吃得甜甜的吗?"; break;
case "肇庆市": desc = "鼎湖山空气好,去洗洗肺吗?"; break;
case "清远市": desc = "去泡温泉,或者去漂流了吗?"; break;
case "韶关市": desc = "丹霞地貌,去爬山运动了吗?"; break;
case "揭阳市": desc = "古城文化,今天有逛逛嘛?"; break;
case "梅州市": desc = "客家文化浓厚,腌面吃了吗?"; break;
case "汕尾市": desc = "海滨小城,今天看海了吗?"; break;
case "潮州市": desc = "逛牌坊街,牛肉丸吃爽了吗?"; break;
case "河源市": desc = "万绿湖畔,今天有去吸氧吗?"; break;
case "云浮市": desc = "禅宗文化,今天心情宁静吗?"; break;
default: desc = "来两斤福建人~"; break;
}
break;
case "河南省":
switch (city) {
case "郑州市": desc = "豫州之域,天地之中"; break;
case "南阳市": desc = "臣本布衣,躬耕于南阳,此南阳非彼南阳!"; break;
case "驻马店市": desc = "峰峰有奇石,石石挟仙气嵖岈山的花很美哦!"; break;
case "开封市": desc = "刚正不阿包青天"; break;
case "洛阳市": desc = "洛阳牡丹甲天下"; break;
default: desc = "可否带我品尝河南烩面啦?"; break;
}
break;
case "湖南省": desc = "74751,长沙斯塔克"; break;
case "四川省": desc = "康康川妹子"; break;
case "广西壮族自治区": desc = "桂林山水甲天下"; break;
case "新疆维吾尔自治区": desc = "驼铃古道丝绸路,胡马犹闻唐汉风"; break;
case "香港特别行政区": desc = "永定贼有残留地鬼嚎,迎击光非岁玉"; break;
case "浙江省": desc = "上有天堂,下有苏杭,今天去西湖了嘛~"; break;
case "福建省": desc = "去武夷山喝杯岩茶,今天心情不错吧~"; break;
case "山东省": desc = "好客山东,今天又去喝啤酒了吗?"; break;
case "辽宁省": desc = "东北老铁,说话带点儿海蛎子味没?"; break;
case "吉林省": desc = "去看长白山天池了嘛?好山好水好风光~"; break;
case "黑龙江省": desc = "哈尔滨的雪景看过了吗?感觉冷不冷?"; break;
case "安徽省": desc = "黄山云海非常美,去打卡了吗?"; break;
case "湖北省": desc = "武汉的热干面吃了吗?黄鹤楼登高望远~"; break;
case "江西省": desc = "庐山风景如画,记得去爬爬山哟~"; break;
case "海南省": desc = "椰风海韵,去三亚潜水了吗?"; break;
case "山西省": desc = "山西面食种类多,今天吃了几种呀?"; break;
case "陕西省": desc = "古都长安,肉夹馍还是那么香吗?"; break;
case "甘肃省": desc = "大漠孤烟直,去敦煌看飞天了嘛?"; break;
case "青海省": desc = "青海湖的水真蓝,去转转湖嘛?"; break;
case "云南省": desc = "彩云之南,今天去大理发呆了吗?"; break;
case "贵州省": desc = "多彩贵州,酸汤鱼确实很开胃呢~"; break;
case "西藏自治区": desc = "圣地拉萨,今天离云端更近了嘛?"; break;
case "内蒙古自治区": desc = "天苍苍野茫茫,今天去草原骑马了嘛?"; break;
case "宁夏回族自治区": desc = "塞上江南,大漠风光真是独特呢~"; break;
case "澳门特别行政区": desc = "澳门风云,今天去走走逛逛了嘛?"; break;
case "台湾省": desc = "宝岛风光无限,记得吃好喝好呀~"; break;
case "重庆市": desc = "山城火锅真的辣,今天挑战了几分辣?"; break;
case "上海市": desc = "魔都节奏快,今天在陆家嘴看风景了吗?"; break;
default: desc = `来自 ${city || province} 的小伙伴你好呀~`;
}
} else {
// 国外显示:国家 + 城市 (若无城市只显示国家)
pos = city ? `${nation} ${city}` : nation;
switch (nation) {
case "US": case "United States": case "美国": pos = "美国 " + city; desc = "Let us live in peace!"; break;
case "JP": case "Japan": case "日本": pos = "日本 " + city; desc = "よろしく,一起去看樱花吗"; break;
case "UK": case "United Kingdom": case "英国": pos = "英国 " + city; desc = "想同你一起夜乘伦敦眼"; break;
case "RU": case "Russia": case "俄罗斯": pos = "俄罗斯 " + city; desc = "干了这瓶伏特加!"; break;
case "FR": case "France": case "法国": pos = "法国 " + city; desc = "C'est La Vie"; break;
case "DE": case "Germany": case "德国": pos = "德国 " + city; desc = "Die Zeit verging im Fluge."; break;
case "AU": case "Australia": case "澳大利亚": pos = "澳大利亚 " + city; desc = "一起去大堡礁吧!"; break;
case "CA": case "Canada": case "加拿大": pos = "加拿大 " + city; desc = "拾起一片枫叶赠予你"; break;
default: desc = "带我去你的国家逛逛吧";
}
}
const hour = new Date().getHours();
let greet = "😴 夜深了,早点休息~";
if (hour >= 5 && hour < 11) greet = "🌤️ 早上好,一日之计在于晨";
else if (hour >= 11 && hour < 13) greet = "☀️ 中午好,记得午休喔~";
else if (hour >= 13 && hour < 17) greet = "🕞 下午好,饮茶先啦!";
else if (hour >= 17 && hour < 19) greet = "🚶♂️ 即将下班,记得按时吃饭~";
else if (hour >= 19 && hour < 24) greet = "🌙 晚上好,夜生活嗨起来!";
if (ip.includes(":")) ip = "好复杂,咱看不懂~(ipv6)";
const html = `欢迎来自 <b><span style="color: var(--kouseki-ip-color);">${pos}</span></b> 的小友 💖<br>
${desc}🍂<br>
当前位置距博主约 <b><span style="color: var(--kouseki-ip-color)">${dist}</span></b> 公里!<br>
您的IP地址为:<b><span class="ip-blur">${ip}</span></b><br>
${greet} <br>`;
box.innerHTML = html;
}
(function () {
if (window.__WELCOME_BIND_ONCE__) return;
window.__WELCOME_BIND_ONCE__ = true;
function pjaxRecalc() {
var box = document.getElementById('welcome-info');
if (!box) return;
try { window.showWelcome && window.showWelcome(); } catch (e) {}
try { window.fetchIpLocation && window.fetchIpLocation(); } catch (e) {}
}
window.addEventListener('load', function () {
try { window.fetchIpLocation && window.fetchIpLocation(); } catch (e) {}
});
document.addEventListener('pjax:complete', pjaxRecalc);
document.addEventListener('pjax:success', pjaxRecalc);
document.addEventListener('page:loaded', pjaxRecalc);
})();
阿里IconFont的Symbol彩色图标

1:打开阿里巴巴iconfont官网,登录账号-新建项目-选择喜欢的图标-添加入库-找到右上角购物车-添加到项目-我的项目-更新代码-选择Symbol格式-复制代码-填入后台设置。
2:也可以在 Halo 后台「全局 head 标签」里注入
<!-- 阿里巴巴 IconFont Symbol 注入 -->
<script src="https://at.alicdn.com/t/c/font_4242261_hx71wjq7ya6.js"></script>
侧栏音乐卡片
1:直接去音乐卡片Github项目仓库免费部署。
2:也可以直接用我部署好的地址:music.oortaka.top,音乐ID改为自己的,例如:https://music.oortaka.top/?id=1806165735&theme=card&title=最近最常听&show_rainbow=1&show_bar=1&mode=light&size=300&show_random=1&type=0
3:仓库有教程,按照那个填入后台设置。


友链底部美化
同右图效果:在后台设置底部显示内容添加下面的代码
<h2 id="友链文章">
<a href="#友链文章" class="headerlink" title="友链文章" draggable="false" data-pjax-state=""></a>
友链文章
</h2>
<div class="tabs" id="test1">
<ul class="nav-tabs">
<li class="tab active"><button type="button" data-href="#test1-1">鱼塘mini</button></li>
<li class="tab"><button type="button" data-href="#test1-2">好文推荐</button></li>
<li class="tab"><button type="button" data-href="#test1-3">实用工具</button></li>
<li class="tab"><button type="button" data-href="#test1-4">通用技术</button></li>
<li class="tab"><button type="button" data-href="#test1-5">前端技术</button></li>
<li class="tab"><button type="button" data-href="#test1-6">博客魔改</button></li>
<li class="tab"><button type="button" data-href="#test1-7">有趣文章</button></li>
</ul>
<div class="tab-contents">
<div class="tab-item-content active" id="test1-1">
<div class="note warning simple">
<p>以下内容自动生成,未经过审核。</p>
</div>
<!-- 这里指定后端“基址”,不要带 /all -->
<div id="cf-container" data-api="https://fcircle.oortaka.top"></div>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
<div class="tab-item-content" id="test1-2">
<ul>
<!--
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://blog.eurkon.com/post/1213ef82.html">
Hexo 博客文章统计图 🔥
</a><br>
本博客的关于本站中的统计部分来源于该教程。
</p>
</li>
-->
</ul>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
<div class="tab-item-content" id="test1-3">
<ul>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://www.antmoe.com/posts/91a1b4e4/index.html">
如何为评论系统快速添加表情
</a><br>
方便快捷的在你的twikoo、Valine、Waline甚至文章中添加表情。
</p>
</li>
</ul>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
<div class="tab-item-content" id="test1-4">
<ul>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://blog.juanertu.com/archives/fccd987.html">
VSCode个人常用插件合集
</a><br>
非常棒的实用VSCode插件合集,值得每个都看看。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://akilar.top/posts/8a76eb87/">
Win10:PowerShell美化教程
</a><br>
一个好看的终端才是好心情的开始。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://nanzx.top/posts/932b/">
Java基础面试题
</a><br>
java干货分享,送给面试要求造核弹的你.
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://www.antmoe.com/posts/2db95804/index.html">
自动提交网址给百度
</a><br>
SEO优化必备,不过不要重复内容提交过多,适度最好。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://www.antmoe.com/posts/77e27eac/index.html">
AppStore降价监控
</a><br>
直呼好家伙!心心念念的app终于不用天天盯着了。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://forever97.top/2021/01/18/htmlquick/">
HTML快捷键
</a><br>
新技能get,再也不用一个字母一个字母去敲了,太方便了~!
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://weilining.cf/119.html">
GitHub fork之后如何同步
</a><br>
在github上直接操作挺繁琐的,用本地git再提交就方便很多了。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://zfe.space/post/python_bili.html">
python数据分析入门——bili数据抓取到数据分析网站的实战记录
</a><br>
冰老师最近的python爬虫力作,功能非常强大,吐血推荐。
</p>
</li>
</ul>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
<div class="tab-item-content" id="test1-5">
<ul>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://blog.ccknbc.cc/posts/i-dont-really-want-html/">
我真的不想要.html
</a><br>
网站地址优化教程。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://noionion.top/44642.html">
麻麻,我有自己的图床啦!简单搭建一个廉价、私人、无限制图片大小的稳定图床
</a><br>
利用阿里云oss搭建图床,不错的教程。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://www.imaegoo.com/2020/h5-smooth-scroll/">
PC 浏览器平滑惯性滚动(smooth scroll)一套简单实现
</a><br>
让电脑滚动页面的时候也可以有惯性。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://blog.juanertu.com/archives/59df034f.html">
那些你总是要用却又死活记不住的css属性
</a><br>
涵盖很多不是特别常用但是偶尔还会用到的css属性。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://www.antmoe.com/posts/61248f6/index.html">
Gulp4简单使用
</a><br>
从零开始学会gulp打包压缩。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://blog.imzjw.cn/posts/rdp-freenom">
利用Google RDP免费注册Freenom域名
</a><br>
白嫖域名的新选择。
</p>
</li>
</ul>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
<div class="tab-item-content" id="test1-6">
<ul>
<!--
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://akilar.top/posts/f99b208/">
基于Butterfly主题的美化日记
</a><br>
Akilar的全部魔改方案教程。
</p>
</li>
-->
</ul>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
<div class="tab-item-content" id="test1-7">
<ul>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://snow.js.org/snow/">
雪(精选集)
</a><br>
小林的小说和随笔,推荐去看。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://www.7b3.org/posts/116.html">
为什么铺天盖地都是Python的广告?
</a><br>
段子手力作。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://snow.js.org/mabaoguo/">
健身房的年轻后生不讲武德,把马保国老师的眼睛给打肿了
</a><br>
年轻人耗子尾汁。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://zfe.space/post/20201213.html">
《赛博朋克2077》:小白萌新避坑指南
</a><br>
冰老师的游戏测评力作。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="http://www.cq.qcwy.org.cn/2020/07/23/life/life-big/">
长大后明白的道理
</a><br>
走心长文,人生不同的阶段都有不同的感悟,对身边对世界都有自己的理解,且不断变化。
</p>
</li>
<li>
<p>
<a target="_blank" rel="noopener external nofollow" href="https://akilar.top/posts/da70cd4e/">
微小说:蜃楼
</a><br>
Aki早期文学力作,文末附带阅读理解答案。
</p>
</li>
</ul>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
<!--
<div class="tab-item-content" id="test1-8">
<p>这个模块的目的是因为通过友链的名称和头像可能会逛得漫无目的,该模块能够帮助访客减少逛消耗的时间,提升效率。提升友链该文章访问量,增加曝光。可能对贵站SEO有帮助。</p>
<p><strong>因时间精力有限,本模块暂不更新了</strong></p>
<p><strong>Q: 怎样才能收录进来呢</strong><br>A: 一般来说友链的置顶文章会优先收录,非博客搭建、非魔改相关文章优先收录,非学习笔记优先收录</p>
<p><strong>Q: 可以自荐吗</strong><br>A: 目前暂不可以自荐,推荐将博客优秀文章置顶</p>
<p><strong>Q: 被收录的可以要求删掉吗</strong><br>A: 可以在评论区留言文章名称,在下次博客更新后删除</p>
<p><strong>Q: 🔥 标志是什么</strong><br>A:对我个人帮助大的文章,不作为文章品质参考,所有收录文章都质量比较高</p>
<button type="button" class="tab-to-top" aria-label="scroll to top">
<i class="haofont hao-icon-arrow-up"></i>
</button>
</div>
-->
</div>
</div>
<details>
<summary>友情链接页免责声明</summary>
<h2 id="免责声明">
<a href="#免责声明" class="headerlink" title="免责声明" data-pjax-state=""></a>
免责声明
</h2>
<p>
本博客遵守美国相关法律。本页内容仅作为方便学习而产生的快速链接的链接方式,对与友情链接中存在的链接、好文推荐链接等均为其他网站。我本人能力有限无法逐个甄别每篇文章的每个字,并无法获知是否在收录后原作者是否对链接增加了违反法律甚至其他破坏用户计算机等行为。因为部分友链网站甚至没有做备案、域名并未做实名认证等,所以友链网站均可能存在风险,请你须知。
</p>
<p>所以在我力所能及的情况下,我会包括但不限于:</p>
<ol>
<li>针对收录的博客中的绝大多数内容通过标题来鉴别是否存在有风险的内容</li>
<li>在收录的友链好文推荐中检查是否存在风险内容</li>
</ol>
<p>但是你在访问的时候,仍然无法避免,包括但不限于:</p>
<ol>
<li>作者更换了超链接的指向,替换成了其他内容</li>
<li>作者的服务器被恶意攻击、劫持、被注入恶意内容</li>
<li>作者的域名到期,被不法分子用作他用</li>
<li>作者修改了文章内容,增加钓鱼网站、广告等无效信息</li>
<li>不完善的隐私保护对用户的隐私造成了侵害、泄漏</li>
</ol>
<p>最新文章部分为机器抓取,本站作者未经过任何审核和筛选,本着友链信任原则添加的。如果你发现其中包含违反中华人民共和国法律的内容,请及时联系和举报。该友链会被拉黑。</p>
<p>
如果因为从本页跳转给你造成了损失,深表歉意,并且建议用户如果发现存在问题在本页面进行回复。通常会很快处理。如果长时间无法得到处理,建议联系
<strong>oortaka0825@gmail.com</strong>。
</p>
</details>
<h2 id="友情链接申请">
<a href="#友情链接申请" class="headerlink" title="友情链接申请" draggable="false" data-pjax-state=""></a>
友情链接申请
</h2>
<p>很高兴能和非常多的朋友们交流,如果你也想加入友链,可以在下方留言,我会在不忙的时候统一添加。</p>
<details>
<summary>🧀 友链申请方式</summary>
<h2 id="本站添加的友链要求">
<a href="#本站添加的友链要求" class="headerlink" title="本站添加的友链要求" data-pjax-state=""></a>
本站添加的友链要求
</h2>
<ol>
<li>能够正常访问</li>
<li>含本站友链</li>
<li>网站类型为<strong>个人博客</strong></li>
</ol>
<p>
请(<a onclick="addFriendLink()" href="#post-comment" data-pjax-state="anchor">点击这里快速添加</a>)
站点信息申请友情链接,申请后在我不忙的时候会统一添加,即使不通过也会给予邮件回复。
</p>
<h2 id="你提交的信息有可能被修改">
<a href="#你提交的信息有可能被修改" class="headerlink" title="你提交的信息有可能被修改" data-pjax-state=""></a>
你提交的信息有可能被修改
</h2>
<p>如果有修改,我会将修改内容进行告知</p>
<ol>
<li>
为了友链相关页面和组件的统一性和美观性,可能会对你的昵称进行缩短处理,例如昵称包含<strong>博客</strong>、<strong>XX的XX</strong>等内容或形式将被简化。
</li>
<li>
为了图片加载速度和内容安全性考虑,头像实际展示图片均使用博客自己图床,所以无法收到贵站自己的头像更新,如果有迫切的更改信息需求,请在本页的评论中添加。
</li>
</ol>
<h2 id="我的友链信息">
<a href="#我的友链信息" class="headerlink" title="我的友链信息" data-pjax-state=""></a>
我的友链信息
</h2>
<p>为了避免图床问题,建议你将头像存储到贵站图床。</p>
<ol>
<li>我的名称: <code>内密心書</code></li>
<li>网站地址: <code>https://oortaka.top</code></li>
<li>描述: <code>喜欢捣鼓的博主</code></li>
<li>头像: <code>https://oortaka.top/upload/10-tuya.png</code></li>
<li>背景: <code>https://oortaka.top/upload/10-tuya.jpeg</code></li>
</ol>
<h2 id="友链申请格式如下"><strong>友链申请格式如下🥳</strong></h2>
<pre class="language-bash" tabindex="0"><code class="hljs language-bash">昵称(请勿包含博客等字样):
网站地址(要求博客地址,请勿提交个人主页):
头像图片url(请提供尽可能清晰的图片,我会上传到我自己的图床):
描述:</code></pre>
<h2 id="友链申请格式示例"><strong>示例 📢:</strong></h2>
<pre class="language-bash" tabindex="0"><code class="hljs language-bash">昵称:困困鱼
网站地址:https://0206.ink
头像图片url:https://oortaka.top/upload/109951167249792628%20(1)-topaz-denoise-enhance-tuya.jpg
描述:喜欢捣鼓的博主
背景: https://oortaka.top/upload/10-tuya.jpeg</code></pre>
</details>
<ol>
<li>我的名称: <code>内密心書</code></li>
<li>网站地址: <code>https://oortaka.top</code></li>
<li>描述: <code>喜欢捣鼓的博主</code></li>
<li>头像: <code>https://oortaka.top/upload/10-tuya.png</code></li>
<li>背景: <code>https://oortaka.top/upload/10-tuya.jpeg</code></li>
</ol>
<p>请<strong>勾选</strong>你符合的条件:</p>
<div id="friendlink_checkboxs">
<p>
<label class="checkbox">
<input type="checkbox" id="checkbox1" onclick="checkForm()">我已添加 <b>内密心書</b> 博客的友情链接
</label>
</p>
<p>
<label class="checkbox">
<input type="checkbox" id="checkbox2" onclick="checkForm()">我的链接主体为 <b>个人</b>,网站类型为<b>博客</b>
</label>
</p>
<p>
<label class="checkbox">
<input type="checkbox" id="checkbox3" onclick="checkForm()">我的网站现在可以在全球区域正常访问
</label>
</p>
<p>
<label class="checkbox">
<input type="checkbox" id="checkbox4" onclick="checkForm()">网站内容符合美国法律法规
</label>
</p>
</div>
<script>
var twikooSubmit = document.getElementsByClassName("tk-submit")[0];
if (twikooSubmit) twikooSubmit.style.opacity = "0";
function checkForm() {
var checkbox1 = document.getElementById("checkbox1");
var checkbox2 = document.getElementById("checkbox2");
var checkbox3 = document.getElementById("checkbox3");
var checkbox4 = document.getElementById("checkbox4");
var twikooSubmit = document.getElementsByClassName("tk-submit")[0];
if (checkbox1.checked && checkbox2.checked && checkbox3.checked && checkbox4.checked) {
twikooSubmit.style.opacity = "1";
twikooSubmit.style.height = "auto";
twikooSubmit.style.overflow = "auto";
var input = document.getElementsByClassName('el-textarea__inner')[0];
let evt = document.createEvent('HTMLEvents');
evt.initEvent('input', true, true);
input.value =
'昵称(请勿包含博客等字样):\n' +
'网站地址(要求博客地址,请勿提交个人主页):\n' +
'头像图片url(请提供尽可能清晰的图片,我会上传到我自己的图床):\n' +
'描述:\n';
input.dispatchEvent(evt);
input.focus();
input.setSelectionRange(-1, -1);
} else {
twikooSubmit.style.opacity = "0";
twikooSubmit.style.height = "0";
twikooSubmit.style.overflow = "hidden";
}
}
</script>
<!-- 自动从 https://fcircle.oortaka.top/all 读取并填充:鱼塘mini / 好文推荐 / 博客魔改 -->
<script>
(function () {
function boot() {
var box = document.getElementById("cf-container");
if (!box || box.dataset.filled) return;
var BASE = (box.dataset && box.dataset.api) ? String(box.dataset.api) : "";
if (!BASE) { console.warn("[friends] 缺少 data-api"); return; }
BASE = BASE.replace(/\/+$/,"");
box.innerHTML = '<p style="opacity:.6">加载中…</p>';
fetch(BASE + "/all?_t=" + Date.now(), { cache: "no-store" })
.then(function (r) { if (!r.ok) throw new Error("HTTP " + r.status); return r.json(); })
.then(function (data) {
var posts = [];
if (Array.isArray(data)) posts = data;
else if (Array.isArray(data.article_data)) posts = data.article_data;
else if (Array.isArray(data.randompost)) posts = data.randompost;
else if (data && typeof data === "object") posts = [data];
posts.sort(function (a,b) {
var ta = new Date(a.updated || a.created || 0).getTime();
var tb = new Date(b.updated || b.created || 0).getTime();
return tb - ta;
});
renderMini(box, posts.slice(0, 8)); // 鱼塘 mini:最新 8 条
renderList("#test1-2 ul", posts.slice(0, 10)); // 好文推荐:最新 10 条
var hackRe = /魔改|美化|主题|样式|布局|CSS|JS|Hexo|Halo|Butterfly|Volantis|Matery|Stellar|Acrylic|NexT|Stun|Yun/i;
renderList("#test1-6 ul", posts.filter(function(p){ return hackRe.test(p.title||""); }).slice(0, 10)); // 博客魔改
box.dataset.filled = "1";
})
.catch(function (e) {
console.error("[friends-tabs] load failed:", e);
box.innerHTML = "<p>加载失败:" + e.message + "</p>";
});
}
function renderMini(container, items) {
if (!items.length) { container.innerHTML = '<p style="opacity:.6">暂无数据</p>'; return; }
var html = '<ul class="mini-list" style="display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:0;padding:0;list-style:none;">' +
items.map(function (p) {
var t = esc(p.title || "(无标题)");
var a = esc(p.author || "");
var d = esc(p.updated || p.created || "");
var l = p.link || "#";
return (
'<li class="mini-item" style="background:var(--heo-card-bg);border-radius:12px;padding:.75rem 1rem;">' +
'<a target="_blank" rel="noopener noreferrer nofollow" href="' + l + '" style="font-weight:600;display:block;line-height:1.4;margin-bottom:.35rem;">' + t + '</a>' +
'<div class="mini-meta" style="font-size:.85em;opacity:.7;">' + a + (a && d ? " · " : "") + d + '</div>' +
'</li>'
);
}).join("") +
"</ul>";
container.innerHTML = html;
}
function renderList(selector, items) {
var ul = document.querySelector(selector);
if (!ul) return;
if (!items.length) { ul.innerHTML = '<li><p style="opacity:.6">暂无数据</p></li>'; return; }
ul.innerHTML = items.map(function (p) {
var t = esc(p.title || "(无标题)");
var a = esc(p.author || "");
var d = esc(p.updated || p.created || "");
var l = p.link || "#";
return '<li><p><a target="_blank" rel="noopener noreferrer nofollow" href="' + l + '">' + t + '</a><br>' + (a ? a + ' · ' : '') + d + '</p></li>';
}).join("");
}
function esc(s){ return String(s).replace(/[&<>"]/g, m => ({'&':'&','<':'<','>':'>','"':'"'}[m])); }
if (document.readyState !== "loading") boot();
document.addEventListener("DOMContentLoaded", boot);
document.addEventListener("pjax:complete", boot);
document.addEventListener("pjax:success", boot);
})();
</script>
<style>
.tk-comments > .tk-submit { opacity: 0; height: 0; transition: opacity .5s, height .5s; overflow: hidden; }
.checkbox { display: flex; align-items: center; }
.checkbox input {
appearance: none; position: relative; height: 16px; width: 16px;
transition: all 0.15s ease-out 0s; cursor: pointer; display: inline-block;
outline: none; border-radius: 2px; flex-shrink: 0; margin-right: 8px;
border: 2px solid #2196f3; pointer-events: none;
}
.checkbox input[type="checkbox"]::before { left: 1px; top: 5px; width: 0; height: 2px; transition: all 0.2s ease-in; transform: rotate(45deg); }
.checkbox input[type="checkbox"]::after { right: 7px; bottom: 3px; width: 2px; height: 0; transition: all 0.2s ease-out; transform: rotate(40deg); transition-delay: 0.25s; }
.checkbox input[type="checkbox"]:checked { background: #2196f3; }
.checkbox input[type="checkbox"]:checked::before { left: 0; top: 7px; width: 6px; height: 2px; }
.checkbox input[type="checkbox"]:checked::after { right: 3px; bottom: 1px; width: 2px; height: 10px; }
.checkbox.minus input[type="checkbox"]::before { left: 1px; top: 5px; width: 10px; height: 2px; }
.checkbox.minus input[type="checkbox"]:checked::after { left: 1px; top: 5px; width: 10px; height: 2px; }
.checkbox.plus input[type="checkbox"]::before { transform: rotate(0); left: 1px; top: 5px; width: 0; height: 2px; }
.checkbox.plus input[type="checkbox"]::after { transform: rotate(0); left: 5px; top: 1px; width: 2px; height: 0; }
.checkbox.plus input[type="checkbox"]:checked::before { left: 1px; top: 5px; width: 10px; height: 2px; }
.checkbox.plus input[type="checkbox"]:checked::after { left: 5px; top: 1px; width: 2px; height: 10px; }
.checkbox.times input[type="checkbox"]::before { transform: rotate(45deg); left: 3px; top: 1px; width: 0; height: 2px; }
.checkbox.times input[type="checkbox"]::after { transform: rotate(135deg); right: 3px; top: 1px; width: 0; height: 2px; }
.checkbox.times input[type="checkbox"]:checked::before { left: 1px; top: 5px; width: 10px; height: 2px; }
.checkbox.times input[type="checkbox"]:checked::after { right: 1px; top: 5px; width: 10px; height: 2px; }
.checkbox input[type="radio"] { border-radius: 50%; }
.checkbox input[type="radio"]::before { content: ""; display: block; width: 8px; height: 8px; border-radius: 50%; margin: 2px; transform: scale(0); transition: all 0.25s ease-out; }
.checkbox input[type="radio"]:checked::before { transform: scale(1); background: var(--text-bg-hover); }
.checkbox red input { border-color: #fe5f58; }
.checkbox.red input[type="checkbox"]:checked { background: #fe5f58; }
.checkbox.red input[type="radio"]:checked::before { background: #fe5f58; }
.checkbox.green input { border-color: #3dc550; }
.checkbox.green input[type="checkbox"]:checked { background: #3dc550; }
.checkbox.green input[type="radio"]:checked::before { background: #3dc550; }
.checkbox.yellow input { border-color: #ffbd2b; }
.checkbox.yellow input[type="checkbox"]:checked { background: #ffbd2b; }
.checkbox.yellow input[type="radio"]:checked::before { background: #ffbd2b; }
.checkbox.cyan input { border-color: #1bcdfc; }
.checkbox.cyan input[type="checkbox"]:checked { background: #1bcdfc; }
.checkbox.cyan input[type="radio"]:checked::before { background: #1bcdfc; }
.checkbox.blue input { border-color: #2196f3; }
.checkbox.blue input[type="checkbox"]:checked { background: #2196f3; }
.checkbox.blue input[type="radio"]:checked::before { background: #2196f3; }
.checkbox p { display: inline-block; margin-top: 2px !important; margin-bottom: 0 !important; }
.checkbox input[type="checkbox"]::before,
.checkbox input[type="checkbox"]::after { position: absolute; content: ""; background: #fff; }
</style>

友链鱼塘配置
1:进入配置项目部署后端地址,在fc_settings.yaml文件里面把link: "https://oortaka.top/links/"改成自己的友链地址,鱼塘会在这里拉取你添加的友链并读取他们的文章。
2:部署好后端后台token地址填写配置地址:例如https://fcircle.oortaka.top/后面必须要有/。

关于页面访问统计
进入51LA网站添加你的站点。
1:进入V6 流量统计系统-查看报表-配置-参数设置-把数据挂件打开。
2:进入V6 流量统计系统-查看报表-配置-参数设置-统计代码-获取SDK追踪代码-把显示代码的id:"3e8j7Si43kD2NNbv",把这串ID填入主题后台的统计ID。

侧栏文章订阅
1:下载文章订阅插件:点击前往
2:后台主题设置在侧栏添加自定义页面,填入下面的代码:
<follow-card
class="sidebar-subscription"
show-multiline="true"
text-align="center"
show-title="false">
</follow-card>
<style>
/* 全局变量:控制卡片圆角、内边距、宽高等 */
:root {
--follow-card-radius: 1rem; /* 卡片圆角 */
--follow-input-radius: 1rem; /* 输入框圆角 */
--follow-button-radius: 1rem; /* 按钮圆角 */
/* 卡片内边距(你原来的三档,先修正语法) */
--follow-card-padding-sm: 0.2rem;
--follow-card-padding-md: 0.2rem;
--follow-card-padding-lg: 0.2rem;
/* 新增:宽高与左右加宽(出血)控制 */
--follow-card-width: 272px; /* 主体宽度 */
--follow-card-max-width: 272px; /* 最大宽度;可改成 420px 等 */
--follow-card-height: 160px; /* 固定高度就填数值,比如 220px */
--follow-card-min-height: 100px; /* 最小高度,比如 160px */
--follow-card-padding-x: 0.001rem; /* 左右内边距(便于单独控制) */
--follow-card-padding-y: 1.3rem; /* 上下内边距 */
--follow-card-bleed-x: 1rem; /* 左右“出血”量;想更宽就设 1rem/1.5rem */
}
/* 消费这些变量 */
follow-card.sidebar-subscription {
display: block;
box-sizing: border-box;
width: var(--follow-card-width);
max-width: var(--follow-card-max-width);
height: var(--follow-card-height);
min-height: var(--follow-card-min-height);
padding: var(--follow-card-padding-y) var(--follow-card-padding-x);
/* 让卡片突破外层左右内边距(可选)*/
margin-left: calc(-1 * var(--follow-card-bleed-x));
margin-right: calc(-1 * var(--follow-card-bleed-x));
border-radius: var(--follow-card-radius);
}
/* 若组件暴露了内层 part,可同步把最小高度传进去(可选,没暴露就忽略) */
follow-card.sidebar-subscription::part(container),
follow-card.sidebar-subscription::part(card) {
min-height: var(--follow-card-min-height);
}
/* 把订阅卡整块往上提,数值自己调 */
.card-widget .item-content > follow-card.sidebar-subscription,
.card-widget follow-card.sidebar-subscription,
follow-card.sidebar-subscription {
margin-top: -30px !important; /* 改成 -16 / -28 / -36 都行 */
display: block !important;
position: relative;
z-index: 2; /* 防止被标题盖住 */
}
</style>

-topaz-denoise-enhance-tuya.jpg)
