不会写代码也能搭建个人网站 Github和Gridea帮你实现

本文详细介绍了如何通过Gridea静态网页生成器在GitHub上搭建个人网站,包括安装客户端、创建token、配置连接、文章设置与发布等步骤,适合不需编程的用户轻松建立个人博客。
摘要由CSDN通过智能技术生成

上一篇文章给大家介绍了如何使用Github和Publii免费搭建一个静态网站,并且不需要写代码就能得到一个样式美观、结构清晰的网站。这篇文章再给大家介绍另一种类似的解决方案,使用Gridea静态网页生成器来完成网站内容的建设。

bdea9555a40b6e5a34b1805c1451eec0.jpeg

1.安装Gridea客户端

首先,参考之前的文章,在Github创建一个仓库,用来存储页面源码。

然后,访问Gridea官网:https://open.gridea.dev/,下载安装Gridea客户端,有MacOS、Windows和Linux三种系统的客户端,大家可以按需下载。

c78704cf156d4ecd1b6fa8605001a4c7.jpeg

2.创建token

Gridea客户端安装好以后,接下来,我们去Github上创建一个token,这个token是用来将gridea生成的网页代码推送到Github仓库中。

大家可以访问这个链接创建一个token:https://github.com/settings/tokens,点击“Generate new token(classic)”

d84401bdd908690d4f0917d2d0462d23.jpeg

如下图所示,给token命名,设置过期时间,勾选“repo”仓库相关权限,然后点击页面底部的”Generate token“按钮生成一个token。

c4731f95569db1f7e47249be706d2f29.jpeg

点击下图中红框处复制token,请妥善保存token信息。

7bc0dadb2e6e831516ce33305f0baf6a.jpeg

3.配置Gridea客户端

返回到Gridea,选择”远程“tab下的”基础配置“页面,如下图所示,平台选择“Github Pages”,域名填写你在Github上创建的仓库名,仓库用户名和邮箱填写你的Github账号用户名和邮箱,令牌就是在Github上创建的token。

相关内容填写完成后,点击右下角的”保存“,还可以点击左下角的”检测远程连接“查看配置是否有问题,一切OK的话,顶部会弹出”远程连接成功“的提示信息。

3f373e4d14d07fe83f5e2bc668c2a01d.jpeg

连接信息配置完成后,接下来,你可以在Gridea中做各种个性化的设置来美化你的网页,可以在”主题“tab中进行设置,还可以点击左下脚的”预览“在本地查看网页的效果。

6ffd0f6249d31c1805b62555013ae980.jpeg

如下图所示,就是一个使用了Gridea主题生成的静态网页,相比较我们上一篇文章中的原始页面,是不是已经很美观了?

07547ce7e1a81bf80ad56ba00b7293b4.jpeg

4.文章设置及发布

网站的基础结构设置完成后,我们来看看日常使用最多的写文章的操作。

文章的相关编辑和设置选项都在页面的右侧,可以点击锯齿图标打开设置项。

f219fa01db46820ad9e1a5dfa7871062.jpeg

文章设置中可以修改文章的URL、标签、封面等信息,还可以设置文章在列表中是否隐藏和置顶等选项。

9d1a04d1827f5568fab7179a40dff8eb.jpeg

文章撰写完成后,本地预览没有问题,就可以点击左下角的”同步“选项,将内容发布到Github上。

这里我写了一篇欢迎文章,测试下效果。

4f3771ee9d46b188621c1685970138dc.jpeg

同步完成后,顶部会弹出”同步成功“的提示。

7e96c9e7914632225f2b329bba0843b9.jpeg

接下来你可以去Github刷新页面,查看仓库中是否有新的文件,可以看到,仓库中多了很多Gridea同步的记录。

90176edbf33caf1acbd1e92a1445528e.jpeg

稍等两分钟时间,可以用你的仓库名访问你的个人博客,Github需要一点时间部署静态页面。

部署成功后,就可以成功看到你的Gridea中编辑的页面和文章啦!

cb7d5a8b8eb7a68c8c36e0404ef941b8.jpeg

在Github仓库中,你可以在post目录下找到你写的文章,Gridea已经自动帮你把文章转换成了对应的html文件。

1941961993a6039fbdfa2769965825bd.jpeg

如果你想要低成本的搭建一个个人网站,只想要简简单单写写文字,分享自己的点滴日常,那本文提供的这种方式就是很好的选择,快来试试吧!

  • 25
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在GitHub搭建个人网站,你可以按照以下步骤进行操作: 1. 创建一个新的仓库(Repository):在GitHub上创建一个新的仓库,仓库名字可以是`<你的用户名>.github.io`,注意将`<你的用户名>`替换为你在GitHub上的用户名。 2. 选择网站生成器:选择一个适合的网站生成器来构建你的个人网站。一些常用的选择包括Jekyll、Hugo、Gatsby等。这些生成器可以助你快速构建静态网页。 3. 在本地设置仓库:将刚刚创建的仓库克隆到本地,并在本地设置相应的配置文件。具体操作取决于你所选择的网站生成器,你可以参考官方文档来完成这一步骤。 4. 定制你的网站:根据个人需求,进行网站的定制。你可以编辑页面内容、选择主题、添加自己的样式等。 5. 提交更改并推送到GitHub:完成网站的定制后,将更改提交到本地仓库,并将这些更改推送到GitHub上的仓库。 6. 配置GitHub Pages:在GitHub上找到刚刚创建的仓库,进入仓库的设置页面,找到GitHub Pages选项,并将它配置为从主分支(通常是`master`或`main`)来构建你的个人网站。 7. 等待构建完成:一旦你的个人网站的构建过程完成,你就可以在浏览器中访问`<你的用户名>.github.io`来查看你的个人网站了。 请注意,上述步骤是一个大致的指南,每个网站生成器可能有不同的具体操作步骤。记得查阅选用的生成器的官方文档以获得更详细的指导。祝你搭建成功!

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值