利用Github Page 搭建个人博客网站

news/2024/5/10 3:35:13/文章来源:https://blog.csdn.net/csnewdn/article/details/54730506

利用Github Page 搭建个人博客网站

转载请注明出处:

http://blog.csdn.net/tzs_1041218129/article/details/53214497

http://www.54tianzhisheng.cn/Blog/html/blog_github.html (阅读效果最好)

更多精彩文章请关注微信公众号:猿blog

前言

最近这几天,没事干,想找点事折腾下,于是自己便想到了自己一直想干的一件事:搭建一个属于自己的博客网站。目前搭建个人 blog 网站最好的是用 wordpress ,但是那个折腾起来好像还挺麻烦的,再加上还需要自己修改些前端代码和用 PHP 做(虽然我学了几天拍黄片,但是早已忘了),然后就是用 Github Page 吧,自己也一直在这个最大的交友网站装 X 。想想就用这个吧(后来好像觉得这个还挺省事的)

再说说拥有个人博客网站的好处吧:

  • 装 X(如果网站够炫)
  • 很好的用来总结自己所学的知识
  • 面试加分(在简历上放上自己的个人网站链接,面试官就可以更好的了解你,知道你所学知识的深度和广度)
  • 不再受其他博客平台的规则所束缚

如果你现在还没有自己个人博客网站的话,那么我觉得你看完本篇博客后,强烈的建议你去折腾折腾下,搞个自己的,让自己也能够体验装 X 的感觉。

要想用搭建一个个人博客网站,首先你得有一个域名,这样别人才可以通过域名访问,其次你还要一个空间来存放你的页面。

  • 域名 域名的话,你可以在万网、阿里云、腾讯云等注册,我的域名 www.54tianzhisheng.cn 就是在腾讯云注册的,记得是腾讯云一元钱(一个域名+主机)搞的,这是腾讯云对学生才有这优惠。 .cn 的域名需要备案,备案的审核速度我觉得还是挺快的,还需要上传证件。当然你也可以买其他的那些不需要备案的域名,省得麻烦事。
  • 空间 空间有免费的空间,也有收费的空间。免费的当然就不够稳定了,收费的就很贵了,终究是很不爽,有没有什么地方是既免费又稳定的空间呢?有,Github 。它允许上传个人网站项目并自定义你的域名,而且又有稳定的服务,实在是不能够在好了。

下面就一起跟着我来一步一步的利用 Github 搭建个人博客网站吧!

1. 拥有一个域名

这个步骤我就不详述了。

举例:

  • 打开腾讯云官网
  • 搜索你想要的域名,下单买一个

2. 拥有一个 Github账号

互联网崇尚自由与分享。Github 是一个全世界程序员聚集的地方,大家相互分享自己写的代码,提升别人,也提升自己。大家都在为着开源社区努力着。因为我从开源项目中学到很多知识,所以我也非常愿意分享我的所见所学所得,我的 Github 主页:https://github.com/zhisheng17 (欢迎 follow 和对我的项目给个 star 或者 fork 我的项目一起来和我完善项目)

如果还没有 Github 账号的话你就先去注册一个吧,有的话,直接登录就行,后面的操作都要用到 Github 的。

3. Github 上新建个人网站项目

登录 GitHub 之后,在页面右上角点击 + 加号按钮,点击 New repository。

这里写图片描述

由于我们是新建一个个人网站项目,所有仓库的名称需要安装 GitHub 个人网站项目的规定来写。

规则就是:

YOUR-GITHUB-USERNAME.github.io

比如我的 GitHub 用户名是 zhisheng17,那我就要填写 zhisheng17.github.io。然后选择公开模式,接着点击创建仓库按钮。

这里写图片描述

创建成功之后,进入了项目主页面。点击设置按钮。

这里写图片描述

进入之后,滚动页面到下方。点击页面自动生成器按钮。

这里写图片描述

点击右下方继续去布局按钮。

这里写图片描述

选择一个模板,点击发布页面按钮。

这里写图片描述

这里写图片描述

这个时候,你就可以通过YOUR-GITHUB-USERNAME.github.io来访问此页面了。

4. 上传个人网页到 Github

自动生成页面,肯定不符合我们的要求,我们希望能够自己设计自己的个人网站。我们可以自己编写一个网页文件,命名为 index.html。然后上传到 GitHub个人网站项目上。这里为了节约时间,可以先下载我的个人网站项目代码,然后修改为你的网页上传到 GitHub。

下面介绍详细步骤。

进入此项目https://github.com/zhisheng17/zhisheng17.github.io,然后下载源码。解压之后,拿到里面的index.html文件。

这里写图片描述

然后进入自己的个人网站项目主页 YOUR-GITHUB-USERNAME/YOUR-GITHUB-USERNAME.github.io。点击上传文件按钮,进入上传文件页面,将 index.html 文件拖入蓝色大圈圈区域,点击提交按钮即可提交成功。此时打开网址 YOUR-GITHUB-USERNAME.github.io 就可以看到主页已经改变为我们自己的网页了。

