主题 on 醉后的星星

Hugo博客搭建及stack主题设置

Sun, 06 Jul 2025 08:38:00 +0000

安装Hugo

Hugo有标准版、扩展版（extended），还有一个部署版（extended_withdeploy）,扩展板多了图像和Sass处理器，部署版支持直接部署到google、AWS云等。

直接下载扩展版：https://github.com/gohugoio/hugo/releases/

解压后将hugo.exe目录添加到全局环境变量中。

新建站点

hugo new site quickstart

初始化git

git init

hugo命令见官方指南：https://hugo.opendocs.io/getting-started/

安装主题

hugo主题网站：https://themes.gohugo.com.cn/

这里使用stack主题：https://stack.jimmycai.com/

安装主题

直接使用git命令或者手动下载放到themes目录下

git submodule add https://github.com/CaiJimmy/hugo-theme-stack/ themes/hugo-theme-stack

主题设置

stack主题设置参考：https://stack.jimmycai.com/config/

以下本站设置：

baseURL = 'http://kizx.gitee.io/'
languageCode = 'zh-cn'
title = '醉后的星星'
theme = 'hugo-theme-stack'
copyright = 'kizx'
DefaultContentLanguage = 'zh-cn'


[params]
favicon = "/favicon.ico"

[params.sidebar]
#compact = true
emoji = '🔞'
subtitle = "我好菜啊"
avatar.enabled = true
avatar.local = true
avatar.src = "img/avatar.gif"

[params.Footer]
since = 2019
#customText = ""

[params.Article]
headingAnchor = true
math = true
readingTime = false

[params.widgets]
homepage = [
 {type = 'search'},
 {type = 'archives'},
 {type = 'tag-cloud'},
]
page = [
 {type = 'toc'},
 {type = 'categories'},
]

[params.opengraph]
twitter.site = "kizx"
twitter.card = "summary"
enabled = true
src = "img/default.jpg"
local = true

[menu]
[[menu.social]]
identifier = 'github'
url = 'https://github.com/kizx'
params.icon = 'brand-github'

[[menu.social]]
identifier = 'bilibili'
url = 'https://space.bilibili.com/22411920'
params.icon = 'brand-bilibili'

左侧菜单页设置：

直接将hugo-theme-stack\exampleSite\content\page拷贝到网页的content\page中

需要出现在菜单栏中的页面通过在md文件的Front Matter中添加：

menu:
 main:
 name: title (optional)
 weight: -90
 params:
 icon: icon-name

或者直接在配置文件中添加，但在配置文件中添加会缺少当前惨淡选中高亮显示。

参考

使用hugo stack主题快速搭建博客

【Hugo】配置 (stack 主题)

图标下载

如何用 GitHub Pages + Hugo 搭建个人博客

OneDrive-OneManager云盘程序onemoe主题

Wed, 19 Feb 2020 13:28:00 +0000

假期刚看了一点css教程，就花了两个晚上给onedrive-OneManager重新写了个样式当作练手了，本来是想在原有的基础上做一点美化，但程序原样式都是内部样式，而且还有许多内联样式，改起来超级麻烦，所以干脆就从头开始重写了。

下载地址

[scode type=“green”]下载地址[/scode]

预览

[scode type=“green”]在线预览[/scode] 虽然本人的审美不咋地，但是原主题那个超大的圆角我已经忍了很久了┻━┻ ヘ╰( ??ε?? ╰)，主题的配色我不是很懂，你要是不喜欢反正在我css的基础上改起来也简单。

使用说明

[tabs] [tab name="~~旧版本~~"]

