①5行代码搭建属于自己的博客网站

安装前提:

已安装Node.js (Node.js 版本需不低于 10.13,建议使用 Node.js 12.0 及以上版本,一般来说优先推荐最新版)

打开命令行终端,依次输入以下命令行,即可完成博客构建

npm install hexo-cli -g #使用npm安装hexo
hexo init blog #在当前所在位置生成blog文件夹
cd blog
npm install
hexo server  # 运行博客,可在浏览器打开博客

生成的blog文件夹目录如下:

.
├── _config.yml #根目录下网站的配置信息,大部分配置在此处修改
├── package.json #版本、依赖等相关信息
├── scaffolds #模版文件夹,可以设置每次新建文章中会自动填充的东西,比如title,date
├── source #开头命名为 _ (下划线)的文件 / 文件夹和隐藏的文件将会被忽略
|   ├── _drafts #可以自己新建该文件夹,用来放文章草稿
|   └── _posts #存放文章的文件夹
└── themes #设置博客的主题风格

运行hexo server后可根据命令行提示打开相应网页http://localhost:4000/

博客当前效果

其它常见的_config.yml 文件修改建议:

  • 语言设置为中文:language: en修改为language: zh-CN
  • 文章列表中每页文章篇数设置:两个 per_page默认是10,建议修改为3的倍数

②配置主题美化个人博客(Matery)

在Github上下载Matery主题文件夹,https://github.com/blinkfox/hexo-theme-matery,文件夹解压缩后修改为matery放入themes文件夹下

修改根目录的文件_config.yml,将主题theme属性从theme: landscape修改为theme: matery,保存修改

cd blog文件夹后,输入hexo clean && hexo g && hexo s打开网页,即可拥有Matery风格的个人博客

首页:

文章详情:

Tips:

