基于Hexo搭建Next主题博客

article/2025/11/11 5:24:06

Next

链接地址:https://github.com/caozongpeng/hexo-theme-next

NexT 是一个高质量并且优雅的Hexo 主题。这是精心制作做出来的 hexo 主题。

如果你对此主题非常喜欢,欢迎Star & Fork,非常感谢。

预览界面

首页

在这里插入图片描述

底部

在这里插入图片描述

相册

在这里插入图片描述

文章

在这里插入图片描述

搜索

在这里插入图片描述

安装 Installation

1. 在终端切换到hexo 根目录. 在hexo目录下一定有 node_modules, source, themes 和其他文件夹:

$ cd hexo
$ ls
_config.yml  node_modules  package.json  public  scaffolds  source  themes

2. 从 github 上获取主题 。

$ git clone git@github.com:caozongpeng/hexo-theme-next.git themes/next

3.hexo 根目录下 的配置文件_config.yml里设置主题:

theme: next

更新 Update

$ cd themes/next
$ git pull

如何使用这个特性 How to use this feature

  1. 请先确保你所使用的 Hexo 版本在 3 以上
  2. 在站点的 source/_data 目录下新建 next.yml 文件(_data目录可能需要新建)
  3. 迁移站点配置文件和主题配置文件中的配置到 next.yml
  4. 使用 --config source/_data/next.yml 参数启动服务器, 生成或者部署。
    例如: hexo clean --config source/_data/next.yml && hexo g --config source/_data/next.yml

支持多国语言, 包括:

?? 简体中文 & 繁体中文

?? 英语

?? 俄语

?? 法语

?? 德语

?? 日语

?? 印度尼西亚语

?? 葡萄牙语 (巴西)

?? 朝鲜语

?? 意大利语

?? 荷兰语

默认语言是英语。

language: en
# language: zh-Hans
# language: zh-hk
# language: zh-tw
# language: ru
# language: fr-FR
# language: de
# language: ja
# language: id
# language: pt
# language: pt-BR
# language: ko
# language: it
# language: nl-NL

在站点配置文件_config.yml中可以将语言切换成中文

language: zh-Hans

评论支持 Comment support

NexT 已经原生支持 多说 and Disqus 评论系统。

添加以下代码到你的主题配置文件 _config.yml:

duoshuo:enable: trueshortname: your-duoshuo-shortname

或者

disqus_shortname: your-disqus-shortname

或者

# Valine.
# You can get your appid and appkey from https://leancloud.cn
# more info please open https://valine.js.org
valine:enable: trueappid:  # your leancloud application appidappkey:  # your leancloud application appkeynotify: false # mail notifier , https://github.com/xCss/Valine/wikiverify: false # Verification codeplaceholder: 正确填写邮箱, 才能及时收到回复哦♪(^∇^*) # comment box placeholderavatar: mm # gravatar styleguest_info: nick,mail,link # custom comment headerpageSize: 10 # pagination size

标签页 Tags page

添加一个标签页面,里面包含您网站中的所有标签。

  • 创建一个名为 tags 页面

      hexo new page "tags"
    
  • 编辑标签页, 设置页面类型为tags.

      title: All tagsdate: 2014-12-22 12:39:04type: "tags"
    
  • 添加 tags 到主题配置文件 _config.yml 里:

      menu:home: /archives: /archivestags: /tags
    

分类页 Categories page

添加一个分类页面,里面包含您网站中的所有分类。

  • 创建一个名为 categories 页面

      hexo new page "categories"
    
  • 编辑分类页, 设置页面类型为 categories.

      title: All categoriesdate: 2014-12-22 12:39:04type: "categories"
    
  • 添加 categories 到主题配置文件 _config.yml 里:

      menu:home: /archives: /archivescategories: /categories
    

社交媒体 Social Media

NexT 可以自动添加链接到您的社交媒体帐户里:

social:GitHub: https://github.com/caozongpeng || githubCSDN: https://blog.csdn.net/qq_22067469E-Mail: mailto:kyriecao@163.com || envelopeResume: https://caozongpeng.github.io#Google: https://plus.google.com/yourname || google#Twitter: https://twitter.com/yourname || twitter#FB Page: https://www.facebook.com/yourname || facebook#VK Group: https://vk.com/yourname || vk#StackOverflow: https://stackoverflow.com/yourname || stack-overflow#YouTube: https://youtube.com/yourname || youtube#Instagram: https://instagram.com/yourname || instagram#Skype: skype:yourname?call|chat || skype

