解放双手,markdown文章神器,Typora+PicGo+七牛云图床实现自动上传图片
本文主要分享使用Typora作为Markdown编辑器,PicGo为上传图片工具,使用七牛云做存储来解放双手实现图片的自动化上传与管理。提高写作效率,提升逼格。用过 Markdown 的朋友一定会深深爱上这种优雅的写作方式,比起惨不忍睹的 Word 简直要帅气得多了。
Typora 是一款简单、高效而且优雅的 Markdown 编辑器,它提供了一种所见即所得的全新的 Markdown 写作体验。它把源码编辑和效果预览两者合二为一,在输入 Markdown 代码的时候即时生成预览效果。Typora 的一切都围绕纯粹的生产效率而设计。
Typora一直是我最喜欢的 markdown 编辑器,写博客、记笔记的首选软件。相信大部分朋友也在使用 Typora 这款软件,最新的Typora终于支持图床功能。
1、创建并上传文件到存储空间
1.1、注册七牛账号,并且实名认证
1.2、创建储存空间
打开侧边栏,选择对象存储

选择新建空间

- 存储空间名称:按规则随便取
- 存储区域:选择离靠近的地区
- 访问控制:选择公开,否则外网无法访问,没法作为图床
1.3、上传文件

选择文件管理,点击上传文件即可上传
不绑定私有域名时默认外链域名即为官方分配的30天有效临时域名,
如果绑定私有域名可以选择私有域名
点击详情即可预览图片
点击更多,选中复制外链即可获得图片外链
获取外链之后直接输入浏览器网址栏,或者在代码里引用就行了!
2、创建二级域名并解析到七牛云CNAME
七牛云默认会每隔30天重新分配一个临时的测试域名,也就是说,过了30天域名重置以后,之前的外链就全部失效,为了预防这种情况,我们需要绑定一个自己的私人域名。
2.1、设置存储空间域名绑定

选择自定义域名,添加一条你要绑定的子域名,其他设置不需要动,添加完保存即可
子域名格式需要为:主机记录.域名,比如
img.xxxxx.com这样配置完成后鼠标移至CNAME按钮上,复制
CNAME比如我的配置就是
***.rdi***work.net.qiniudns.com
2.2、前往域名服务商创建二级域名
这个就省略了,自行创建即可。
3、下载并安装图床管理工具PicGo
在前面我们已经搭建了用于存放图片的云存储,我们如何高效快速的把图片存储到七牛云上呢?
相信许多自己做网站动静分离的童鞋一直苦于繁琐的图片上传操作,以七牛云为例,上传一张图片需要登录七牛云,然后手动上传图片,再自己编辑链接,然后复制到 markdown 里四个步骤,当然我们自己的博客系统Copy图片时自动就会上传到对应的云存储中,接下来介绍的 PicGo 就是将这繁琐的操作简化。
有时我们不单单维护一个博客系统,有可能有多个,全使用MarkDown语法 编写,这时使用Typora来统一的编写工具那就非常的方便管理了。
PicGo用于免费搭建个人图床,并且跨平台支持 Windows、macOS 和 Linux 系统,它的使用非常简单,只需先设置好图床网站 / 云存储服务的账号之后,用鼠标将图片拖放到 PicGo 主窗口的图片上传框,即可完成图片的上传并返回一个url链接到剪切板。
现在图床基本可以使用了,但是为了能更方便的管理,最重要的是能跟Typora无缝衔接,我们还需要PicGo辅助,
PicGo下载地址,选择版本并且根据自己的操作系统选择对应的安装包即可。

安装好后打开界面如下所示:

在左侧的图床设置中,有非常多的图床可供选择,大家可以根据自己的使用进行选择,这儿我们选择“七牛图床”

需要填写的配置项:
- 设定AK和SK:前往七牛云个人中心 ->密匙管理复制黏贴即可

设定储存空间名:和七牛存储空间名称一致
设定访问网址:即你的二级域名,这里需要在域名之前加上http://

- 创建空间时,选择的存储区域,从z0到z1,依次对应:华东、华北、华南、北美、东南亚。七牛云的存储对象的地区对应表如下:


然后点“确认”按钮,保存设置,回到上传区选项即可上传图片到图床。
- 上传图片成功后剪贴板会自动获取图片引用的外链
- 在相册可以查看通过PicGo上传过的图片
我们拖动一张图片到下图区域就会自动上传到七牛云中

单击“相册”,可以查看已上传的图片。

要实现Typora中图片自动的上传,我们需要设置PicGo Server,如下图所示。


默认配置即可,只要保证端口没有被占用。
4、Typora配置图片上传
4.1、配置上传服务设定
设置好PicGo后来到Typora进行配置,打开Typora的文件菜单,选择“偏好设置”,选择“图像”,如下图所示。

- 上传服务:选择PicGo
- PicGo路径:选择PicGo安装根目录的.exe文件
配置好后,可以单击上图中的“验证图片上传选项”,来确定配置的正确性,如下图所示。

4.2、上传图片
上传图片有三种方式:
加入图片时直接上传
在偏好设置 --》图像 --》插入图片时 设置
对图片右键上传
在格式 --》图像 --》 上传所有本地图片
图片上传成功,会在右下角显示提示信息。

如果出现报错,一般是端口被占用,可以打开PicGo的server看看端口是否还是36677,改变了的话改回来就好了。
以上我们就完成了图片的自动上传,编写文章非常的方便了。
一路走来数个年头,感谢RDIFramework.NET框架的支持者与使用者,大家可以通过下面的地址了解详情。
RDIFramework.NET官方网站:http://www.rdiframework.net/
RDIFramework.NET官方博客:http://blog.rdiframework.net/
特别说明,框架相关的技术文章请以官方网站为准,欢迎大家收藏!
RDIFramework.NET框架由海南国思软件科技有限公司专业团队长期打造、一直在更新、一直在升级,请放心使用!
欢迎关注RDIFramework.NET框架官方微信公众号(微信号:guosisoft),及时了解最新动态。
使用微信扫描二维码立即关注