这里写图片描述

这里写图片描述

通过 zhisheng17.github.io 查看效果:

这里写图片描述

5. 域名CNAME到个人网站项目

网页上传成功了,我们不想一直通过YOUR-GITHUB-USERNAME.github.io来访问我们的个人网站,而是希望通过自己的域名来访问。

下面讲述详细步骤。

点击我们的个人网站项目设置选项卡,滚动到下面,就会发现一个自定义域名卡片。输入我们买的域名,然后点击保存。

这里写图片描述

这里写图片描述

接着我们还要将我们的域名解析到这个个人网站项目上。因为我的域名是在腾讯云上面买的,所以我打开腾讯云域名管理页面,进行相关的设置。

这里写图片描述

接着,点击添加一条域名解析记录,主机填写www,代表你是一级域名来访问,指向填写YOUR-GITHUB-USERNAME.github.io,然后点击保存按钮。应该要等会,域名的解析时间可能不一样,我的腾讯云就是很慢的

这里写图片描述

6. 访问你的域名

所有这些步骤做完之后,在浏览器里输入自己的域名,回车键一按,就会返回我们刚刚上传到 GitHub 的index.html 页面了。

这里只是入门了 GitHub 搭建个人网站的功能,GitHub 官方推荐 Jekyll 博客系统来发布自己的页面。以后有数据更新,都可以通过 Jekyll 来重新编译整个网站。(期待后续我的使用 Jekyll 博客系统发布自己博客的文章吧)

这里写图片描述

7. 注意事项

尽管GitHub个人网站项目是免费的,但是却有一些限制。总体来说,完全够用,甚至太多了。

  • 单个仓库大小不超过1GB,上传单个文件大小不能超过100MB,如果通过浏览器上传不能超过25MB
  • 个人网站项目也不例外,最大空间1GB
  • 个人网站项目每个月访问请求数不能超过10万次,总流量不能超过100GB
  • 个人网站项目一小时创建数量不能超过10个

当然了,这些政策可能随时改变,可以通过此网页查看最新政策。 https://help.github.com/articles/what-is-github-pages/#recommended-limits


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_790813.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何搭建个人网站

如何搭建个人网站(二) 2017年1月28日by 搬砖工 /0 406在上一篇文章中,博主为大家介绍了有关租赁服务器和连接服务器的步骤。接下来就给大家介绍一下如何在我们租用的服务器上面搭建我们需要的应用服务器和发布产品。本篇文章以nginx、tomcat搭…

12306一直显示服务器忙,网购春运火车票首日 12306网站又现服务器忙

①青岛火车站售票大厅内,购票回家的旅客已明显增多。②来自广西的杨先生和同伴们准备拎着行李提前回家。据了解,他们在船厂工作,由于天冷活少,所以提前放假了。③"小候鸟"在妈妈的背后等候进站上车。 本版图/记者 孙传浩…

茌平计算机中考成绩查询,最新:个人成绩查询中考成绩登录系统网站入口

阅读本文前,请您先点击上面的“疏密有致”,再点击“关注”,这样您就可以继续免费收到文章了。每天都会有分享,都是免费订阅,请您放心关注。注:本文转载自网络,如有侵权,请在后台留言…

iconfont 图标宽高出问题_icon图标网站分享

分享几个优秀的图标网站,小伙伴们可以自行取用哈~本文通过四个类别进行网站分享。类别1:icon图标网站1、iconfont链接地址:https://www.iconfont.cn/阿里巴巴图标矢量库,今年新增了插画库的功能,是众多设计师钟爱的图标…

北大网站服务器关闭,北京大学网络服务

&nbsp1、如何在Windows2000环境下配置静态IP地址第一步:选择“控制面板”,选择“网络和拨号连接”第二步:鼠标右键选择“本地连接”(或者相应的网卡名称),选择“属性”第三步:选择“TCP/IP协议”第四步&#xff1a…

nextcloud linux源码有没有java版本的_如何使用Nextcloud 搭建个人网站

Nextcloud是一套用于创建网络硬盘的客户端-服务器软件。其功能与Dropbox相近,但Nextcloud是自由及开放源代码软件,每个人都可以在私人服务器上安装并运行它。与Dropbox等专有服务相比,Nextcloud的开放架构让用户可以利用应用程序的…

网站做好后不能用手机浏览吗_企业品牌网站建设要注意哪些细节

互联网行业蓬勃发展,要做好互联网营销,那么企业网站的一定不能少的,现在网站的类型各种各样,比如企业展示类、商城类、商务类、分享类等等,网站的类型有很多,但是对于企业来说,主要还是展示类和…

pygame.image.load()找不到图片_强烈种草的5款资源网站!每一款都有找不尽的资源!...

你们知道的资源网站有哪些呢?百度!百度!百度!其实除了百度还有很多资源网站我们需要去慢慢挖掘,只是你不知道而已。今天小编就来和你扒一扒有哪些资源网站值得我们收藏,快来看看吧!1. 虫部落快搜…