Feed 链接 Feed link

显示 feed 链接。

在主题配置文件_config.yml里设置rss , 如下所示:

  1. rss: false 会禁用 feed 链接。

  2. rss: 使用站点 feed 链接。这是默认的选项。

    按照插件hexo-generator-feed的README中的安装说明进行操作。在完成这个插件的配置后,Feed链接也生成好了

  3. rss: http://your-feed-url 设置你的 feed 链接.

内置5种代码高亮主题 Up to 5 code highlight themes built-in

NexT 使用的是 Tomorrow 主题 ,一共有5种主题供你选择。
Next 默认使用 normal. 下面是 normalnight 主题的预览:

Tomorrow Normal Preview
Tomorrow Night Preview

查看更多信息点击Tomorrow 主题。

相册配置

请参考博文:https://malizhi.cn/HexoAlbum/

配置 Configuration

NexT 的配置很少


# Menu configuration.
menu:home: /archives: /archives# Favicon
favicon: /favicon.ico# Avatar (put the image into next/source/images/)
# can be any image format supported by web browsers (JPEG,PNG,GIF,SVG,..)
avatar: /default_avatar.png# Code highlight theme
# available: normal | night | night eighties | night blue | night bright
highlight_theme: normal# Fancybox for image gallery
fancybox: true# Specify the date when the site was setup
since: 2013

更多配置请详细查看_config.yml文件。

更新日志

2019-01-28第一个版本

此外还有另一个非常 好看、简洁、大方 的主题:https://blog.csdn.net/qq_22067469/article/details/86685248

================================================================================
感谢阅读,写得不好的地方请指教,能帮助到你是对我最好的回报,不卑不亢,加油。
请你记住比你优秀的一定比你努力,比你努力的人一定比你优秀。
================================================================================

http://chatgpt.dhexx.cn/article/pMqgT25g.shtml

相关文章

Next主题添加背景图片

文章目录 操作步骤添加背景图片设置透明边框圆角 hexo 和 Next 的版本如下: hexo: 5.2.0 NexT: 7.8.0 操作步骤 进入 themes\next\source\css 目录中打开 main.styl 文件在末尾添加 css 代码即可 添加背景图片 值得注意的是,在 main.styl 文件末尾写的…

Hexo-Next主题博客个性化配置

Hexo版本:6.2.0、NextT版本:7.8.0 一、主题安装 打开Git Bash,cd到站点根目录,输入 git clone https://github.com/theme-next/hexo-theme-next themes/next打开站点根目录下的_config.yml文件,landscape修改为next …

hexo下next主题的优化

1.站点信息的配置。 修改一些基本的配置,比如站点名、站点描述等等。 # Site title: halisi7 subtitle: 一个专注技术的组织 description: 涉猎的主要编程语言为 c语言、Java、mysql、linux、docker,领域涵盖算法、服务研发和对象存储等。 keywords: c…

Hexo博客-NexT主题自定义主页配置方法

Refrence https://zhuanlan.zhihu.com/p/366761432 问题 在使用Hexo博客框架的Next主题时,默认主页是数篇博客的摘要。想要修改主页(也即首页)的内容(例如给出网站的介绍等),需要进行自定义配置。 步骤 …

Hexo-Next主题搭建个人博客最新配置教程!

个人博客 网页预览:https://benn314.github.io/ Hexo-Next 是一款我很喜欢的主题,布局简约,很适合用于搭配 live-2d 和 网格动画,打造属于自己的个人博客。博客目前部署于 Github Pages 相关Github仓库 https://github.com/Ben…

NexT主题优化

