完全从零搭建简单个人网站（免费无需服务器无需域名）个人博客网站，个人简历网站模板

聊言青

已于 2024-09-29 02:49:15 修改

阅读量597

点赞数 14

文章标签： html http json css

于 2024-09-29 02:44:59 首次发布

本文链接：https://blog.csdn.net/m0_61718615/article/details/142624599

版权

无需会编程，无需会任何前置知识。学会了帮忙给我的github项目点个star。

简单来说就是使用github提供给每个账户的免费github.io域名及对应的支持

以下是具体的步骤：

方法1：从作者的网站模板中修改（推荐小白使用）

打开作者的个人网站仓库所在地：GitHub - liaoyanqing666/liaoyanqing666.github.io: 简单的个人简历网站模板, Simple CV website template
找到并点击页面右上角的 Fork 按钮。（顺手点击一下旁边的star按钮感谢）
通过 Fork，你将复制这个项目仓库到你自己的 GitHub 账户下。这样你可以在这个项目的基础上做出修改，而不影响原始项目。
在 Fork 完成后的新页面中，找到 Repository name 输入框。这里你需要填写 "你的 GitHub 用户名.github.io"。比如你的 GitHub 账户名是 ABC123，那么此处填写 "ABC123.github.io"。

方法2：直接创建空仓库

创建一个仓库，并命名为 "你的 GitHub 用户名.github.io"。比如你的 GitHub 账户名是 ABC123，那么此处填写 "ABC123.github.io"。注意创建一个index.html文件，否则网页生成时会根据README.md进行生成。

如果选择Fork 仓库后，你将看到多个文件，其中包括 index.html、styles.css 等关键文件。我们需要编辑这些文件来自定义你的网站内容。

1. index.html：这个文件是你网站的主页内容文件。打开网址后，用户看到的就是这里面的内容。你可以根据自己的需要，在这里修改文字、图片以及其他内容来个性化网站。

2. styles.css：该文件定义了网站的样式和外观，例如背景颜色、文字大小、排版等。如果你对默认的外观感到满意，可以跳过此部分。如果想要个性化设计，可以修改文件中的样式规则，轻松改变网站的颜色和布局。

3. 其他文件：提供一些基础功能和开源许可等，无需修改。

4. CNAME：该文件用于配置自定义域名。如果你有自己的域名并想将它与 GitHub Pages 关联，则可以保留此文件并进行相应配置。如果你不打算使用自定义域名，请务必删除此文件。删除方法如下：

如果选择创建空仓库，仍然参考上述描述。

接下来介绍怎么具体修改文件内容

方法1：直接在github上修改（只推荐完全不会编程的小白使用）

如果采用这个方法，需要完成“部署网站”的内容才能进行
在项目仓库中打开index.html，并同时打开刚刚部署好的网站，接着对照着网站上需要修改的内容，再在html中修改。需要保存时，就提交此次更改（右上角commit changes）。过十几秒左右，github就会把刚刚的更新同步到你的网站上，此时刷新即可。
替换并删除所有不需要的内容后，就完成了内容的更改。
对于文件夹中的图片和文件，如果有相关内容，就替换并上传自己的内容进行替换；如果没有，则删除该文件的同时，也在index.html中删除引用到此文件的部分（直接搜索文件名就行）

方法2：本地修改网页内容

点击右上角绿色code按钮，clone自己的仓库到本地（不会clone请自行搜索）。如果不会clone也可以使用Download ZIP，只是这种方法提交不方便。
使用网页相关的IDE进行编辑，推荐使用VScode。在VScode左侧插件处，搜索Live Server插件并下载。之后在文件夹中打开html文件时，右键文件内容，选择Open with Live Server即可
之后会弹出一个网页，这个网页会同步你在代码中进行的任何更改（VScode代码需要手动保存）。
编辑完成后，如果是clone的，就直接通过VScode左侧的“源代码管理”进行提交即可（提交时那个框框里必须写东西）
如果是下载ZIP的，就直接Upload files即可，把所有更改的内容拖进去提交即可。