搜索引擎收录查询工具_影响网站收录的因素有哪些?

点上方蓝字关注我们在seo优化网站中,收录是很重要的数据,通过分析收录数据,可以诊断出网站存在的问题,帮助seoer不断调整优化策略。什么是网站收录?网站收录是指搜索引擎通过自己的算法,通过蜘蛛抓取,将网…

用html做网站古诗春思,春思

七言律诗皇甫冉春思莺啼燕语报新年, 马邑龙堆路几千。家住层城邻汉苑, 心随明月到胡天。机中锦字论长恨, 楼上花枝笑独眠。为问天戎窦车骑, 何时返旆勒燕然。Seven-character-regular-verseHuangfu RanSPRING THOUGHTSFinch-notes…

实验Linux之利用源代码——httpd网站搭建服务(阿帕奇)的安装

源码包安装一,下载源码包二、安装gcc、gcc-c、make三、解压并安装四、make 和make install五、修改配置文件与启动六、启动apache:七、最后一步,查看是否安装成功1,源代码包的一般封包格式:包名.tar.gz或者是包名.tar.…

实验Linux之利用rpm,yum——httpd网站搭建服务(阿帕奇)的安装搭建

安装位置:利用rpm安装的软件会有自己的默认安装路径 1、先查看自己的linux的版本 uname -a 为第七代版本 ,安装软件要安装centos7的 2、网站搭建服务的对应软件名为httpd,登录网站进行查找,选择x64_64版本 https://pkgs.org/ 3…

360浏览器一直显示安全连接到服务器,360浏览器提示“您与此网站之间建立的连接不安全完美解决方法...

如果您是该网站的访客,请注意不要在该网站上输入任何敏感信息,更不要在线进行任何购买等交易,因为正规的网上商城网站都会使用 https 加密连接来保护用户的信息安全。安装了SSL证书的网站,好处很多,例如可以获得更好的…

mysql统计人数_网站访问统计系统 Matomo,基于 PHP5+MySQL,前身是Piwik

Matomo 的前身是 Piwik,是一套基于 PHP5MySQL 技术构建的开源网站访问统计系统。Matomo 可以给你详细的统计信息,比如网页浏览人数,访问最多的页面,搜索引擎关键词等等流量分析功能。此外,它还采用了插件扩展及开放 AP…

[转载]大型网站架构演变和知识体系

原文地址:http://www.blogjava.net/BlueDavy/archive/2008/09/03/226749.html 之前我简单向大家介绍了各个知名大型网站的架构,MySpace的五个里程碑、Flickr的架构、YouTube的架构、PlentyOfFish的架构、WikiPedia的架构。这几个都很典型,我们…

学用MVC4做网站一:用户

用户部分要实现的功能有&#xff1a; 序 一、用户 1.1用户注册 1.2用户登录 1.3修改密码 1.4修改资料 要实现这些目的首先新建用户&#xff08;Model&#xff09;模型 /// <summary>/// 用户模型/// </summary>public class User{[Key]public int UserId { get; se…

在线 pdf转html代码,快速建站的免费办法:在线PDF转HTML您得掌握!

代码对于我们这种小白来说简直就是一堆不认识的字母和符号&#xff0c;但是对于专业的程序员来说无疑就是他们的家常便饭。有时候小编还挺羡慕从事这项工作的人们&#xff0c;除了容易掉头发之外这个工作还是很令人尊敬的&#xff0c;毕竟科技越来越发达离不开码农们的奋战一搏…

InstantClick – 快速响应!让你的网站与众不同

尽管网络带宽不断增加&#xff0c;但网站并没有更快很多。这是因为最大的瓶颈在于页面加载的延迟。InstantClick 是一个很小的 JavaScript 库&#xff0c;大大加速你的网站响应速度。  在访问者点击一个链接之前&#xff0c;鼠标会悬停在链接上面&#xff0c;这两个事件之间通…

ASP.NET MVC5 网站开发实践(二) Member区域 - 用户部分(3)修改资料、修改密码

在上一篇博客中实现了用户的注销和登录&#xff0c;其实代码里落了点东西&#xff0c;就是用户登录要更新最后一次登录时间和登录IP&#xff0c;这次补上。今天做修改资料和修改密码&#xff0c;TryUpdateModel是新用到的东西。 目录&#xff1a; ASP.NET MVC5 网站开发实践 - …

把这些地方都注意了,你的网站就不会有那么多的兼容问题了

根据我的实践经验。如果你在写HTML/CSS时候是按照W3C推荐的方式写的&#xff0c;那么基本的浏览器兼容问题都是可以避免的。 这里主要考虑是的ie8-,个人目测Ie9的渲染效果已经跟的上主流了。 测试ie兼容最好要在win7上测试&#xff0c;因为winXP最高支持IE8。 这里贴出百度统计…