利用github.io(githubPages)免费托管个人静态网站/个人博客

已于 2022-08-19 14:00:25 修改
阅读量1.1k 收藏 11
点赞数 2
文章标签： github git
于 2022-08-19 10:35:32 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_58352785/article/details/126266428
版权

我们的个人博客或者静态网站可以托管到github就能通过github域名访问

git仓库配置

我采用的是自己编写一个html文件+githubPages搭建，首先需要在GitHub上创建Github Pages服务，具体步骤如下图：

在这里插入图片描述
点击之后仓库名一定要填 用户名.github.io 的格式(形如Lzx981128.github.io)，不要填 用户名 的格式(例如Lzx981128)，这里踩了好几次坑了，下面的README记得点上，最后一步点创建

![在这里插入图片描述](https://img-blog.csdnimg.cn/4d459327cbe44e02b80ea888fa2067c2.pn
在本地编写个index.html文件
在这里插入图片描述
点击上传
在这里插入图片描述
点击选择文件或直接拖拽文件到该区域
在这里插入图片描述

点击提交
在这里插入图片描述

创建 gh-pages分支
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

点击Settings，往下滑动到 Pages 设置选项，将分支选择为 gh-pages。此时上面的网站就是我说的设置域名，如果你没有设置域名则这个地方应该是https://yourname.github.io/MyResume/
在这里插入图片描述
输入我们的地址就可以访问到刚才那个静态页面啦
在这里插入图片描述

热忱1128
关注
  • 2
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
如何使用Github pages托管网页
Tim_Cookerr的博客
07-03 3749
Github Pages使用教程，绝对的保姆级别教程
在github上部署静态页面
qq_58832911的博客
11-24 8713
假如你辛辛苦苦写好了一个静态网页，很想要炫耀一下，让大家都可以通过公网访问看到我的网页。这里有一种最简单的方式，使用gitpage功能，将你的网页通过gitpage部署，大家都可以通过公网看到你的网页了。
github托管静态页面
最新发布
2301_79385221的博客
05-01 1137
免费在线上空间，不用简直就是浪费，关键还不限流量赶紧去折腾一下这是搭建的GitHub托管网页，由于是GitHub的服务器，国内访问会非常！慢。
GitCode Pages: 免费、高速的静态网站托管服务
gitblog_00003的博客
03-10 844
GitCode Pages: 免费、高速的静态网站托管服务 GitCode Pages 是一个免费且快速的静态网站托管服务，让你能够轻松地展示你的作品、分享教程或者创建个人博客。 什么是 GitCode Pages？ GitCode Pages 是一款基于 GitCode 的静态网站托管服务。它允许你在 GitCode 上存储和管理你的站点源代码，并将它们转换为可以在互联网上访问的静态网页。只需上...
创建个人网站（github pages）并将站点一键托管到Github
weixin_45205599的博客
04-08 1467
个人网站搭建：使用静态网站生成工具mkdocs，迅速便捷将markdown编写的文本文件生成个人wiki网站并托管到github供大家访问的全流程总结，保姆级教程，多处踩坑的血泪经验史。
保姆级教程：从零构建GitHub Pages静态网站
阿甘兄
10-20 4501
超详细讲解从零构建Github Pages静态网站
chandrikadeb7.github.io:使用GitHub Pages托管的个人投资组合网站-版本2
05-05
投资组合网站版本2 由构建并由托管的的第二次迭代 先前的版本： TL; DR 是的，您可以分叉此存储库。 请通过链接回给予适当的信誉。 谢谢！ :hammer_and_wrench: 安装与设置 安装Gatsby CLI npm install -g ...
taylorod.github.io:我的静态GitHub托管网站。 您可以在taylorod.github.io上找到它
03-07
taylorod.github.io自述文件：我的静态GitHub托管网站-taylorod.github.io 这是一个简单的网站，可让观看者了解我它以类似于样式的代码进行布局，并始终具有隐藏的超链接。技术栈该网站是用JavaScript，CSS，HTML和...
akshatsh.github.io:我的个人网站托管在akshatsh.github.io
04-16
Jekyll是一个静态站点生成器，非常适合GitHub托管博客（ ） 通过消除许多前期设置， Jekyll Now使创建您的Jekyll博客变得更加容易。 您无需触摸命令行 您不需要安装/配置ruby，rvm / rbenv，ruby gems :smiling_...
ghsdude.github.io
03-19
:writing_hand: 手工博客 使用另一种语言阅读本... GitHub Pages将基于gh-pages分支托管您的网站。您将在几分钟之内通过https://{YOUR_ID}.github.io/访问该网站。 克隆存储库，然后安装节点软件包。 $ git clone htt
4l1fe.github.io:个人博客网站回购。 惠康任何评论
04-11
然后我发现，仅使用Github Pages作为免费托管服务，一步一步地生成静态博客网站会更快，更清晰。 仅需具备所遵循技术的基础知识，即可构建准备部署的文件夹： html，css，markdown 。 用python武装自己，我获得了它...
独立于 Github，更方便地管理自己的静态网站？来试试这套自托管 Git 仓库方案！
kfashfasf的博客
12-28 962
这套方案可以实现一个非常方便的编写博客的方法。你可以在自己电脑上写好文章，生成网站，并且直接git push即可部署到自己的服务器上，一气呵成，一般情况下完全不需要登陆远程服务器。在讲述方案之前，我先说明一下这套方案采用的服务器结构。本地客户端：在本地，也就是我们用来写文章的 Windows 系统，在下文，我称之为客户端。客户端上，我们需要安装Git，并且我们要会用git提交文件。git的安装方法和使用方法在此不做赘述，相信各位试图搭建静态网站的读者，git的用法肯定是有所涉猎的。
GitHub从注册到上传静态网页（保姆级教程手把手教你上载自己的静态网页）
qq_52793095的博客
12-01 2496
将静态网页托管到GitHub上以供别人访问
推荐项目：GitCode的GH-Pages模板
gitblog_00084的博客
03-16 373
推荐项目：GitCode的GH-Pages模板 GitCode的GH-Pages模板是一个基于GitHub Pages的开源网页模板，旨在帮助开发者快速搭建个人或项目的网站。 项目简介 GitCode的GH-Pages模板是一个基于Jekyll构建的静态网页模板，可以帮助开发者在GitHub上快速部署个人或项目网站。 模板包含多个主题，支持自定义配置，可以满足不同场景的需求。 应用场景 个人...
GitHub托管HTML页面，让其他人轻松访问自己的页面
热门推荐
dingningdin的博客
10-29 1万+
如何通过GitHub来托管自己写的HTML页面，能够轻松让其他人访问你的页面，还可以通过GitHub让多人参与进来你的项目 1、创建账户 登陆https://github.com/     注册成功           1、https://guides.github.com/activities/hello-world/ 这是helloworld 页面链接   2、点击start a project 进入验证页面         打开你自己的邮箱   点击链接进行验证，听到水滴
前后端交互学习笔记（一）：Git和Github的使用
憬淮的博客
01-04 352
Git介绍及常用的命令汇总和Github的使用
使用GitHub.io仓库实现个人网站建站
MiningL的博客
07-17 2736
使用GitHub.io仓库实现个人网站建站 文章目录使用GitHub.io仓库实现个人网站建站前言一、注册GitHub二、建立储存库1.新建库2.输入名称3.上传文件4.进行测试5.想进入非index网页总结 前言 总体流程为注册–建立项目仓库–上传网页代码–测试 一、注册GitHub 详细注册过程请自行百度，这里推荐火狐浏览器登录GitHub，可使用火狐浏览器插件进行科学上网，或不进行科学上网时也可以打开GitHub主页。 二、建立储存库 1.新建库 2.输入名称 注意命名格式为：用户名.gi
如何用github的gh-pages分支展示自己的项目
yan_yuanfeng的博客
03-14 1749
1.先用npm安装 gh-pages npm install gh-pages --save-dev 2.修改package.json文件 3.修改config目录下的index.js build: { index: path.resolve(__dirname, '../dist/index.html'), assetsRoot: path.re...
github pages 用法详解
lancemao的博客
08-24 1万+
详细介绍 github pages 的使用方法，包括基础用法和通过 actions 自动发布
怎么把静态网页部署到github上
08-15
### 回答1： 为了把静态网页部署到 GitHub 上，你需要以下步骤: 1. 创建一个新的 GitHub 仓库，或者找一个已有的仓库。 2. 在本地的电脑上使用 Git 命令初始化仓库。 3. 将你的静态网页文件添加到仓库中。 4. 使用 Git 命令将这些文件提交到仓库。 5. 将仓库同步到 GitHub 上。 这样你就可以在 GitHub 上查看和访问你的静态网页了。 ### 回答2： 要将静态网页部署到GitHub上，可以按照以下步骤进行操作： 1. 创建GitHub账户并登录。如果没有账户，可以在GitHub官网上进行注册。 2. 在GitHub上创建一个新的仓库。点击页面右上角的“+”按钮，选择“New Repository”。 3. 在仓库名称一栏中输入一个适合的名称，例如“my-website”。确保仓库为公开状态，并勾选“Initialize this repository with a README”。 4. 将静态网页的文件夹上传至GitHub仓库。可以使用Git命令行工具或者GitHub Desktop等工具来操作。 5. 打开需要部署的静态网页文件夹，确保其中包含一个名为“index.html”的主页文件。 6. 在GitHub仓库页面中，点击上方导航栏的“Settings”选项。 7. 在“GitHub Pages”部分，将“Source”设置为“main”分支，并点击保存。 8. 等待片刻后，会在同一页面的“GitHub Pages”部分看到一个网址链接，表示网页已经成功部署。可以通过点击链接访问部署后的静态网页。 总结： 将静态网页部署到GitHub上需要先创建一个仓库，然后将网页文件夹上传至仓库中，并确保主页文件命名为“index.html”。最后，在仓库的“Settings”中将“Source”设置为“main”分支，即可通过部署后的网址链接访问到静态网页。 ### 回答3： 要将静态网页部署到GitHub上，需要完成以下步骤： 1. 创建GitHub仓库：登录GitHub，点击左上角的“+”号，选择“New Repository”创建一个新的仓库。 2. 命名仓库并设置可见性：输入仓库名称，并选择仓库的可见性设置，可以选择公开或私有。 3. 克隆仓库到本地：在本地的终端或命令行中使用以下命令克隆仓库到本地： ``` git clone <GitHub仓库地址> ``` 4. 创建并切换到gh-pages分支：在本地仓库的根目录下，输入以下命令创建并切换到gh-pages分支： ``` git checkout -b gh-pages ``` 5. 将静态网页文件复制到本地仓库：将静态网页的HTML、CSS、JavaScript等文件复制到本地仓库的根目录下。 6. 提交更改并推送到GitHub仓库： ``` git add . git commit -m "Add static webpage files" git push origin gh-pages ``` 7. 等待推送完成后，在GitHub仓库的页面上刷新，就能看到静态网页的文件列表。 8. 访问部署的静态网页：点击GitHub仓库页面上的“Settings”，在“GitHub Pages”部分，找到“Your site is published at”后面的链接，点击即可访问部署的静态网页。 通过以上步骤，可以将静态网页成功部署到GitHub上，从而实现在线访问和分享。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值