本文主要分享使用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+七牛云图床实现自动上传图片的更多相关文章

  1. 七牛云图床和Markdown使用

    七牛云图床和Markdown使用 1.图床是什么? 图床一般是指储存图片的服务器,有国内和国外之分.国外的图床由于有空间距离等因素决定访问速度很慢影响图片显示速度.国内也分为单线空间.多线空间和cdn ...

  2. 七牛云图床存储+Alfread工作流+使用QSHELL

    layout: post title: 七牛云图床存储+Alfread工作流+使用QSHELL 来源:http://www.cnblogs.com/cmi-sh-love/p/8901620.html ...

  3. 七牛云图床及MPIC工具使用

    考虑到图片更容易被人接受,但是大量图片又会延迟博客加载速度.因此,个人感觉可以把静态文件资源托管在云端,这样加载的话就不至于太慢. 注册七牛云 实名验证通过 创建文件存储 内容管理-上传图片 下载Mp ...

  4. Typora-yes:typora最舒适的使用-优化主题+图床服务+自动上传图片插件

    转载注明出处:https://www.cnblogs.com/nreg/p/11992678.html,谢谢 开源项目下载:https://github.com/nreg/typora-yes 云盘: ...

  5. 七牛云+MPic-图床神器搭建

    1. 注册七牛云 2. 新建存储空间 3. 密钥 4. 记录自己账户四个值: 测试域名:xxxxx.xx.clouddn.com ak:xxxxxxxxxxxxxxxxxxxx sk:xxxxxxxx ...

  6. GitHub+PicGo构建免费图床及其高效使用

    搭建免费图床全过程! 一.搭建缘由 一开始搭建博客,避免不了要用许多图片,最初使用七牛云来做博客图床,但是后来发现,七牛云只有30天的临时域名,hhhhhhh,果然啊,天下就没有免费的好事啊~后来就发 ...

  7. 使用jsdelivr + GitHub + PicGo搭建免费图床

    前言 之前一直有开通有道云笔记会员,主要是为了会员markdown图片可以在线保存的功能,前一阵子会员到期,考虑这个功能可不可以自己单独实现,从而替代使用有道云会员. 通过网上搜索的方式,查询到了几种 ...

  8. 有道云笔记配合MPic+七牛云 自制MarkDown文档图床(适用Typora)

    注:从有道云笔记v6.5开始,有道云笔记会员可以使用MarkDown有道自带的图床.(但是非会员可以采用下面的七牛云图床+MarkDown方法) 0x00 前言 一直用有道云笔记,粘贴图片,做笔记没问 ...

  9. 技术人的福音!教你如何使用Typora+PicGo实现图片自动上传功能

    前言 写技术文章的小伙伴,对于 Typora 肯定不陌生,用来编写 Markdown 特别的方便. 但是,有个问题,就是当我们插入一个图片,并且使之可以在公网访问时,操作流程特别的麻烦. 首先,你需要 ...

  10. markdown + 七牛云,让写文更容易

    常常写博文的人, 总有这样的烦恼: * 文章格式问题,各种文本编辑器格式不统一,在一处写好的文章复制到其他编辑器中格式错乱 * 图片问题,在不同的平台的图片需要重复上传,如果多平台发布很繁琐 由于这样 ...

随机推荐

  1. C# 根据类名称创建类示例

    //获得类所在的程序集名称(此处我选择当前程序集) string bllName = System.IO.Path.GetFileNameWithoutExtension(System.Reflect ...

  2. 设置mysql 数据集为utf-8

    To set the default to UTF-8, you want to add the following to my.cnf [client] default-character-set= ...

  3. JDK的下载与安装

    一.下载 在Oracle公司的官方网站(www.oracle.com)下载. 二.安装 1.双击运行JDK程序,弹出JDK安装导向窗口,点击“下一步” 2.点击“更改",将安装地址修改为 C ...

  4. Social networks and health: Communicable but not infectious

    Harvard Men’s Health Watch Poet and pastor John Donne famously proclaimed “No man is an island.” It ...

  5. jquery不熟悉的方法

    1.jquery有一个筛选api find. 语法很简单,比如: HTML 代码: <p><span>Hello</span>, how are you?</ ...

  6. Yii 1.0 基础

    骨架搭建 1.下载2.windows 创建PHP环境变量,找到php.exe的目录D:\wamp\bin\php\php5.3.5,右键我的电脑,属性\高级设置,path最后添加 ;D:\wamp\b ...

  7. 童话故事 --- 通信协议之 HDLC 浅析

    高飞狗: "高飞的白鹭浮水的鹅,唐诗里有画-" 布鲁托: "高飞狗,又在做你的高飞梦哪!" 高飞狗: "哈罗,布鲁托,这几天好郁闷呐!" 布 ...

  8. 通知实战 设置通知图片(iOS10以后的)

    解释两个基本扩展(Notification Content.Notification Service) Notification Content其实是用来自定义长按通知显示通知的自定义界面 Notif ...

  9. oracle查看锁表进程,杀掉锁表进程[转载]

    select sess.sid,     sess.serial#,     lo.oracle_username,     lo.os_user_name,     ao.object_name,  ...

  10. 求有向图的强连通分量个数 之 Kosaraju算法

    代码: #include<cstdio> #include<cstring> #include<iostream> using namespace std; ][] ...