作为一名程序员，如果你喜欢输出技术文章，那你一定想到过搭建个人博客网站。对比了很多博客框架，发现用Hexo+hexo-theme-matery主题搭建的博客站不仅界面美观，而且功能强大。今天就带大家使用Hexo搭建一个漂亮的博客网站，希望对大家有所帮助！SpringBoot实战电商项目商城（50k+star）地址：https://github.com/macrozheng/mallHexo简介Hexo是一个快速、简洁、高效的博客框架。我们可以使用Markdown写文章，然后通过Hexo生成静态网站。Hexo的主题非常多，你看到的很多博客都是用它生成的。hexo-theme-materytheme在使用Hexo的时候，我们通常会搭配第三方主题使用。这里推荐一款基于MaterialDesign的主题，hexo-theme-matery。界面简洁美观，文章内容美观易读。响应式设计，博客在桌面、平板、手机等设备上都能很好展示。内置丰富的插件，功能强大。效果演示先来看看成品吧。有了这个主题，Hexo的界面就相当漂亮了。想开博客的朋友可以试试！搭建我们将首先使用Hexo搭建一个基本的博客站点，然后切换到hexo-theme-matery主题。首先使用如下命令安装hexo-cli，看名字就知道是Hexo的CLI工具；npminstall-ghexo-cli安装成功后，初始化一个blog目录，进入该目录，然后安装依赖；#初始化博客目录hexoinitwebsite-hexo#进入博客目录cdwebsite-hexo#安装博客相关依赖npminstall这样一个基本的博客站点就搭建好了，我应该秒建一个博客站点，然后使用下面的命令来启动博客网站；hexoserver启动成功后，我们就可以访问首页了。用过Hexo的朋友应该都知道，Hexo需要搭配主题使用，不然真的很难看。访问地址：http://localhost:4000/配置搭建博客站点。一些配置需要定制。接下来我们说一下Hexo的整体配置和hexo-theme-matery的主题配置。Hexo的整体配置支持的Hexo主题非常多。这里我选择了一个我觉得比较漂亮的hexo-theme-matery。首先下载主题并解压到项目的themes目录下，下载地址：https://github.com/blinkfox/h...修改项目根目录下的配置文件_config.yml，即Hexo整体配置，将theme属性修改为hexo-theme-matery；theme:hexo-theme-matery修改成功后，我们重启项目，然后查看首页。果然页面漂亮多了。访问地址：http://localhost:4000/当然_config.yml文件不仅可以改变主题，还有很多网站配置，比如网站配置、URL配置、首页配置等。#网站配置title:macrozheng#网站titlesubtitle:'macrozheng'spersonalblog'#网站subtitledescription:'正义可能会迟到，但永远不会缺席。#网站描述keywords:author:macrozheng#网站作者language:zh-CN#网站使用的语言可以设置为中文timezone:''#URL配置url:http://localhost:4000#URL会影响原来的文章页面链接地址permalink::year/:month/:day/:title/#文章永久链接格式#首页配置index_generator:path:''per_page:12#分页设置，最好设置6、12、18为本主题order_by:-date#按时间倒序排列#分页配置per_page:12pagination_dir:首页顶部有一些导航按钮，比如标签、分类、存档等。如果我们没有创建相应的页面，我们将无法访问它；使用hexonewpage"categories"命令创建一个新的分类页面。分类页面至少包含以下内容;---title:categoriesdate:2021-09-0610:19:56type:"categories"layout:"categories"---使用hexo新页面“tags”命令创建一个新标签页，标签页至少包含以下内容；---title:tagsdate:2021-09-0610:25:04type:"tags"layout:"tags"---使用hexo新页面"关于”命令创建一个新的关于页面。about页面至少包含以下内容；---title:aboutdate:2021-09-0610:28:56type:"about"layout:"about"---使用hexonewpage404命令新建一个404页面，404必须至少包含以下内容；---标题：404日期：2021-09-0610:32:48类型：“404”布局：“404”description:"糟糕~，我坏了！找不到你要的页面:("---页面创建成功后，项目目录结构如下，把目录贴在这里，方便大家了解主题配置，我们不仅要修改Hexo，hexo-theme-matery主题的配置也需要修改，比如顶部的菜单导航，about页面，这些都是在主题中配置的。注意：主题配置需要修改/themes/hexo-theme-matery/_config.yml文件，我们可以配置导航菜单，比如我添加了项目导航菜单；#配置主题的名称、路径和图标菜单导航icon.menu:Index:url:/icon:fasfa-homeproject:icon:fasfa-project-diagram"children:-name:mallurl:https://github.com/macrozheng/mall-name:mall-admin-weburl:https://github.com/macrozheng/mall-admin-web-名称:mall-tinyurl:https://github.com/macrozheng/mall-tiny标签:url:/tagsicon:fas添加fa-tags成功后，导航菜单中会有一个菜单项，并且可以显示二级菜单；我们可以配置首页介绍，修改dream下的配置即可；#配置首页显示“梦想”语句.dream:enable:trueshowTitle:truetitle:关于本站text:本站是macrozheng个人博客的初衷，是为了分享和记录自己平时学习的技术。作者的Github开源项目商城（50K+Star），欢迎关注我的公众号「macrozheng」。配置成功后，首页显示如下；我们可以在首页横幅中配置个人信息；#首页banner第二行个人信息配置，留空禁用socialLink:github:https://github.com/macrozheng#https://github.com/xxxemail:macrozheng@126.com#xxx@xxx.comfacebook:#https://www.facebook.com/xxxtwitter:#https://twitter.com/xxxqq:#123456789weibo:#https://weibo.com/xxxzhihu:#https://www.zhihu.com/xxxjuejin:https://juejin.im/user/5cf7c1d7f265da1bc07e28b7jianshu:https://www.jianshu.com/u/9bdcaae6d6b7rss:false#true,false因为我们自定义了两个链接、掘金和简书，我们还需要修改主题目录下的/layout/_partial/social-link.ejs文件，添加如下内容，否则无法显示；<%if(theme.socialLink.juejin){%>