简单点就是直接把下载的onemoe.php复制到theme文件夹下然后网站后台切换主题即可。
我的onemoe.php其实是在classic.php基础上改的，本着尽量不改动内部的原则（其实是我不会php,另一个是改动的越少主程序更新时就修改的越少），改动的地方是把head里所有内部样式删除，然后替换成下面这句。 <link rel="stylesheet" href="[onemoe.css的地址]" type="text/css" />
更新多盘后发现多了个div不好定位，无奈只好在内部加了两个onemoe的class，一个位于底部readme，一个位于多盘位置，另外删除了文件大小和时间两个标题的内联样式。所以如果你用这个主题出现什么问题，除了显示样式上的问题，其余的bug肯定与我无瓜。
现在我把onemoe.css文件放在我的网站上并提供了百度cdn加速，如果你想修改主题配色什么的，可以直接在我的css上进行修改，然后把你修改的css文件放在自己的onedrive目录或者别的cdn处，然后把上面的链接替换下就可以了，主题更新时同理也只需把新的css文件链接替换下就行。 [/tab] [tab name=“新版本” active=“true”]
程序已内置本主题，后台切换主题即可使用。
或者可以手动下载onemoe.html放在程序theme文件夹下后台启用主题，以此来获取最新主题。
本主题只是基于classic主题的css重写，并未改动原主题任何主体内容。
css文件默认从 https://cdn.jsdelivr.net/gh/kizx/onemoe-theme/onemoe.min.css 加载，你也可以自行修改上述地址，改成自己的cdn地址。

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/kizx/onemoe-theme/onemoe.min.css" type="text/css" />

[/tab] [/tabs]

PyCharm主题，插件推荐

Sun, 16 Feb 2020 10:50:00 +0000

Setting -> Plugins里搜索相应插件名即可，或者去网页 https://plugins.jetbrains.com/pycharm 搜索插件下载后本地安装亦可，唯一的问题可能就是网络连接性可能不太好。

主题推荐

先说说主题设置，下好主题后在设置Appearance里切换主题。设完主题后还可以设置代码样式，这两个是可以分开设置的，比如我主题是One Dark，代码样式是Atom One Dark。如果你不喜欢现有的代码配色风格，可以在Color Theme网站下载喜欢的配色，然后在代码样式里导入即可。

另外字体也可以自定义，软件界面字体在settings->appearance里修改。代码字体在settings->editor->font里（如果直接改这里没用，点上面有个感叹号那里，其实就是color scheme font里改）。

1. One Dark

主题地址我最常用的主题，还有一个Atom One Dark的主题也不错。

2. Material Theme UI

主题地址这大概是使用最广泛的主题了吧，毕竟人家样式全，美化全面，但是个人不是很喜欢。

3. The Doki-Doki Theme

主题地址看这名字就知道是一款二次元主题，不仅有心跳人物的主题，还包含Re0等二次元人物，下面只列举部分，作者更新相当勤快，可以说是老二次元了。 [album] [/album]

4. gruvbox-theme

主题地址深色配色很舒服

5. Visual Studio Code Dark Plus Theme

主题地址 vscode风格主题，适合vscode爱好者

插件推荐

1. CodeGlance

可以像VScode一样在右侧显示预览条，插件地址

2. Save Actions

Pycharm的代码格式化每次都要按快捷键太麻烦了，有了这个插件就可以在保存的时候自动格式化了，插件地址插件需要在Setting -> Other Settings里启动才行唯一不足的是这个插件的设置是针对每个项目单独设置的，默认下图是都没有勾选的，每次新开一个工程都需要重新设置一遍要想新建工程时默认勾选，需要你打开软件时在configure里进行设置（前提设置打开软件弹出这个界面而非上次的工程）该插件还有另一个分支版本功能相同Save Actions Reborn

3. Background Image Plus +

可以设置背景图的插件，插件地址，下载后在下图所示的位置设置背景图片文件夹。如果只是一张图的话，软件默认就带这个功能，不需要插件。

4. Key Promoter X

如果你使用鼠标点击了某个按钮，右下角就会弹窗提醒你相应的快捷键，想不记住快捷键都难。

5. Translation

翻译插件，可以随时随地一键翻译，再也不用担心读不懂源码注释了，插件地址，使用方法可以参照插件地址。

6.Atom Material Icons

插件地址，更改文件图标的插件。

7.Rainbow Brackets

彩虹括号，插件地址

8.Indent Rainbow

彩虹缩进，插件地址

9.Rainbow Fart

彩虹屁插件，一个在你编程时持续用语音夸你写的牛逼的插件，插件地址，支持自定义语音包：https://github.com/izhangzhihao/intellij-rainbow-fart

10.Nyan Progress Bar

