通过github搭建个人博客

今天突发奇想,想用GitHub搭建一个个人博客,就大概学习了一下,特此记录。

其实非常简单,首先要知道,这里是通过GitHub Pages进行搭建的,什么?不知道什么是GitHub Pages?Github Pages设计的初衷是为托管在GitHub上的项目提供介绍页面,开发者们可以通过GitHub Pages为他们的每一个项目创建一个用于介绍该项目的静态网站,因为它是免费的,所以我们可以拿来搭建个人网站,不过先明确一下,不同于在服务器上搭建网站,GitHub没有数据库,搭建的也是静态网站,每次新建文章都需要在本地建好,push上去,挺麻烦的,嫌麻烦的还是用博客园,简书这种吧。

搭建也是非常简单,首先注册个GitHub账号,然后新建一个repository,命名为“你的GitHub名字.github.io”,比如我的就是

为什么要这么起名字?人家规定的。

接下来,我们可以看看官方文档是怎么说的,看完就明白了。

https://pages.github.com

官方例子是这样:

(1)建立仓库DarrenChanChenChi.github.io
(2)下载仓库到本地

git clone https://github.com/username/username.github.io

(3) 进入仓库目录,建立网页入口文件

cd username.github.io
echo "Hello World" > index.html

(4)提交代码

git add --all
git commit -m "Initial commit"
git push -u origin master

这样访问https://darrenchanchenchi.github.io/就是看到网页“hello world”,是不是很简单?

可是这样的页面太low了,自己又不会设置样式咋整?别着急,有官方推荐的jekyll,这玩意又是啥?

jekyll是一个简单的免费的Blog生成工具,将纯文本转化为静态网站和博客;由于咱们的GitHub Pages生成的是静态页面,每次更新博客都需要手动更改HTML,这就使得每次写博客都变得很麻烦,而用了这个工具以后,它会根据预先设置好的格式来生成博客内容,你就无需关心html代码,只需要把重心放在博客的写作上。

文件目录的一些介绍如下:

简单了解即可,可是让自己从头写太麻烦了,别担心,有大神,大神设计好了很多模板供你选择:

JekyllThemes

下载之后按照之前的步骤把模板上传到自己的Github仓库中,在_posts文件夹中放入自己写好的博客,文件名必须是日期-标题名,例如:2018-12-06-我的第一篇博客。

这里推荐一个大神的,样式我比较喜欢,https://github.com/mzlogin/mzlogin.github.io

fork一下,改改内容,就可以了,很简单,人家的说明很详细,读一下README.md,我fork完就是这样:

然后clone下来,按照要求改改配置文件即可。改完传上去,万事俱备,我的效果如下:

https://darrenchanchenchi.github.io/

内容还是人家的,还没替换,要是想换成自己的域名,可以参考:https://www.cnblogs.com/zhangqie/p/7978394.html

参考

https://blog.csdn.net/u012168038/article/details/77715439

https://blog.csdn.net/xudailong_blog/article/details/78762262

https://www.jianshu.com/p/000bb99a72c3

原文地址:https://www.cnblogs.com/DarrenChan/p/10074221.html

时间: 2024-08-30 09:33:20

通过github搭建个人博客的相关文章

《Hexo+github搭建个人博客》

<Hexo+github搭建个人博客> 文/冯皓林 完稿:2016.4.22-2016.4.23 注意:本节教程只针对Windows用户.本教程由无人赞助,赞助写出. <Hexo+github搭建个人博客>1 思维导图总览:2 What?2 简介:2 Hexo:2 NodeJs2 Github4 Git5 Github page:5 Markdown6 How?7 环境配置:7 安装Git8 安装Node.js9 安装hexo13 第一步:打开cmd.13 第二步:进入NodeJS

使用Node.js+Hexo+Github搭建个人博客(续)

一.写在前面 在我的上一篇博客<使用Nodejs+Hexo+Github搭建个人博客>中,已经介绍了如何使用 Hexo 在 Github Pages 上搭建一个简单的个人博客.该篇博文将在上篇博文的基础上分别从以下几个方面做简单的后续介绍: 博客相关配置介绍 博客主题 Yilia 配置介绍 如何制作并配置网站缩略图 如何将博客同步到 Github.Coding 中 如何使用 Git 同步 Github 与 Coding 的代码 如何申请域名并作域名解析 如何将域名绑定至 Github.Codi

