配置HEXO环境1234567891011121314151617181920212223242526272829303132# 先下载解压NodeJSwget https://nodejs.org/download/release/v22.14.0/node-v22.14.0-win-x64.zipC:\Soft\7ZIP\7z.exe x C:\Users\leux\Downloads\node-v22.14.0-win-x64.zip -oC:\Softren node-v22.14.0-win-x64 Nodejs# 再安装初始化Hexocd C:\Soft\Nodejsset PATH=%PATH%;C:\Soft\Nodejs # 临时设置Windows环境变量npm install hexo-cli -g # 安装Hexo到 C:\Soft\Nodejs\node_moduleshexo init www # 此步需要git命令来克隆源码cd C:\Soft\Nodejs\wwwnpm install # 将依赖安装到到 C:\Soft\Nodejs\www\node_moduleshexo server # 开启Hexo服务器hexo clean # 清理public目录hexo generate # 生成public目录# 修改Hexo的基本配置:www/_config.yml#################################################title: 云端笔记subtitle: '学习的备忘录'description: '好记性不如烂笔头'keywords: 云端笔记, leux, 零壹, 云端, 备忘录, 笔记author: leuxlanguage: zh-CNtimezone: ''url: https://leux.cnpermalink: doc/:title.htmltheme: next#################################################
安装NEXT主题123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475# 既可手动下载主题解压到 C:\Soft\Nodejs\www\themes# https://github.com/next-theme/hexo-theme-next/archive/refs/tags/v8.22.0.zip# 也可使用NPM自动安装主题指定版本cd C:\Soft\Nodejs\wwwnpm install hexo-theme-next@8.22.0# 修改Next主题配置:www/node_modules/hexo-theme-next/_config.yml##################################################################################################minify: true # 是否允许压缩 Hexo 生成的文件scheme: Gemini # 主题的视图方案open_graph: # 是否在社交媒体上显示网页的预览内容 enable: false options:menu: # 菜单栏中显示的页面 home: / || fa fa-home archives: /archives/ || fa fa-archive categories: /categories/ || fa fa-th tags: /tags/ || fa fa-tagsmenu_settings: # 菜单栏中显示图标,菜单栏中显示对应数目 icons: true badges: truesocial_icons: # 侧边栏中是否显示社交链接的图标 enable: false icons_only: false transition: falsefooter: # 页尾显示的内容 since: 2016 icon: name: fa fa-user animated: false #color: "#ff0000" copyright: powered: false beian: enable: true icp: 粤ICP备19106113号post_meta: # 是否显示帖子的描述文本、创建日期、更新日期、类别 item_text: true created_at: true updated_at: enable: false another_day: false categories: truesymbols_count_time: # 是否显示字数和预计阅读所需时间,需额外安装插件 hexo-word-counter separated_meta: false item_text_total: falsetag_icon: true # 是否将文章底部标签左侧的符号 # 替换成图标back2top: # 是否启用返回页首按钮,是否将按钮放在侧边栏中,是否在按钮中显示滚动百分比 enable: true sidebar: true scrollpercent: truepjax: true # 是否启用 PJAX 支持motion: # 关闭动画效果 enable: falsebaidu_analytics: abcdefghijklmnopqrstuvwxyz123456 # 百度统计vendors: # 静态资源的CDN提供方,internal 为Next内部资源CDN提供方,plugins 为第三方插件CDN提供方 # Available values: local | jsdelivr | unpkg | cdnjs | custom internal: custom plugins: custom custom_cdn_url: https://s4.zstatic.net/ajax/libs/${cdnjs_name}/${version}/${cdnjs_file}##################################################################################################
分类与标签页面12345678910111213141516171819# 不创建的话侧边栏中的分类与标签页面点击无反应hexo new page tags # 创建标签页面hexo new page categories # 创建分类页面# 创建后还需要添加 type: "***" 到其中,否则页面空白,最后文件的路径及内容如下C:\Soft\Nodejs\www\source\tags\index.md---title: 标签分类date: 2025-03-22 13:51:52type: "tags"---C:\Soft\Nodejs\www\source\categories\index.md---title: 页面分类date: 2025-03-22 13:51:52type: "categories"---
添加本地搜索项1234567891011121314151617cd C:\Soft\Nodejs\wwwnpm install hexo-generator-searchdb# 先修改Hexo配置:www/_config.ymlsearch: path: search.xml # 默认情况下文件路径是 /search.xml,如果文件扩展名为 .json,则输出格式为 JSON。 field: post # 要搜索的搜索范围,post 仅搜索所有帖子,page 只搜索所有页面,all 将涵盖您博客的所有帖子和页面 content: false # 是否包含每篇文章的全部内容, 如果为 false 则生成的结果仅包含标题和其他元信息,不包括内容 format: raw # 页面内容的形式,html 被缩小的原始html字符串,striptags 原始html字符串被删减并删除所有标签,raw 每个帖子或页面的Markdown文本# 再修改Next配置:hexo-theme-next/_config.ymllocal_search: enable: true trigger: auto # auto 输入触发搜索。manual 按回车键或搜索按钮触发搜索 top_n_per_article: 1 # 显示每篇文章的前 n 个结果,通过设置为 -1 显示所有结果 unescape: false # 将 html 字符串转义为可读字符串 preload: false # 在页面加载时预加载搜索数据
首页显示的摘要123456789101112131415161718192021222324252627282930313233343536# 由于在Next 7.6中已经移除自动将主页中的文章摘录的功能,即无法使用 auto_excerpt 这一特性-auto_excerpt:- enable: false- length: 150方法一:手动写概述---title: 让首页显示部分内容date: 2020-02-23 22:55:10description: 这是显示在首页的概述,正文内容均会被隐藏。---方法二:文章截断,在需要截断的地方加入:# 首页就会显示这条以上的所有内容(如果为空则显示全文),隐藏接下来的所有内容。# 旧的md文档仅需在第8行添加: 即可实现空概述,在Linux下将当前目录下所有.md文件中插入sed -i "7a <\!--more-->\n" `find -type f -name "*.md"`方法三:使用 hexo-excerpt 插件来完成npm install hexo-excerpt --save# 在Hexo配置文件 _config.yml 中添加以下代码:excerpt: depth: 3 # 摘录的深度,即生成的摘录内容所包含的层级标题数量 excerpt_excludes: [] # 不生成摘录的页面列表 more_excludes: [] # 不使用标签的页面列表 hideWholePostExcerpts: true # 是否隐藏全文摘录(当文章较短时,可能不需要摘录)# 在主题配置文件 hexo-theme-next/_config.yml 中,启用摘录描述和阅读全文按钮选项:excerpt_description: true # 是否在摘录下方显示文章描述read_more_btn: true # 是否显示阅读全文按钮
修改字体的大小1234567891011121314151617181920212223242526272829# 既可修改主题配置 theme/next/_config.yml 中font的size,默认NexT使用微软雅黑字体font: enable: true global: external: true family: Lato size: .75# 也可修改主题样式 hexo-theme-next/source/css/_variables/base.styl 中第104~112的font-size-base后面的 , em) : 1em; 改为 , em) : .875em;// 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; # sidebar中字体的大小,【首页】【归档】【分类】【标签】【搜索】$font-size-small = .875em; # 代码块,文章目录,和最后的footer字体大小$font-size-medium = 1em;$font-size-large = 1.125em; # 标题和文章内容的字体大小$font-size-larger = 1.25em;$font-size-largest = 1.5em; # 文章标题的字体大小# 关于em和px间的换算:.625em=10px .75em=12px .8125em=13px 0.875em=14px 1em=16px# 以前用的V6版中设置的值如下// Font size$font-size-base = 14px$font-size-base = unit(hexo-config('font.global.size'), px) if hexo-config('font.global.size') is a 'unit'$font-size-small = $font-size-base - 2px$font-size-smaller = $font-size-base - 4px$font-size-large = $font-size-base + 2px$font-size-larger = $font-size-base + 4px
修改主题的宽度123456789101112131415# Pisces和Gemini样式请修改:hexo-theme-next/source/css/_variables/Pisces.styl 中第13~14行的如下值:$content-desktop = 'calc(100% - %s)' % unit($content-desktop-padding / 2, 'px');//$content-desktop-large = 1160px;//$content-desktop-largest = 73%;$content-desktop-large = 85em;$content-desktop-largest = 85%;# Muse和Mist样式请修改:hexo-theme-next/source/css/_variables/base.styl 中第198~200行的如下值:$content-desktop = 700px;$content-desktop-large = 800px;$content-desktop-largest = 900px;# 以前用的V6版中的值如下,修改宽度教程:https://xlline.github.io/2019/06/19/Hexo-postwidth/$main-desktop = 960px$main-desktop-large = 1200px
其他相关的知识
为文章页面最下面的tags添加展示图标 # hexo ,在主题配置文件中更改 tag_icon: true 。或者打开 themes/next/layout/_macro/post.swig 文件,搜索 rel="tag"># ,将那个 # 换成 即可显示图标
修改Hexo默认的端口号,既可以 hexo server -p 80 时指定,也可修改 www/node_modules/hexo-server/index.js 中默认的 port: 4000