Window10系统下如何创建hugo博客

第一步:下载并安装hugo

hugo官网下载Windows安装包;
选择
在D盘中新建一个名为“hugo”的文件夹,并将下载好的hugo安装包解压至此文件夹;

第二步:添加环境变量

右键点击此电脑,选择属性在这里插入图片描选择左侧的“高级系统设置”
在这里插入图片描述选择“环境变量”
在这里插入图片描述在系统变量中找到“Path”,点击编辑在这里插入图片描述
输入"D:\hugo"
在这里插入图片描述一直按“确定”至退出
点击桌面左下角的“开始”,输入cmd,点击命令提示符,输入hugo version,查看hugo是否安装成功,出现如下图片,则安装成功
在这里插入图片描述

第三步:安装并配置Git

安装git:
将此地址"http://github.com/git-for-windows/git/releases/download/v2.23.0.windows.1/Git-2.23.0-64-bit.exe]"粘贴至迅雷下载git,下载好后进行默认安装,安装完成之后在命令对话框中输入git,当出现如下图所示,则证明git安装成功:
在这里插入图片描述配置git:
在命令对话框中输入:
git config --global user.name "xxxx"git config --global user.email "xxxx.com"
其中“xxxx“”是你自定义的名字。配置好后可以用git config -l,查看是否配置完成;

第四步:创建个人博客文件夹

通过命令提示符窗口,进入D盘的hugo文件夹创建个人博客文件夹,输入hugo new site myblog,回车后出现如下图所示,
在这里插入图片描述
第五步:下载博客主题

进入Hugo博客主题库挑选自己喜欢的博客模板,这里以anatole为例。
在这里插入图片描述拉下网页,找到 git clone https://github.com/lxndrblz/anatole.git anatole 语句。在命令指示符D盘目录输入cd hugo\myblog\themes,然后输入之前找到的 git clone https://github.com/lxndrblz/anatole.git anatole,结果如下图所示,下载完成
在这里插入图片描述
第六步:在本地启动个人博客

在cmd命令指示符D:\hugo\myblog目录下输入hugo server -t anatole --buildDrafts,出现下图
在这里插入图片描述找到命令指示符中的 http://localhost:1313/,此时使用此地址,便可以通过浏览器来访问个人博客。
在这里插入图片描述

第六步:个人博客部署到远端服务器

在github创建一个远端仓库:登录github,在自己的页面上新建一个个人仓库,新仓库命名必须是自己的github账号名字且是纯小写在加上后缀“github.io”
在这里插入图片描述因为我之前创建过了,所以会显示已存在,如果没创建过则不会出现提示。
在myblog目录下,cmd命令行中输入hugo --theme=anatole --baseUrl="https://xxxxx.github.io/" --buildDrafts,其中xxxxx为自己的github账号名。
在这里插入图片描述代码执行后就会在myblog文件夹下生成一个public文件夹

接下来把public文件推送到github上。在命令提示符中切换到public根目录下依次输入:(其中xxxxx为自己的github账号名)

git init,点击回车
git add,点击回车
.git commit -m"创建完成",点击回车
git remote add orign https://github.com/xxxxx/xxxxx.github.io.git,点击回车
git push -u orign master,点击回车

接下来会让你输入你的github用户名和密码,在弹出的提示符后输入自己github的用户名和密码就大功告成了。
成功的结果如下图
在这里插入图片描述在这里插入图片描述当完成到这里,便成功搭建完自己的第一个hugo博客了,此时便可以使用https://xxxxx.github.io/(其中xxxxx为自己的github账号名)来访问自己的博客了。
在这里插入图片描述

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值