orangejuice's blog

挂了请务必叫我

About ?

Welcome to orangejuice's blog

之前的 hexo-next 是几年前配的，npm 一大堆 warning，跑的时候还会爆 error。

于是最近重新配了一次，发现这两年 next 很多东西都自带集成方案了，版本也好很多，至少弄完不太会爆一车 error 的。

配置方案大约如下：

1
2
3
4
5
6
7
8
9
10
11
$ node -v 
v20.5.0
$ npm install -g hexo-cli@4.3.1 
$ mkdir hexo
$ cd hexo
$ hexo init # init hexo directory
$ git clone --branch v8.18.0 https://github.com/next-theme/hexo-theme-next themes/next
$ npm un hexo-renderer-marked
$ npm i hexo-renderer-pandoc@0.4.0
$ npm install hexo-generator-searchdb@1.4.1 --save
$ npm i hexo-deployer-git

in _config.yml:

打开 search

1
2
3
4
5
search:
  path: search.xml
  field: post
  content: true
  format: html

in themes/next/_config.yml:

  1. 修改 scheme 为 Gemini

  2. 在 menu 栏取消注释 about, tags, categories

  3. 取消注释 avatar 的 url，并改为 images/avatar.jpg，并在 ./source/images/avatar.jpg 放置头像文件

  4. 打开 mathjax 选项

  5. 调整 codeblock 设置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
codeblock:
  # Code Highlight theme
  # All available themes: https://theme-next.js.org/highlight/
  theme:
    light: default
    dark: stackoverflow-dark
  prism:
    light: prism
    dark: prism-dark
  # Add copy button on codeblock
  copy_button:
    enable: true
    # Available values: default | flat | mac
    style: mac
  # Fold code block
  fold:
    enable: true
    height: 500

package 信息：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
"name": "hexo-site",
"version": "0.0.0",
"dependencies": {
  "hexo": "^6.3.0",
  "hexo-deployer-git": "^4.0.0",
  "hexo-generator-archive": "^2.0.0",
  "hexo-generator-category": "^2.0.0",
  "hexo-generator-index": "^3.0.0",
  "hexo-generator-searchdb": "^1.4.1",
  "hexo-generator-tag": "^2.0.0",
  "hexo-renderer-ejs": "^2.0.0",
  "hexo-renderer-pandoc": "^0.4.0",
  "hexo-renderer-stylus": "^3.0.0",
  "hexo-server": "^3.0.0",
  "hexo-theme-landscape": "^1.0.0"
}

关于 bg 的修改：

themes/next/source/css/_variables/base.styl 修改为：

1
$content-bg-color             = rgba(255, 255, 255, 0.8);

修改：

themes/next/layout/_layout.njk 增加 script：




以下部分是原文：

这是一个悲惨的蒟蒻ZJOIer的博客，目前正在打Cu的边缘努力挣扎

不善口胡，擅长套简单的模板题~~

写过一点点多项式板板题，然鹅并没有任何用处

没看过concrete 数学

没有语文功底

很少打CodeForces，CodeChef，Topcoder，AtCoder

代码环境：

Dev-Cpp × Emacs × VSCode ×

vim √ gvim √

Windows √ Linux √

文章书写的时间跨度非常长，所以前面的可能不像是一个人写的

如果有出现很sb的错误，请@评论区 or qq 2946316707

板子问题:

rep/drep是两端闭区间的循环,reg是register,erep是前向星遍历

ll:long long

ull:unsigned long long

u64:uint64_t=unsigned long long

u32:uint32_t=unsigned

i64:int64_t=long long

i32:int32_t=int

Pii: pair <int,int>

Mod1,Mod2是加减法取模

cmin,cmax=checkmin,checkmax

由于本人变量名比较随意，经常出现::，这个是访问主函数外(也就是空命名空间)的变量

代码中可能出现的[..](..){}是C++11的lambda语句

代码中可能出现的模板在这里

for(.. : ..)是容器完全遍历，需要C++11

模板用到了default template，以及可能出现别的问题，因此编译需要C++11

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
#include<bits/stdc++.h>
using namespace std;