官网(https://hexo.io/themes/)有很多其他风格可以尝试,相关文档、个性化设置比较全面并且比较好看的主题风格比如Next,Butterfly,都挺推荐的

③为博客新增分类、标签页面

点击导航栏的标签、分类、关于等,没有相关信息显示,本篇文章用于配置相关页面。

1 添加tags页面

**效果:**为相关文章添加如下的tags(前端、Hexo)后,可通过标签梳理每篇文章,一篇文章可以有多个标签

点击网页标签后,效果如下:

cd blog文件夹后,输入hexo new page "tags",将在根目录的source文件夹下生成 tags/index.md文件,将index.md文件修改如下(增加type和layout)即可:

---
title: tags
date: 2018-09-30 18:23:38
type: "tags"
layout: "tags"
---

2 添加categories页面

**效果:**为相关文章添加categories(构建博客)后,可通过分类梳理每篇文章,一篇文章只能有一个分类


点击网页标签后,效果如下:

cd blog文件夹后,输入hexo new page "categories",将在根目录的source文件夹下生成 categories/index.md文件,将index.md文件修改如下(增加type和layout)即可:

---
title: categories
date: 2018-09-30 17:25:30
type: "categories"
layout: "categories"
---

更多配置内容,请参考链接:Matery配置说明文档

快速构建属于自己的博客网站相关推荐

  1. 如何快速的搭建一个个人博客网站

    经过我几天的沉浸式的研究,发现一款基于Node.js的静态博客程序,可以方便的生成静态网页托管在github和Heroku上. ​ 类似于jekyll.Octopress.WordPress,我们可以 ...

  2. 如何给自己的博客网站加入评论系统

    前言 在这一篇博文中,咱们介绍了如何快速的搭建个人的博客网站,但是这个博客网站是基于Github Pages的纯静态网站,自身是不带任何的可交互的元素的,自然也就没有评论系统.但是,对于一个好的博客网 ...

  3. 使用Hexo+github+netlify快速搭建个人博客网站

    1 写在开头   倒腾了好几天,算是做出了一个有点样子的个人博客网站.便学各位大佬也写一个搭建教程,总结一下个人踩坑经验,也希望能对他人略有作用. 博客演示(欢迎来留言交流) 为什么选择Hexo?答: ...

  4. 使用jQuery Mobile移动开发框架将博客网站快速转化为Mobile网站

    日期:2012-7-12  来源:GBin1.com 在线演示 jQuery Mobile是一个非常不错的移动端网站应用的解决方案,很多网站都使用jQuery Mobile来生成Mobile手机端的移 ...

  5. ucloud对象存储装宝塔_使用UCloud优刻得云主机和宝塔面板快速搭建WP个人博客网站教程...

    笔者之前一直使用IDC的虚拟主机和FTP软件搭建个人网站,非常简单快速,一个普通网站一般1-2个小时即可搭建完成. 这是第一次使用云主机,云主机与笔者之前使用的虚拟主机相比,就像是一台裸机,没有服务器 ...

  6. 如何快速搭建个人博客网站(详解)

    首先,要有一个github账号,可以去这里注册,英语不好的最好用谷歌浏览器把网页翻译出来.(反正我是用的谷歌) 依次填写用户名,邮箱,密码,然后通过邮箱去验证,注册成功后就可以登陆了. 然后我们还需要 ...

  7. 基于halo快速搭建一个属于你自己的博客网站

    基于halo快速搭建一个属于你自己的博客网站 公众号 前置条件 JDK安装 下载halo配置文件 下载halo的启动jar 验证启动 公众号 前置条件 首先你需要有一台自己的服务器,比如你去各类云上面 ...

  8. 使用GitHub构建个人博客网站

    想起来之前搭建个人博客网站的总结还没有写,趁着这几天有时间回头来分享一下.本人的个人博客网站采用的是GitHub+jekyll,GitHub托管代码,jekyll发行生成静态网页. 1.购买域名 域名 ...

  9. 【django】二、构建个人博客网站

    文章目录 简单构建 开启本地虚拟环境 初步创建bolg应用 创建管理员 显示字符内容 pip导出包 时区修改 简单构建 功能模块: 博客 :博文,博客分类,博客标签 评论 : 点赞 : 阅读 : 用户 ...

最新文章

  1. java中,字符串和集合判断是否为空
  2. php连hiveservice2,hiveserver2启动成功但无法通过beeline连接
  3. 【渝粤教育】国家开放大学2018年春季 0471-21T畜牧学 参考试题
  4. java执行python路径_如何在Python中获取当前执行文件的路径?
  5. css中文本超出部分省略号代替
  6. 一个出色的UI设计师需要具备哪些能力?
  7. GJB150-2009军用装备实验室环境试验方法新版标准
  8. ubuntu下海信Hisense E920 usb连接不上的处理与adb的连接
  9. markdown使用文档(Typora 快捷键)
  10. linux中打开caj文件,Ubuntu20.04使用CAJViewer for Linux(可双击打开.caj文件)
  11. 求大于某一正整数的最小质数
  12. 项目中用setTimeout代替setInterval
  13. Unity3d之Quaternion 学习与应用
  14. 墙裂推荐4款js网页烟花特效
  15. EMC设计的四大技巧
  16. 联通光纤猫入户升级:千兆光纤宽带的网卡,为什么只显示100M?
  17. Bonobo Git Server搭建本地(Windows)私有的Git服务器
  18. 计算机组成原理13-定点数的移位、加法与减法运算
  19. 系统升级/重装导致金蝶数据库账套丢失找回
  20. 修改了DNS服务器网速慢,如何修改DNS让网速快到飞起!教你两招让电视、盒子告别卡顿...

热门文章

  1. 人机智能交互技术教学进度表(2017-2018-1)含测试 机器人方向本科限选课程
  2. Mac重启Finder的技巧
  3. win7电脑连接无线网络怎么连接服务器未响应,Win7无线网络无法连接的原因及Wifi无法连接解决方法大全...
  4. pytorch实现yolov4_v2(网络模块)
  5. Need和Want有何不同?
  6. Java学习——File类
  7. latex设置页面边距,页面大小,页边距,geometry宏包
  8. SONET和SDH技术简介
  9. 计算机房电源引入方式,(完整版)通信机房电源计算公式.pdf
  10. 旋转卡(qia)壳 平面最远点对