使用hexo和github搭建个人博客网站

使用hexo+github可以免费.快速地搭建一个静态博客网站,并且使用hexo提供的命令以及git自身的功能可以很便捷地管理博客. 使用github部署静态页面 在了解hexo之前,我们先看看如何使用github部署静态页面. 注册github账号 访问github官网注册一个账号,该流程和一般网站注册账号一样,在此不赘述. 创建一个git仓库 其他项如果需要可以自主填写,这里只填写仓库名,点击Create repository创建仓库. 提交一个测试页面 执行git clone命令将仓库克隆

Hexo和github搭建个人博客 - 朱晨

GitHub账号 mac/pc 环境 12 node.jsgit 创建GitHub仓库 登陆GitHub,创建一个新的Respository Repository name叫做{username}.github.io {username}代表你的GitHub用户名,Repository name一点要叫这个 绑定域名 待定 绑定ssh秘钥 设置git用户名和邮箱 12 git config --global user.name "liuxianan"git config --globa

github搭建个人博客 hexo框架 next主题

之前就想搭建自己的博客,现在终于得以实施. 参考了多篇博客,然后又在虚拟机了往往复复试了好多次, 现在基本搭建完毕. 我是基于hexo博客框架, next主题搭建的博客, 静态网页.   大体就是, 先在本地搭建好整个系统, 然后再提交到github. 因为此篇文章只是捡部分内容说,所以我先列出来我参考的博客,这里谢谢他们的无私分享了. hexo博客框架 + next主题 + 插件等整个流程请参考ezlippi的两篇博客:  https://www.ezlippi.com/blog/2015/0

Hugo + github 搭建个人博客

前言 很早以前就有想法,搭建一个个人的博客.没有实现的原因:一方面个人的服务器不太安全掉线,欠费,维护起来麻烦,另一方面,文章编辑发布起来也不方便. 后来了解到 github 提供了博客的功能,也一直没有实践.也鉴于上次文章被删,我也就开始实践了起来,有一个备份总好于无. 选择什么程序生成 这个是我第一个纠结的地方,我当时把选择集中在三个选项里面:Jekyll,Hexo,Hugo.当然是一定要支持markdown. 针对选择谁这个问题,我也是在网上查了大量的文章: Jekyll 由Ruby语言,

使用hexo+GitHub搭建个人博客的心得(含教程)

Author Email Yaoyao Liu [email protected] 前言 对于广大CS专业的学生和码农,找一个地方写博客,记录一些编程.配置环境.阅读论文的心得体会是一个很常见的习惯.当然想搭建个人博客,就需要找个靠谱的平台,主要就是以下的两种方式: 使用网站提供的博客平台,例如国内的CSDN.博客园:国外的Blogger.Wordpress 自己建站,发布到自己的服务器上,或者发布到GitHub.GitLab.Bitbucket等支持静态网页发布的git平台 针对于第一种方式,

Windows环境下Jekyll+Github搭建个人博客

萌新来讲讲如何使用 Jekyll 搭建个人博客,从安装到配置!炒鸡详细!.原文地址https://zhangmingemma.github.... 介绍 jekyll是一个静态站点生成器,会根据网页源码生成静态文件. 简单.无需数据库,评论功能,不需要不断更新版本,只用关注你的博客内容 静态.只用Markdown(或者Textile).Liquid.HTML&CSS就可以构建可部署的静态网站 博客形态.自定义地址.分类页面.分类博客内容以及自定义的布局设计 使用GitHub Pages可以运行j

Gridea+GitHub搭建个人博客

某日闲余时间看到一篇介绍Gridea博客平台的文章,大概看了一下觉得此平台还不错,随即自己进入Gridea官网瞅了瞅.哇,这搭建过程也太简单了吧,比Hexo博客搭建要容易很多,而且还有后台管理客户端,很适合小白用户入门.最重要的是不用自己购买域名!可以直接与GitHub或Coding配合展示页面.下面简单介绍下Gridea+GitHub搭建及使用流程,有兴趣的同学可以试试看哦. Gridea简介: 官网:https://gridea.dev/GitHub主页:https://github.com