typedef long long ll;
typedef double db;
typedef unsigned long long ull;
typedef pair <int,int> Pii;
#define reg register
#define pb push_back
#define mp make_pair
#define Mod1(x) ((x>=P)&&(x-=P))
#define Mod2(x) ((x<0)&&(x+=P))
#define rep(i,a,b) for(int i=a,i##end=b;i<=i##end;++i)
#define drep(i,a,b) for(int i=a,i##end=b;i>=i##end;--i)
template <class T> inline void cmin(T &a,T b){ ((a>b)&&(a=b)); }
template <class T> inline void cmax(T &a,T b){ ((a<b)&&(a=b)); }

char IO;
template <class T=int> T rd(){
	T s=0; int f=0;
	while(!isdigit(IO=getchar())) if(IO=='-') f=1;
	do s=(s<<1)+(s<<3)+(IO^'0');
	while(isdigit(IO=getchar()));
	return f?-s:s;
}


阅读帮助

常用的，阅读帮助

\(\forall,\exists\)任意，存在

\(\oplus\) oplus 异或

\([\text{Logical Expression}]\)艾弗森括号，根据其中逻辑表达式的真伪，值为1/0

\(\overline{x}\underline{x}\)上升幂下降幂

\(\lfloor x\rfloor\) 向下取整

\(\lceil x\rceil\) 向上取整

\(|S|\) 集合大小，或者是矩阵行列式

\([x^i]f(x)\) 多项式\(f(x)\)的\(x^i\)一项的系数

\(f^{(i)}(x)\) 对\(f(x)\)求\(i\)阶导

组合数的几种形式\(\begin{aligned}C(n,m),C_n^m,\binom{n}{m}\end{aligned}\)

第一类斯特林数\(\begin{bmatrix}n\\m\end{bmatrix}\)

第二类斯特林数\(\begin{Bmatrix}n\\m\end{Bmatrix}\)





博客配置日志

采用Github Page + Hexo 静态博客的简单模式

环境

Ubuntu20.04 LTS + Win10 dual boot (64bit)

dependences

1
2
3
4
5
6
7
8
9
10
11
12
# git & npm
sudo apt update
sudo apt upgrade
sudo apt install git
sudo apt install npm
sudo apt install curl

# Nodejs 12.x|14.x
sudo apt -y install curl dirmngr apt-transport-https lsb-release ca-certificates
curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -
sudo apt install -y nodejs

如果网络不好你可能会连不上nodesource，甚至导致一些奇怪的bug

可以尝试用curl -XDELETE https://deb.nodesource.com/setup_14.x-删除库

然后等网络好了重新来

初始化Hexo博客

1
2
3
4
5
6
7
mkdir hexo
cd hexo
sudo npm install hexo-cli -g
hexo init [博客名]
cd [博客名]

hexo s -g

浏览器打开localhost:4000预览

安装next主题

1
2
git clone https://github.com/theme-next/hexo-theme-next themes/next
vim _config.yml

将themes: landscape 修改为 themes: next 注意yml格式: 后的空格

一些常用的配置 1.schemes的四种自带可选 2.darkmode 3.copy button 4.

启用mathjax

1
2
3
npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-kramed --save
npm uninstall hexo-math --save

node_modules/hexo-renderer-kramed/lib/renderer.js

1
2
3
4
function formatText(text) {
    // Fit kramed's rule: $$ + \1 + $$
    return text.replace(/`\$(.*?)\$`/g, '$$$$$1$$$$');
}

修改为 

1
2
3
function formatText(text) {
    return text;
}

node_modules/hexo-renderer-mathjax/mathjax.html 最后一行<script> 改为

1
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"> </script>

node_modules/kramed/lib/rules/inline.js 修改为