前言 这算是各种文章的集合了,如果你有耐心就看完吧(T▽T) 如果是明确想要哪一种功能的童鞋,那就直接查找吧( • ̀ω•́ )✧ 本篇文章是在已经搭建好gitpagehexo的博客的前提下(不懂怎么搭建的可以参考我的另一篇…

Hexo+next主题美化静态博客

前言 需要在Hexo下配置next主题 Hexo配置next主题教程:点我跳转 更改配置以后使用素质三连:hexo clean && hexo g && hexo s即可本地看到效果。 hexo clean && hexo g && hexo s注:部分参考自互联网&…

Next主题美化

写作目的 网上关于Hexo的主题美化的博客已经很多也很全面了,但是在作者去一一尝试的时候,却发现有很多博客中提供的方法现在已经不支持或者过时了,为了避免大家和作者一样花费大量时间去一一尝试,所以作者考虑再三,决定…

Hexo博客优化之Next主题美化

前言 有了前面几篇博客的介绍,我们就可以很容易的搭建并编辑我们的博客了,不过既然是属于自己的博客网站,自然也就想让其更加美观,更有意思,所以呢我下面介绍一下Hexo博客的主题美化操作。 1. Next主题 Hexo博客支持很多主题风格,其中Next主题是Github上Star最多的主题,…

Django CBV ( 类视图函数 )

Django 类视图函数 写在前面1、先创建一个新的应用2、写一个类视图函数3、post访问试试4、再创建一个类视图函数5、as_view()里面可以传参6、TemplateView6.1、template_name写到路由里6.2、template_name写到视图里 7、ListView8、DetailView8.1、DetailView还可以不指定templ…

详解Django中FBV开发模式与CBV开发模式的区别.

你可能会好奇为什么在这里我们又要介绍CBV开发模式, 在前面的文章中, 我们调用视图函数都是使用 FBV 开发模式, 用的好好的为什么又要换呢? 其实不然,这是一个循序渐进的过程, 就像编程基础 和 框架开发&am…

什么是ccv

ccv是一个以不成熟的openframeworks为基础作的一个开源的软件。注意它并不是一个库。并且她早就不再更新了。现在openframeworks已经很成熟了,openframeworks提供的函数完全可以替代ccv,所以想继续使用ccv的同学们,赶紧回头是岸,使…

Django----FBV 与 CBV 介绍、CBV源码分析

文章目录 一、CBV和FBV二、CBV 源码分析 一个视图函数(类),简称视图,是一个简单的Python 函数(类),它接受Web请求并且返回Web响应。 响应可以是一张网页的HTML内容,一个重定向&#…

FBV和CBV

一、FBV FBV(function base views) 就是在视图里使用函数处理请求。 看代码: urls.py from django.conf.urls import url, include # from django.contrib import admin from mytest import viewsurlpatterns [# url(r‘^admin/‘, admin.s…

CBV

一、CBV与FBV #Class Base View(基于类的视图) #Function Base View(基于函数的视图) 二、CBV的用法及源码分析 1、用法 #视图层 # 1 先导入View(继承它) from django.views import View # 写一个类继承它, class Test(View):#request必须传,后面的可传可不传(有可能有名,无名分…

FBV与CBV

FBV与CBV 视图函数并不只是指函数也可以是类。FBV(基于函数的视图) 面向函数式编程。CBV(基于类的视图) 面向对象式编程 问题:基于CBV的视图函数,get请求来就会走类里面get方法,post请求来就会走类里面post方法 为什么??? urls.py中 url(r^login/,views.MyLogin.…

CBV与FBV的区别/CBV源码剖析

FBV与CBV # 针对于视图函数(views.py)&#xff0c;视图函数编写逻辑既可以使用函数(FBV)也可以使用类(CBV)来编写。 区别展示&#xff1a; login.html <h1>GET请求</h1><form action"" method"post" enctype"multipart/form-data"…

FBV与CBV, CBV源码剖析

目录 FBV和VBC CBV和FBV CBV源码分析 CBV源码简述 FBV和VBC 一个视图函数(类),简称视图, 是一个简单的python函数(类),他接受web请求并且返回web响应. 响应可以是一张网页的HTML内容, 一个重定向, 一个404错误, 一个xml文档或者一张图片. 无论视图本身包含什么逻辑, 都要…

Django的CBV方式讲解

CBV使用配置 路径url的配置 cbv 顾名知义就是通过类的方法来调用&#xff0c;我们在url中配置为如下路径 url(r^cbv.html/, views.Cbv.as_view()), 这里的Cbv是一个class 类&#xff0c;要想使用cbv方法&#xff0c;这个路径后面还得必须有一个as_view()这个是必须的固定格式 v…

CBV之详解

一&#xff0c;CBV&#xff0c;基于反射实现根据请求方式不同&#xff0c;执行不同的方法。 1. 开发模式- 普通开发方式&#xff08;前后端放在一起写&#xff09;- 前后端分离2. 后端开发为前端提供URL&#xff08;API/接口的开发&#xff09;注&#xff1a;永远返回HttpRespo…