Hugo是个什么东东这里直接忽略,想了解的请查阅其他资料,我们直接上手操作。

安装Hugo

Hugo Releases 下载对应的操作系统版本的Hugo二进制文件

解压后得到 hugo_0.17_windows_amd64.exe 可以将其改名为 hugo.exe

按理双击exe即可安装,不知为何在我这里不行

于是改为其他方法:

C盘新建文件夹 hugo\bin ,将hugo.exe放在bin目录下

在path中设置环境变量 C:\hugo\bin;

生成站点

使用Hugo快速生成站点,进入到 C:\hugo

$ hugo new site mysite

这样就在hugo目录里生成了初始站点,进去目录

$ cd mysite

站点目录结构为:

简要介绍一下,config.toml是网站的总配置文件,content目录里放的是markdown文章,

layouts目录里放的是网站的模板文件,static目录里放的是一些图片、css、js等资源。

创建一篇日志文件

$ hugo new post/first.md

执行完后,会在content/post目录自动生成一个markdown格式的first.md文件:

可以简单修改一下里面的内容,比如:

+++
draft = true
date = "2016-10-18T13:36:45+08:00"
title = "第一篇Hugo文章"

+++

### 你好!Hugo!

安装皮肤

皮肤列表 挑选一个喜欢的皮肤,找到相应的Github地址,

https://github.com/allnightgrocery/hugo-theme-blueberry-detox.git 为例,将主题clone到themes目录下

$ cd themes
$ git clone https://github.com/allnightgrocery/hugo-theme-blueberry-detox.git detox

本地预览

在 \mysite 目录下启动 hugo server

$ hugo server --theme=detox --buildDrafts --watch

浏览器访问:http://localhost:1313/ 即可预览

部署Github

首先在GitHub上创建一个Repository,命名为:itbirds1900.github.io (itbirds1900替换为你的github用户名)。

在站点根目录执行 Hugo 命令生成最终页面:

$ hugo --theme=detox --baseUrl="https://itbirds1900.github.io/"

(注意,以上命令并不会生成草稿页面,如果未生成任何文章,请去掉文章头部的 draft=true 再重新生成。)

如果一切顺利,所有静态页面都会生成到 public 目录,将pubilc目录里所有文件 push 到刚创建的Repository的 master 分支。

$ cd public
$ git init
$ git remote add origin https://github.com/itbirds1900/itbirds1900.github.io.git
$ git add .
$ git commit -m "first commit"
$ git push -u origin master

浏览器里访问:Hello Hugo

使用Hugo搭建个人博客站点的更多相关文章

  1. 如何用hugo搭建个人博客

    如何用hugo搭建个人博客 1. 安装 Hugo 点击跳转 Hugo Releases win10 步骤: 下载解压 , 然后添加环境变量 测试: #命令行测试 hugo version 2. 创建站 ...

  2. 用hugo搭建个人博客

    这几天研究了用hugo搭建个人博客. 简单的整理了一下. 1.安装hugo(windows 请查看官网介绍 https://gohugo.io/getting-started/installing/) ...

  3. 利用 Hexo 或者 hugo 搭建个人博客

    我们无法选择生活的样子,但我们可以记下来. 博客的开始 其实,一切都是为了更好的装逼.好吧,我着相了. 最开始想做一个自己博客,主要是因为看到了很多人都有,觉得自己没有太 Low 了.于是申请了 CS ...

  4. hugo搭建个人博客

    本地先安装git 1. 下载hugo,并配置好环境变量 我这里win7 64位,选择该版本下载 将解压后的hugo.exe,配置到环境变量中,如下图所示表明配置成功 hugo version 2. 生 ...

  5. Hexo搭建静态博客站点

    什么是Hexo? Hexo 是一个快速.简洁且高效的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页. 本文将介绍如何在没有域名和云主机的 ...

  6. Hugo + Github Pages 搭建个人博客

    尝试过 Hexo .GatsbyJs. Vuepress 搭建博客后,对这些工具最大的不满,就是运行速度以及打包速度. 后来看到 Hugo ,号称最快的静态站点生成器后. 尝试搭建博客,发现不管是运行 ...

  7. Linux下使用 github+hexo 搭建个人博客07-next主题接入搜索和站点管理

    这是搭建个人博客系统系列文章的最后一篇,如果你是从第一篇一路跟下来的,那么恭喜你,即将完成整个博客网站的搭建.OK,话不多说,开始我们的收官之战. 不知你想过没有,如果我们的文章少,一眼看完整个目录, ...

  8. Hugo+Github 搭建个人博客(Windows环境下)

    目录 Hugo+Github 搭建个人博客(Windows环境下) 1.前言 2.Differences 2.1 https vs SSH 2.2 新建的github的仓库名必须为 用户名+githu ...

  9. 十分钟教会你如何使用VitePress搭建及部署个人博客站点

    使用VitePress可以让我们快速搭建一个静态博客网站,这篇文章将带领大家搭建一个基于VitePress的静态博客网站并且部署到GitHub Pages(github提供的静态网页服务) 快速上手 ...

随机推荐

  1. 架构师养成记--30.Redis环境搭建

    Redis的安装 下载地址http://redis.io/download 安装步骤: 首先需要安装gcc,把下载好的redis-3.0.0-rc2.tar.gz 放到 /usr/local 文件夹下 ...

  2. 题目1000:计算a+b

    问题来源 http://ac.jobdu.com/problem.php?pid=1000 问题描述 简单a+b测试,没什么限制,入门级题目. 问题分析 使用scanf.printf或者cin.cou ...

  3. Objective-C 之category

    参考资料:iOS设计模式——Category Category Category模式用于向已经存在的类添加方法从而达到扩展已有类的目的. 相当于Swift中的功能扩展(extension). 新添加的 ...

  4. (一)Audio子系统之AudioRecord.getMinBufferSize

    在文章<基于Allwinner的Audio子系统分析(Android-5.1)>中已经介绍了Audio的系统架构以及应用层调用的流程,接下来,继续分析AudioRecorder方法中的ge ...

  5. springboot(十三)-分库分表-手动配置

    sharding-jdbc简介 Sharding-JDBC直接封装JDBC API,可以理解为增强版的JDBC驱动,旧代码迁移成本几乎为零: 可适用于任何基于java的ORM框架,如:JPA, Hib ...

  6. jedis 整合 Spring

    一,   单机版整合spring 1. 使用默认配置文件进行配置 <bean id="redisClient" class="redis.clients.jedis ...

  7. [问题解决]Fresco设置圆角效果不生效问题探究

    [问题解决]Fresco设置圆角效果不生效问题探究 /** * Created by diql on 2017/2/21 11:07:04. */ 问题 在View中设置: fresco:rounde ...

  8. UVM序列篇之二:sequence和item(上)

    无论是自驾item,穿过sequencer交通站,通往终点driver,还是坐上sequence的大巴,一路沿途观光,最终跟随导游停靠到风景点driver,在介绍如何驾驶item和sequence,遵 ...

  9. ListView和Adapter

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools= ...

  10. html锚点使用示例

    <html> <body> <h1>HTML 教程目录</h1> <ul> <li><a href="#C1&q ...