彩虹猫进度条，插件地址

11.中文语言包

官方出的中文语言包，比什么汉化都要好使插件地址

附

官方帮助：https://www.jetbrains.com/help/pycharm/2020.1/quick-start-guide.html 一个很全的设置说明：https://blog.csdn.net/u013088062/article/details/50388329 对部分设置选项功能进行说明：https://segmentfault.com/a/1190000022799670 一些有用的设置：https://cloud.tencent.com/developer/news/393471 一个炒鸡棒的PyCharm 中文指南：http://pycharm.iswbm.com/zh_CN/latest/index.html

Typecho+Handsome主题美化

Sat, 28 Dec 2019 06:06:00 +0000

美化教程

handsome使用文档

handsome社区分享

史上最全的handsome美化，没有之一！

typecho文章挂载Bilibili视频

弹窗提醒以及个性化提示

插件

代码高亮插件Code Prettify

Typecho炫彩鼠标插件:HoerMouse

EditorMD + handsome 编辑器插件整合

WowScroll动感元素插件

WenYu特效管理插件

博主的介绍

<!--博主介绍的闪字特效-->
<span class="text-muted text-xs block">
 <div id="chakhsu"></div>
 <script>
 var chakhsu = function (r) {
 function t() {
 return b[Math.floor(Math.random() * b.length)]
 }

 function e() {
 return String.fromCharCode(94 * Math.random() + 33)
 }

 function n(r) {
 for (var n = document.createDocumentFragment(), i = 0; r > i; i++) {
 var l = document.createElement("span");
 l.textContent = e(), l.style.color = t(), n.appendChild(l)
 }
 return n
 }

 function i() {
 var t = o[c.skillI];
 c.step ? c.step-- : (c.step = g, c.prefixP < l.length ? (c.prefixP >= 0 && (c.text += l[c.prefixP]),
 c.prefixP++) : "forward" === c.direction ? c.skillP < t.length ? (c.text += t[c.skillP],
 c.skillP++) : c.delay ? c.delay-- : (c.direction = "backward", c.delay = a) : c.skillP >
 0 ? (c.text = c.text.slice(0, -1), c.skillP--) : (c.skillI = (c.skillI + 1) % o.length, c
 .direction = "forward")), r.textContent = c.text, r.appendChild(n(c.prefixP < l.length ?
 Math.min(s, s + c.prefixP) : Math.min(s, t.length - c.skillP))), setTimeout(i, d)
 } /*以下内容自定义修改*/
 var l = "",
 o = ["我好菜啊"].map(function (r) {
 return r + ""
 }),
 a = 2,
 g = 1,
 s = 5,
 d = 75,
 b = ["rgb(110,64,170)", "rgb(150,61,179)", "rgb(191,60,175)", "rgb(228,65,157)", "rgb(254,75,131)",
 "rgb(255,94,99)", "rgb(255,120,71)", "rgb(251,150,51)", "rgb(226,183,47)", "rgb(198,214,60)",
 "rgb(175,240,91)", "rgb(127,246,88)", "rgb(82,246,103)", "rgb(48,239,130)", "rgb(29,223,163)",
 "rgb(26,199,194)", "rgb(35,171,216)", "rgb(54,140,225)", "rgb(76,110,219)", "rgb(96,84,200)"
 ],
 c = {
 text: "",
 prefixP: -s,
 skillI: 0,
 skillP: 0,
 direction: "forward",
 delay: a,
 step: g
 };
 i()
 };
 chakhsu(document.getElementById('chakhsu'));
 </script>
</span>

左侧边栏导航

{"name":"留言板","class":"iconfont icon-liuyan","link":"https://www.2bboy.com/guestbook.html","target":"_self"},
{"name":"动态","class":"iconfont icon-dongtai2","link":"https://www.2bboy.com/cross.html","target":"_self"},
{"name":"归档","class":"iconfont icon-rili2","link":"https://www.2bboy.com/file.html","target":"_self"},
{"name":"追番","class":"iconfont icon-pgc_bangumi","link":"https://www.2bboy.com/bangumi.html","target":"_self"},
{"name":"云盘","class":"iconfont icon-yun","link":"https://pan.2bboy.com/Public"},
{"name":"home","status":"hide"}