1
2
escape: /^\\([`*\[\]()#$+\-.!_>])/,
em: /^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,

在 主config和主题config都加上 

1
2
mathjax:
	enable: true

这个math引擎存在很多问题

修正1.

如果有多个大括号连用（包括转义的\{，建议加空格防止暴毙

但是实测，有时候用begin{aligned} end{aligned} 还是死

修正2.

公式可以用

1
{%raw%}$...${%endraw%}

强制解决一部分

但是可能会产生一些新的bug（所以谨慎用）

合理调配，似乎可以搞定一些问题

以及\empty \sub \and \or 之类的不统一语法永远搞不定。。

所以改成\emptyset \subset \vee \wedge

为此写了一个垃圾的批处理，顺便加了一个垃圾的autotag功能

太长了就不放了...

配置Deploy (git)

1
2
3
git config --global user.name "你的git用户名"
git config --global user.email "你的git登录邮箱"
ssh-keygen -t rsa -C "你的git登录邮箱"

密码设置为空，即按三下回车 

1
cat ~/.ssh/id_rsa.pub
把内容复制到github账户的setting : SSH and GPG keys里面 测试成功 
1
ssh -T git@github.com
(记得输yes)

安装deploy插件

1
npm install hexo-deployer-git --save

修改主config 

1
2
3
4
deploy:
  type: git
  repository: git@github.com:用户名/用户名.github.io.git
  branch: master
然后就可以hexo d试一试了

1
npm install hexo-abbrlink --save

然后就可以在permalink 里修改 

1
2
# permalink: :year/:month/:day/:title/
permalink: :year/:month/:day/:abbrlink.html

文章置顶

1
2
npm uninstall hexo-generator-index --save
npm install hexo-generator-index-pin-top --save

然后用 

1
2
3
4
5
6
---

top: true

---

作为置顶标识

打开主题layout中，找到post.swig ，找到<div class="post-meta">

如果没有找到，尝试去某个带macro作为名字的文件夹里找

然后在<div class="post-meta">下面插入

1
2
3
4
5
{% if post.top %}
    <i class="fa fa-thumb-tack"></i>
    <font color="RED">置顶</font>
    <span class="post-meta-divider">|</span>
{% endif %}

增加搜索功能

1
npm install hexo-generator-searchdb --save

主config增加 

1
2
3
4
5
search:
  path: search.xml
  field: post
  format: html
  limit: 10000

主题config直接enable local_search即可

插入网易云

在/themes/next/layout/_macro/sidebar.swig 中选择自己要的地方插入网易云的外链

修改字体

修改 

1
2
font:
	global:  xxx
但是实际上好像没有什么必要

补充menu

1
2
3
hexo new page "categories"
hexo new page "tags"
hexo new page "about"

然后在每个新生成的index.md头上的yml中添加type，比如 

1
2
3
4
---
type: categories

---

添加代码块折叠

咕着先

增加统计功能

主题config

1.找到busuanzi_count:设置enable: true

2.在footer下添加

counter: true

在themes/next/layout/_partials/foot.swig加入

1
2
3
4
5

{% if theme.footer.counter %}
    <script async src="//dn-lbstatics.qbox.me/busuanzi/2.3/busuanzi.pure.mini.js"></script>
{% endif %}

收录百度搜索

好麻烦的说

在成功双线配置到coding之前，百度是没有办法爬到的

到百度站长网站

进入用户中心|站点管理添加网站，然后一项项填

最后验证网站选择HTML标签验证（第二个），把给你的 <meta name="baidu-site-verification" content=" **** " />

把content 复制到主题config 的baidu_site_verification:即可

站点地图

1
2
npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save

在主config加入 

1
2
3
4
sitemap:
	path: sitemap.xml
baidusitemap:
	path: baidusitemap.xml

手动提交baidu的链接就是xx.github.io/baidusitemap.xml

百度自动推送

（这东西百度好像不太久之前关停了，但是没事先放着）

将主题 config 里面的 baidu_push enable

然后在themes/next/layout/_third_party/baidu-push.swig 中插入

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script>
(function(){
    var bp = document.createElement('script');
    var curProtocol = window.location.protocol.split(':')[0];
    if (curProtocol === 'https') {
        bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
    }
    else {
        bp.src = 'http://push.zhanzhang.baidu.com/push.js';
    }
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(bp, s);
})();
</script>

百度统计

去官网注册

然后登记网站，在它给你的源码里找到hm.src = "https://hm.baidu.com/hm.js?

把hm.js?后面的东西拿出来放到主题config里的baidu_analytics:


google 搜索收录

去这里，选择网页前缀，然后选择 HTML标记验证

然后放到主题config的google_site_verification:即可


修改字体大小

在themes/next/source/css/_variables/base.styl里

有这么个玩意儿，直接改就是了，直接修改上面那个是全局修改

1
2
3
4
5
6
7
8
9
// Font size
$font-size-base           = (hexo-config('font.enable') and hexo-config('font.global.size') is a 'unit') ? unit(hexo-config('font.global.size'), em) : 1em;
$font-size-smallest       = .75em;
$font-size-smaller        = .8125em;
$font-size-small          = .875em;
$font-size-medium         = 1em;
$font-size-large          = 1.125em;
$font-size-larger         = 1.25em;
$font-size-largest        = 1.5em;


修改背景图片，以及透明度

新的hexo 博客移除了一些东西，不如themes\next\source\css_custom\custom.styl

但是主题config里有这么个东西

1
2
3
4
5
6
7
8
9
10
11
12
13
# Define custom file paths.
# Create your custom files in site directory `source/_data` and uncomment needed files below.
custom_file_path:
  #head: source/_data/head.swig
  #header: source/_data/header.swig
  #sidebar: source/_data/sidebar.swig
  #postMeta: source/_data/post-meta.swig
  #postBodyEnd: source/_data/post-body-end.swig
  #footer: source/_data/footer.swig
  #bodyEnd: source/_data/body-end.swig
  #variable: source/_data/variables.styl
  #mixin: source/_data/mixins.styl
  #style: source/_data/styles.styl

直接去掉注释会覆盖main.styl，导致解析暴毙

于是在main.styl下面加入

1
@import "../_data/styles.styl";

然后在source/_data/styles.styl加入

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
29
// background settings:
body {
    background:url(/images/background.png); // 可以是路径也可以是链接
    background-repeat: no-repeat; // 不重复
    background-attachment:fixed; // 固定住背景图片
    background-position:50% 50%; // 图片位置：居中
    background-size: 100% 100%; // 图片长宽扩充为100%
    // background-size: cover
}

// transparency settings:
.content-wrap {
	opacity: 0.8;
}

.sidebar {
	opacity: 0.8;
}

.header-inner {
	background: rgba(255,255,255,0.8);
}

.popup {
  opacity: 0.8;
}



修改tabsize

读取mathjax渲染的html会发现

代码框都是<pre></pre>包住的

所以在上面的style.styl文件里加入

1
2
3
pre{
    tab-size:4;
}


修改侧边距

找死我了原来在css/_schemes

我用的是Gemini，它引用了Pisces

于是在Pisces/_layout.styl 里改

不是很好调（不是很了解怎么调），于是抄了别人的改了一点

把下面放在

css/_schemes/Pisces/_layout.styl

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
29
30
31
32
33
34
35
36
// 以下为新增代码！！
header{ width: 90% !important; }
header.post-header {
  width: auto !important;
}
.container .main-inner { width: 90%; }

// 这里不算的话，对于不同的sidebar-width会炸
.content-wrap { width: 'calc(100% - %s)' % unit($sidebar-width + $sidebar-offset, 'px'); }

.header {
  +tablet() {
    width: auto !important;
  }
  +mobile() {
    width: auto !important;
  }
}

.container .main-inner {
  +tablet() {
    width: auto !important;
  }
  +mobile() {
    width: auto !important;
  }
}

.content-wrap {
  +tablet() {
    width: 100% !important;
  }
  +mobile() {
    width: 100% !important;
  }
}

修改行间距

source\css\_common\scaffolding\base.styl，修改

1
2
3
p{
    margin: 0 0 15px 0;
}


背景图自动切换

css太难了奥

于是写了一个js

先在source/js/中新建一个userbj.js

在layout/_layout.swig中导入，在</body>上面加入

1
<script type="text/javascript" src="/js/userbg.js">   </script>

然后自己写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
/* change background */

Timeinterval= 0.5*60*1000; //ms
a=[
"background.png",
"background3.jpg",
"background4.png",
"background5.png",
"background6.jpg",
"background7.jpg"
];
console.log("loaded userbg.js");
var obj=document.body;//document.getElementById("body");
//console.log(obj);
temp=obj.style.cssText;
//console.log(temp);
var pos=-1;
changeBackground=function(){
	pos=parseInt(Math.random()*a.length);
	console.log(pos);
	obj.style.cssText=temp+"background:url(/images/"+a[pos]+") no-repeat fixed;"
	+ "background-position:50% 50%;" // 图片位置：居中
	+ "background-size: cover";
	console.log(obj.style.cssText);
};
//console.log(temp);
setInterval(changeBackground,Timeinterval);

2021-6-11

虽然不知道为什么，但是网易云外链炸了

于是暂时撤下

1
2
3
4
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width="100%" height="330" 
src="//music.163.com/outchain/player?type=0&amp;id=5300764257&amp;auto=0&amp;height=330">
</iframe>


2021-7-7

日子好像不太吉利

增加了music page，采用hexo-tag-aplayer | MetingJs

1
$ npm install --save hexo-tag-aplayer

有待完善，会添加别的东西

0%