解放双手,markdown文章神器,Typora+PicGo+七牛云图床实现自动上传图片的更多相关文章
- MacOS Typora集成SM.SM图床 实现自动上传图片
MacOS Typora集成SM.SM图床 实现自动上传图片 此为PicGo-Core (Command line) (OpenSource)配置方法 参照官网 https://support.typ ...
- Typora + 七牛云图床快速配置,告别手动上传图片!
大家好,我是zeroing,本文将介绍关于 Typora 软件如何配置七牛云图床,实现图片即插即用,可以先看一下最终效果! 可以看到图片借助 Typora 软件自动将本地存储转化为第三方图片网络链接 ...
- 七牛云图床和Markdown使用
七牛云图床和Markdown使用 1.图床是什么? 图床一般是指储存图片的服务器,有国内和国外之分.国外的图床由于有空间距离等因素决定访问速度很慢影响图片显示速度.国内也分为单线空间.多线空间和cdn ...
- Typora+PicGO+Gitee实现图床功能
Typora+PicGO+Gitee实现图床功能 版本 typora(0.9.86) PicGo(2.3.0) 主要参考链接 出现问题就先看看这个 问题一 打开PicGo后安装github插件会一直安 ...
- Typora + picgo + sm.ms 图床设置笔记
Typora + picgo + sm.ms 图床设置笔记 编辑于2020-03-26 本文部分内容在作者教程的基础上进行了二次编辑,如有重复,纯属必然 在此感谢大佬们的无私付出与分享 之前 用了 g ...
- 配置七牛云图床 + Typora
配置七牛云图床工具 使用图床+Typora可以方便快捷的撰写图文博客 我这里以七牛云进行示例,讲解如何去配置 七牛云是属于收费图床,目前还在测试,不过对于使用量不大的我来说应该免费是足够了的,不过需要 ...
- 七牛云图床存储+Alfread工作流+使用QSHELL
layout: post title: 七牛云图床存储+Alfread工作流+使用QSHELL 来源:http://www.cnblogs.com/cmi-sh-love/p/8901620.html ...
- 使用Typora+PicGo配置Gitee图床
1.图床痛点 通常我们用 Typora 写 Markdown 文档,对于文档里面的图片,如果不使用图床,图片都是存放在本地,如果把文档复制到别的地方,还得额外复制图片,特别麻烦. 为了解决这种问题,一 ...
- Typora+PicGo+Gitee打造图床
前言 自己一直使用的是Typora来写博客,但比较麻烦的是图片粘贴上去后都是存储到了本地,写好了之后放到博客园等地,图片不能直接访问,但如今Typora已经支持图片上传,所以搞了一波图片上传到Gi ...
随机推荐
- SpringCloud-服务间通信方式
接下来在整个微服务架构中,我们比较关心的就是服务间的服务改如何调用,有哪些调用方式? 总结:在springcloud中服务间调用方式主要是使用 http restful方式进行服务间调用 1. 基于R ...
- 第 7篇 Scrum 冲刺博客
一.站立式会议 1.站立式会议照片 2.昨天已完成的工作 对职工的查询 3.今天计划完成的工作 继续与同学对接,争取早日完成项目的整个流程 初步对数据库筛选 4.工作中遇到的困难 ①有同学不知道如何远 ...
- 【学习笔记】浅析后缀自动机(SAM)及基础应用
解决子串相关问题的强大工具 我们知道一个长度为 \(n\) 的字符串中所有的子串数目为 \(O(n^2)\) 个,这很大程度上限制了我们对某些子串相关问题的研究.所以有没有解决方案,使得我们可以在可承 ...
- 四、git学习之——远程仓库
Git是分布式版本控制系统,同一个Git仓库,可以分布到不同的机器上.怎么分布呢?最早,肯定只有一台机器有一个原始版本库,此后,别的机器可以"克隆"这个原始版本库,而且每台机器的版 ...
- js实现元素范围内拖动
元素拖拽,网上一堆的实现,其中很多是原生js写的,都不够简洁,甚至运行后看不到效果. 于是乎,安静地想了下,拖动元素貌似就是一个滑动事件的监听处理,具体操作如下: 1.一个外层DIV,或者直接用根节点 ...
- [Python] 快速爬取当前城市所有租房网站房源及配置,一目了然
Python爬取当前城市房源信息,以徐州为例代码效果图请看下方,其他部分请查看附件,一起学习,谢谢 # -*- coding: utf-8 -*- """ @Time : ...
- mysql难题收录
1.计算相邻两行的年龄的差距 表中的数据如下 select (s.age-(select age from stu where id - s.id = 1)) from stu as s; selec ...
- html 06-HTML5详解
06-HTML5详解 #HTML5的介绍 #Web 技术发展时间线 1991 HTML 1994 HTML2 1996 CSS1 + JavaScript 1997 HTML4 1998 CSS2 2 ...
- Eureka系列(八)服务剔除具体实现
服务下线的大致流程图 下面这张图很简单地描述了服务剔除的大致流程: 服务剔除实现源码分析 首先我们得了解下服务剔除这个定时任务是什么被初始化启动的,在百度搜索中,在我们Eureka Serve ...
- 个人微信公众号搭建Python实现 -接收和发送消息-基本说明与实现(14.2.1)
@ 目录 1.原理 2.接收普通消息 3.接收代码普通消息代码实现 1.原理 2.接收普通消息 其他消息类似参考官方文档 3.接收代码普通消息代码实现 from flask import Flask, ...