顶部导航

{"name":"bilibili","class":"iconfont icon-bilibili-fill","link":"https://space.bilibili.com/22411920"},
{"name":"github","class":"iconfont icon-github","link":"https://github.com/kizx"},
{"name":"steam","class":"iconfont icon-steam","link":"https://steamcommunity.com/id/kizxmoe"},
{"name":"talk","status":"hide"}

时光机社交按钮

{"name":"微博","class":"fontello fontello-weibo","link":"https://weibo.com/u/5938819173"},
{"name":"github","class":"fa fa-github","link":"https://github.com/kizx"},
{"name":"gitee","class":"fa fa-git","link":"https://gitee.com/kizx"},
{"name":"steam","class":"fa fa-steam","link":"https://steamcommunity.com/id/kizxmoe"},
{"name":"bilibili","status":"single","link":"https://space.bilibili.com/22411920"},
{"name":"网易云","status":"single","link":"https://music.163.com/#/user/home?id=111496719"},
{"name":"bangumi","status":"single","class":"fa fa-heartbeat","link":"http://bangumi.tv/user/305237"}

pjax回调函数

<!--彩色标签云-->
let tags = document.querySelectorAll("#tag_cloud-2 a");
let colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999"];
tags.forEach(tag => {
 tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
 tag.style.backgroundColor = tagsColor;
});
<!--代码高亮-->
if (typeof Prism !== 'undefined') {
Prism.highlightAll(true,null);}
<!--复制提示-->
kaygb_copy();

博客底部左侧

<div class="github-badge">
<a href="./" title="?2019 kizx">
<span class="badge-subject">Copyright</span><span class="badge-value bg-blue">?2019 kizx</span>
</a>
</div>
 |
<div class="github-badge">
<a href="http://beian.miit.gov.cn" target="_blank" title="陕ICP备19016973号" style="cursor: url("/usr/plugins/HoerMouse/static/image/dew/link.cur"), pointer;">
<span class="badge-subject">陕ICP备</span><span class="badge-value bg-green">19016973号</span>
</a>
</div>

博客底部右侧

<div class="github-badge">
<a href="http://www.typecho.org" target="_blank" title="由 Typecho 强力驱动" style="cursor: url("/usr/plugins/HoerMouse/static/image/dew/link.cur"), pointer;">
<span class="badge-subject">Powered</span><span class="badge-value bg-blue">Typecho</span>
</a>
</div>
 |
<div class="github-badge">
<a href="https://www.ihewro.com/archives/489/" target="_blank" title="Handsome主题" style="cursor: url("/usr/plugins/HoerMouse/static/image/dew/link.cur"), pointer;">
<span class="badge-subject">Theme</span><span class="badge-value bg-orange">Handsome</span>
</a>
</div>

自定义css

/* 首页文章列表悬停上浮 */

.blog-post .panel:not(article) {
 transition: all 0.3s;
}

.blog-post .panel:not(article):hover {
 transform: translateY(-10px);
 box-shadow: 0 8px 10px rgba(73, 90, 47, 0.47);
}

/* 头像呼吸光环和鼠标悬停旋转放大 */

.img-full {
 width: 100px;
 border-radius: 50%;
 animation: light 4s ease-in-out infinite;
 transition: 0.5s;
}

.img-square, .img-circle {
 transition: 0.5s;
}

.img-square:hover, .img-circle:hover {
 transform: scale(1.15) rotate(360deg);
}

.img-full:hover {
 transform: scale(1.15) rotate(720deg);
}

@keyframes light {
 0% {
 box-shadow: 0 0 4px #f00;
 }
 25% {
 box-shadow: 0 0 16px #0f0;
 }
 50% {
 box-shadow: 0 0 4px #00f;
 }
 75% {
 box-shadow: 0 0 16px #0f0;
 }
 100% {
 box-shadow: 0 0 4px #f00;
 }
}

/*底部页脚*/

.github-badge {
 display: inline-block;
 border-radius: 4px;
 text-shadow: none;
 font-size: 12px;
 color: #fff;
 line-height: 15px;
 background-color: #abbac3;
 margin-bottom: 5px;
}

.github-badge .badge-subject {
 display: inline-block;
 background-color: #4d4d4d;
 padding: 4px 4px 4px 6px;
 border-top-left-radius: 4px;
 border-bottom-left-radius: 4px;
}

.github-badge .badge-value {
 display: inline-block;
 padding: 4px 6px 4px 4px;
 border-top-right-radius: 4px;
 border-bottom-right-radius: 4px;
}

.github-badge .bg-blue {
 background-color: #007ec6;
}

.github-badge .bg-orange {
 background-color: #ffa500;
}

.github-badge .bg-red {
 background-color: #f00;
}

.github-badge .bg-green {
 background-color: #3bca6e;
}

.github-badge .bg-purple {
 background-color: #ab34e9;
}

/*Bilibili视频挂载*/

.iframe_video {
 position: relative;
 width: 100%;
}

@media only screen and (max-width: 767px) {
 .iframe_video {
 height: 15em;
 }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
 .iframe_video {
 height: 20em;
 }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
 .iframe_video {
 height: 30em;
 }
}

@media only screen and (min-width: 1200px) {
 .iframe_video {
 height: 40em;
 }
}

.iframe_cross {
 position: relative;
 width: 100%;
 height: 0;
 padding-bottom: 75%;
}

.iframe_cross iframe {
 position: absolute;
 width: 100%;
 height: 100%;
 left: 0;
 top: 0;
}

自定义javascript

/* 彩色标签云 */
let tags = document.querySelectorAll("#tag_cloud-2 a");
let colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999"];
tags.forEach(tag => {
 tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
 tag.style.backgroundColor = tagsColor;
})
/* 复制提示 */
kaygb_copy();
function kaygb_copy(){$(document).ready(function(){$("body").bind('copy',function(e){hellolayer()})});var sitesurl=window.location.href;function hellolayer(){
$.message({
 message: "尊重原创，转载请注明出处！<br> 本文作者：醉后的星星<br>原文链接：<br>"+sitesurl,
 title: "复制成功",
 type: "success",
 autoHide: !1,
 time: "15000"
 })
}}

自定义Head

<!--图标-->
<link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<!--分享内容-->
<meta itemprop="name" content="醉后的星星" />
<meta itemprop="image" content="https://www.2bboy.com/usr/uploads/txmk.jpg" />
<meta name="description" itemprop="description" content="我好菜啊" />
<!--百度统计-->

<!--动态标题-->
<script>document.addEventListener('visibilitychange', function () { if (document.visibilityState == 'hidden') { normal_title = document.title; document.title = '人呢？快回来！'; } else { document.title = normal_title; } });</script>

pio插件设置

{
 "welcome": ["你好，欢迎来到本站！", "有问题欢迎留言"],
 "touch": [
 "你这个绅士！",
 "别碰我！",
 "你在干什么？",
 "再摸我就报警了！",
 "HENTAI!",
 "你够了喔！",
 "萝莉是什么呀"
 ],
 "skin": ["想看看我的新服装吗？", "新衣服真漂亮~"],
 "home": "点击这里回到首页",
 "link": "https://docs.paul.ren/pio/#/",
 "referer": "Hi，欢迎来自 %t 的朋友",
 "close": "QWQ 下次再见吧~",
 "custom": [
 {
 "type": "read",
 "selector": ".post-meta>h2 a"
 },
 {
 "selector": ".music-box",
 "text": "你想听歌吗o((;=? 3? =))o～?"
 },
 {
 "selector": ".comment-form-comment",
 "text": "填写真实邮箱可以收到回复通知哦(??ω-)～"
 },
 {
 "selector": ".searchform",
 "text": "会搜索的人运气不会太差o(≧▽≦)o"
 },
 {
 "selector": ".dropdown:nth-last-child(4)",
 "text": "想关注我的bilibili频道吗"
 },
 {
 "selector": ".dropdown:nth-last-child(3)",
 "text": "人生苦短"
 },
 {
 "selector": ".dropdown:nth-last-child(2)",
 "text": "可以不玩，不能没有"
 }
 ]
}