hexo中图片与emoji的正确插入方式
weather:☀
hexo中图片的插入与github图床
我在研究如何在博客中插入图片,前期搭建了PicGo+Github图床。
图床搭建教程如下,我用的是vscode,所以同时下载了PicGo插件,并根据网上教程进行了配置。
https://www.fomal.cc/posts/d7fb1ba1.html
https://www.cnblogs.com/xbotter/p/17528063.html
以下是我做的尝试的全过程,虽然还有点不太明白,但是事实证明,我后面图片上传只能使用图床链接了。

npx hexo new biology
现在我想测试以下拓展能不能自行将图片上传到图床

能不能显示呢?看一下结果吧
又失败了

看下下面这个行不行
再用typora试试


为啥啊啊啊啊啊啊啊啊
有的要加?raw=true才显示,┭┮﹏┭┮
绷不住了
文章图片文件管理分类
找到了一个好办法,可以直接在vscode中粘贴图片并很好的管理了
https://www.cnblogs.com/xbotter/p/17528063.html
新增配置项 key 为 “**/*.md” , value 为 你的目标路径。比如我想将图片放在 assets 目录下 markdown文件同名的目录下,那么我就可以设置为assets/${documentBaseName}/${fileName}
其中 ${documentBaseName} 代表markdown文件的文件名,${fileName} 代表图片的文件名。
我是直接设置这个${documentBaseName}/${fileName}
然后图片就可以保存在相应同名文件中了,更便于管理,接着ctrl+shift+p,直接上传图床即可


想做个实验,如果我把上面的图片在文件夹中删除会发生什么呢?
好了,实验结束,事实证明,把本地图片删除之后,图片就会丢失,但是上传到了图床上的图片,用链接的话长久有效
下面这个是原始格式样式
好吧,全用链接吧
hexo中emoji的插入
在hexo中输入标准的markdown的emoji格式,一般情况不会在博客网站中显示出来,搜了一下教程,如下:
https://lisijian.cn/2020/08/12/2020-08-12-hexo%E6%B7%BB%E5%8A%A0emoji%E8%A1%A8%E6%83%85/
https://github.com/crimx/hexo-filter-github-emojis
直接安装插件,进行配置之后就可以显示了😄
超全emoji图库:
https://gist.github.com/rxaviers/7360908
一些天气与自然景观……
sunny, umbrella,cloud,snowflake,snowman,ocean,foggy
截图如下😆😊😄

Butterfly外挂标签
主题butterfly专属标签,介绍文章如下:
https://www.fomal.cc/posts/2013454d.html#2-31-%E9%9A%90%E8%97%8F%E5%9D%97
分栏Tab
摘取一些我感兴趣的知识,以下是butterfly大佬写的,我直接拿过来用了,研究一下咋整。
感觉外挂标签还是挺难的,难以接受😭
https://butterfly.js.org/posts/2df239ce/#Gallery-%E7%9B%B8%E5%86%8A%E5%9C%96%E5%BA%AB
简化一下,有点类似于子集,得搞清楚包含与被包含关系才行:
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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
{% tabs Tags %}
- 1、第一栏-出师表
<!-- tab 出師表 -->
臣……
<!-- endtab -->
- 2、第二栏-图库
<!-- tab 圖庫 -->
{% gallery %}
图片url
{% endgallery %}
<!-- endtab -->
- 3、第三栏-李白
<!-- tab 李白 -->
李白(701年5月19日-762年11月30日),字太白,號青蓮居士,中國唐朝詩人,自言祖籍隴西成紀(今甘肅省天水市秦安縣),先世西涼武昭王李暠之後,與李唐皇室同宗。
- **3.1 分栏1-李白诗集
{% subtabs 李白詩集 %}
<!-- tab 行路難-->
金樽清酒鬥十千,玉盤珍羞值萬錢。
停杯投箸不能食,拔劍四顧心茫然。
欲渡黃河冰塞川,將登太行雪暗天。
閒來垂釣碧溪上,忽復乘舟夢日邊。
行路難,行路難,多歧路,今安在?
長風破浪會有時,直掛雲帆濟滄海。
<!-- endtab -->
<!-- tab 將進酒 -->
君不見,黃河之水天上來,
<!-- endtab -->
<!-- tab 清平調 -->
《清平調詞三首》是唐代大詩人李白的組詩作品
- 3.2 分栏2-清平調
{% subtabs 清平調 %}
<!-- tab 清平調(一) -->
雲想衣裳花想容,春風拂檻露華濃;
<!-- endtab -->
<!-- tab 清平調(二) -->
一枝紅豔露凝香,雲雨巫山空斷腸。
<!-- endtab -->
<!-- tab 清平調(三) -->
名花傾國兩相歡,常得君王帶笑看。
<!-- endtab -->
{% endsubtabs %}
<!-- endtab -->
{% endsubtabs %}
<!-- endtab -->
{% endtabs %}
1 | {% tabs Tags %} |
下面是完整版本:
1 | {% raw %} |
臣亮言:先帝創業未半而中道崩殂,今天下三分,益州疲弊,此誠危急存亡之秋也。然侍衞之臣不懈於內,忠志之士忘身於外者,蓋追先帝之殊遇,欲報之於陛下也。誠宜開張聖聽,以光先帝遺德,恢弘志士之氣,不宜妄自菲薄,引喻失義,以塞忠諫之路也。
李白(701年5月19日-762年11月30日),字太白,號青蓮居士,中國唐朝詩人,自言祖籍隴西成紀(今甘肅省天水市秦安縣),先世西涼武昭王李暠之後,與李唐皇室同宗。
金樽清酒鬥十千,玉盤珍羞值萬錢。
停杯投箸不能食,拔劍四顧心茫然。
欲渡黃河冰塞川,將登太行雪暗天。
閒來垂釣碧溪上,忽復乘舟夢日邊。
行路難,行路難,多歧路,今安在?
長風破浪會有時,直掛雲帆濟滄海。
君不見,黃河之水天上來,
奔流到海不復回?
君不見,高堂明鏡悲白髮,
朝如青絲暮成雪?
人生得意須盡歡,
莫使金樽空對月。
天生我材必有用,
千金散盡還復來。
《清平調詞三首》是唐代大詩人李白的組詩作品,共三首七言樂府詩。第一首從空間角度寫,以牡丹花比楊貴妃的美豔;第二首從時間角度寫,表現楊貴妃的受寵幸;第三首總承一、二兩首,把牡丹和楊貴妃與君王糅合,融為一體。全詩構思精巧,辭藻豔麗,將花與人渾融在一起寫,描繪出人花交映、迷離恍惚的景象,顯示了詩人高超的藝術功力。
雲想衣裳花想容,春風拂檻露華濃;
若非羣玉山頭見,會向瑤台月下逢。
一枝紅豔露凝香,雲雨巫山空斷腸。
借問漢宮誰得似?可憐飛燕倚新粧。
名花傾國兩相歡,常得君王帶笑看。
解識春風無限恨,沉香亨北倚闌千。
将界面改成透明
倒腾半天,总算知道咋把那个大蓝色背景的界面改成透明的了😭,在相应的.yml文件中transparent即可,如果想另外设置可以直接在相应的.md文件中设置top_img:图片url,这样就可以只针对某个页面设置背景了
发现一个好玩的东西,似乎我把图片在本地文件里删除了,但是github的对应文件夹里还有,不知道为啥,这样子的话,就意味着,我可以直接粘贴图片并永久有效?没太搞懂
我晓得了,貌似是程序里有个玩意,你插入了这个图片,就算在文件中删除了,你在文章中还有的话,他又会生成,除非全部没有了。拎不太清,算了,不想纠结了!!!!!


