玩遍博客网站,我整理了 Hexo 及其流行的风格主题

搭建博客网站是我的进入互联网世界的最多见方式之一。伴随着网站技术的发展,如何搭建博客网站已经变得很是容易了。固然,你能够选择诸如 新浪博客、CSDN、博客园 之类的大型网站,快速建立依赖于大平台的我的博客,不过这种方式的不足是言论受限太多、没法触及网站底层技术。因此,对于想要自由发挥创意、又指望对网站拥有更多主动权的话,最好仍是选择本身去亲手搭建一个网站。html

本文来源:魚立说。本文连接:https://www.yulisay.com/d/nkpvy.html,支持微信浏览器打开。git

更多精彩文章,请移步 魚立说我的网站 翻看。欢迎欣赏,吐槽不足之处。github


本主题将围绕博客网站的搭建流程、不一样的博客搭建技术及其流行的风格主题展开,整个系列由如下三个文章部分组成:浏览器

<div class="bordor-separation"></div>服务器

Hugo 是使用 Go 编写的快速而现代的静态站点生成器,旨在使网站建立变得有趣。特色是简单、易用、高效、扩展性好、快速部署。其官网是:https://gohugo.io微信

安装 Hugo

安装 Hugo 至关简单,可是须要先安装 Go 运行环境。以 Mac 操做系统为例,安装 Hugo 的命令:brew install hugo。并发

初始化一个名字为 hugo-blog 的项目:hugo new site hugo-blog,此时将生成以下 Hugo 项目目录:hexo

.
├── config.toml     # 网站的配置信息
├── archetypes      # 存放 .md 文件的模板
├── content         # 存放 .md 文件
├── data            # 存放 Hugo 数据
├── layouts         # 存放布局文件
├── public          # 公共文件夹,用于存放生成的站点文件
├── static          # 存放静态文件,好比图片、CSS、JS
└── themes          # 存放主题

快速操做 Hugo

查看版本:hugo version布局

新建一篇文章: hugo new post/my-first-blog.mdpost

生成静态文件: hugo -t even

启动服务器: hugo server

正常启动服务后,在浏览器打开 http://localhost:1313/ 看到咱们的网站。

流行的 Hugo 主题

使用 Hugo 博客时,咱们最但愿的是找到适合本身的一款主题,下面将图文结合介绍一些流行的 Hugo 主题。此外,关于写做的方法和 Hugo 主题修改,能够查阅本文参考中的 Hugo 官方文档,这里再也不赘述。

找到、安装和配置 Hugo 主题

最好的搜索方式是在 https://github.com/ 中,搜索关键词:hugo theme。或者使用搜索引擎,搜索:hugo theme site:github.com

在 Github 上搜索 Hugo 主题

而后进入到项目目录中,下载安装咱们须要的主题(theme-demo 只是一个示例资源,请注意替代为实际的资源):

git clone https://github.com/theme-demo.git themes/theme-demo
cp -r themes/theme-demo/_source/* source

但愿使用下载的主题,添加 themes/theme-demo/exampleSite/config.toml 中的配置,还须要在 config.toml 中配置主题:

theme = "theme-demo"

此外,在有些 theme-demo 文件夹中会有 demo 或 example 目录,文件结构与新建的 Hugo 项目的文件结构几乎是同样的,这样设置是为了用户的配置能够覆盖掉主题的配置。

Hugo 流行主题之 1:MemE

MemE 是一个强大且可高度定制的 GoHugo 博客主题,专为我的博客设计。MemE 主题专一于优雅、简约、现代,以及代码的正确性。Github 地址:https://github.com/reuixiy/hugo-theme-meme

MemE 风格主题

Hugo 流行主题之 2:Clarity

基于 VMware 的开源 Clarity 设计系统,具备丰富的代码支持、暗/光模式、移动支持等特色,为 Hugo 设计了一个具备技术意识的主题。Github 地址:https://github.com/chipzoller/hugo-clarity

Clarity 风格主题

Hugo 流行主题之 3:Even

一个很简洁的主题,移植自 hexo-theme-even。Github 地址:https://github.com/olOwOlo/hugo-theme-even

Even 风格主题

Hugo 流行主题之 4:Octopress

从 Octopress 博客移植过来的经典主题。Github 地址:https://github.com/parsiya/Hugo-Octopress

Octopress 风格主题

Hugo 流行主题之 5:Tokiwa

一个极简的博客主题,对汉字进行了显示优化。Github 地址:https://github.com/heyeshuang/hugo-theme-tokiwa

Tokiwa 风格主题

除了以上几种,还有更多不错的 Hugo 风格主题供你选用,能够前往 Hugo 主题网站 找到。若是你有好的想法和设计,也能够建立并发布本身制做的 Hugo 主题,到时候欢迎给个人网站 魚立说 留言。

参考连接

Hugo 官方文档

Hugo Themes

相关文章
相关标签/搜索