如何優雅的在Markdown中使用圖片


怎么插入圖片

Markdown 中提供了三種插入圖片的方式,各種插圖的方式都在這三種之類。
插圖最基礎的格式就是:

![Alt text](圖片鏈接 "optional title")

插入本地圖片

插入本地圖片就是在基礎格式里面的圖片鏈接填寫圖片的路徑即可,相對路徑或者絕對路徑都可以。

  • 優勢:可以方便的將圖片插入,無需進行其他操作。
  • 不足:分享起來非常麻煩,可能需要帶一個文件夾;本地路徑的修改或丟失都會造成圖片無法顯示。

將圖片存入 Markdown 文件中

用 base64 工具將圖片轉成一段字符串,然后把字符串填到基礎格式的圖片鏈接位置。

  • 優勢:分享時只需要分享 md 文件,方便
  • 不足:插入圖片前還需要將圖片進行編碼,編寫時比較麻煩

插入網絡圖片

在基礎格式里面的圖片鏈接里填寫網絡圖片的鏈接即可。

  • 優勢:分享方便,md 文件較小
  • 不足:需要依賴網絡;

怎么優雅的插圖

這里介紹 圖床 + 插入網絡圖片 的方式來提升插圖體驗。

首先是圖床工具

這里推薦 PicGo,支持多種圖床,開源跨平台,支持插件機制。這里簡單介紹下它的使用。

配置圖床

PicGo 原生支持很多圖床,包括 Github、七牛雲、騰訊雲等。同時還支持插件,這樣就幾乎可以搞定所有的圖床了。
這里比較推薦使用 碼雲 ,相比 Github 來說,它速度更快;相比其他雲服務來說,配置比較簡單,而且還免費。
因為原生是沒有支持 Gitee 的,所以我們首先需要安裝插件(安裝前請查看文檔》》),在 PicGo 的插件設置中搜索 “gitee” 即可進行安裝。
image-20200226105750433
安裝完成后,就可以在 “圖床設置” 里面看到 Gitee 圖床,點擊即可進入圖床設置界面。如下:
image-20200226105928312
其中:

  • url:指 Gitee 的地址。默認情況下都是https://gitee.com
  • owner:指 Gitee 的用戶名
  • repo:指在 Gitee 上創建的 Git 倉庫名
  • path:指倉庫中的路徑。比如 Imgs/ 等自定義名稱
  • token: 私人令牌。需要在 gitee access token 上創建。注意,此 token 只會出現一次,關閉后將不可見。
  • message:指每次上傳提交的 message。可以自定義。(好像不一定有效,應該是個 bug

配置完成后就可以上傳啦~ 其他配置可以參考 配置手冊

Markdown 編輯器

比較推薦 Typora ,樣式顏值比較高,功能比較齊全,還打通了 PicGo ,直接將圖片黏貼到編輯區,便可實現自己通過 PicGo 上傳到圖床。(需要在設置里面打開上傳服務器的功能。如下圖
image-20200226111628098

怎么跨設備同步

在 2020 年的今天,沒有雲同步怎么能說優雅呢?
這里推薦的是 OneDrive ,Windows 自帶,跨平台,空間便宜,按需同步等。
只需要把 Typora 的默認文件夾設置成 Onedrive 中的文件夾,既可實現在 A 機器上編輯完成后(順帶打開Typora 的自動保存),直接換到另外一台機器繼續編輯啦~~

怎么把 Markdown 文件方便的插入到各大網站

推薦使用 markdown here 可以非常方便的將 Markdown 一鍵轉成 Html 文檔。

總結

工欲善其事,必先利其器。將 PicGo + Gitee + Typora + Onedrive + Markdown here 幾乎可以解決所有的文檔分享和編輯需求。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM