使用gitee搭建自己的图床

如何搭建一个免费的图床

 最近发现自己博客中的图片全部消失,很苦恼.当时用的是七牛云,花好长时间弄好的,当时用的还是很顺畅的,但有一个坑,就是需要配置自定义域名(当时没有注意到这一点), CSDN博客专家的推荐下搭建图床的方式 – 使用github page搭建图床.

大体步骤如下:

1.创建gitee(码云)账号 (如果已有账号可以跳过此步骤)

1.1 登陆码云官网进行注册

https://gitee.com/

1552218028455

1.2 进行注册

1552218120925

2. 创建工程

2.1 创建一个新工程

1552218261402

2.2 填写项目信息

![新建仓库 - 码云 Gitee.com](http://zi1.gitee.io/picture/tc/01/新建仓库 - 码云 Gitee.com.png)

3. 搭建你的项目

  1. 现在我们需要做的就是将刚才新建好的项目down下来

1552218836155

  1. 拉取代码到本地(这是git的基本操作,如果会就直接跳过)

    1552218927183

  2. 复制图1 中的地址到地址栏点击确定

    1552219032049

  3. 拉取下来后我们会看到这样的目录

    1552219301186

  4. 现在我们在目录中建立一个文件夹如:picture ,并在其中随意放入一张图片

    1552219370649

    将新创建的文件纳入版本控制

    1552219496665

    点击确定

    1552219669612

    提交 1552219741583

    提交到主分支上 1552219927659

    再次推送 1552219990875

    直接一顺操作

    注意:这里可能需要你输入gitee的账号密码 1552220062502

    当你看到这一步的时候就可以说是推送完成了 1552220125122

4. 启用gitpage服务

  1. 这时我们再次打开我们的gitee项目,选择右侧的服务下Gitee Pages

1552220406128

  1. 打开后我们点击启动

1552220482860

  1. 当我们点击启动后,启动成功的画面如下,我们点击下面的这个地址

1552220546003

  1. 还记得我们当时创建的文件夹名字和图片名字吗?

在项目名下加上文件夹(也就是路径)名字 再加上你的图片全面(加后缀)

我的路径是:

http://zi1.gitee.io/pic/picture/1.jpg

1552220978327

当做到这里你的图床路就搭建成功了!

此时你可以直接引用此路径,但稍微比较麻烦.

5.修改引用路径

如果你也是用Typora进行博客创作可以进行如下设置,可提高你的创作效率

  1. 将typora中图片保存设置为你的git存放图片的目录

1552221315081

那么此时,你的图片文件已经保存了一份在你的git本地,直接推送到远程仓库就可以了.操作与第三步一样,纳入版本控制后一顺推上去

推送完成后可以验证一下是否推送成功,在地址栏输入图片路径,进行验证

注意: 此时我们的图片引用的还是本地的路径,下面我们将图片改成gitee上的路径

  1. 我们将内容复制为markdown格式

1552221852788

  1. 我们将所有的内容黏贴到文本编辑器中,此处建议使用notepad++
  2. 将所有的上斜线替换成下斜线

1552222076882

  1. 替换成gitee的路径

1552222308503

替换的时候我们只需要将本地路径替换成gitee路径即可.

验证我们的地址是否成功 – > 将替换后的文本全选黏贴到一个新的markdown中,如果图片可以显示出来,说明没有问题

** 注意: 建议将全文写完后再进行路径的替换**

6. 修改gitee主页

有朋友看到第一眼觉得这个主页很丑,你可以替换成你喜欢的主页都可以.这里推荐一个地址:

http://www.cssmoban.com/

下载自己喜欢的模板.

或者

打开你想要的页面,ctrl + s 保存网页(以百度主页为例www.baidu.com)

1552222739802

你会得到这样两个文件

将html文件名修改为index.hmtl

然后将这两个文件放如你的本地工程中

1552222943754

纳入版本控制,一顺上推就ok了.

在网上下载下来的模板也是一样的玩法.

在此感谢内容的提供者和创作者 :

微信公众号 : Java编程技术乐园

CSDN博客专家 : 阿飞云(aflyun)的技术乐园

  • 14
    点赞
  • 46
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值