HackMD 取代 Hackpad 的中文版 Markdown 共筆平台上手教學


當你需要跟其他人一起快速共同編輯自己的筆記、文件時,有很多雲端服務可以滿足你的需求,例如我在電腦玩物推薦過幾次的「 Quip 」,或是使用簡易版的「 Google Keep 」,當然也可以用「 Google Docs 」。

但是如果想要找一款特別適合工程師、程序員需求的共筆服務,方便「貼上與顯示程式碼」,筆記過程可以「全程使用 Markdown 」,那麼之前很受歡迎的服務就是「 Hackpad 」。不過 Hackpad 被 Dropbox 收購後,目前雖然還是可以使用,但看起來主力團隊應該是投入了最新的「 Dropbox Paper 」的開發,而 Dropbox Paper 反而有點失去 Hackpad 簡潔快速的特色。

這時候,或許可以試試看由台灣團隊開發,在 2015 年初推出至今,仍然持續維護改版的「 HackMD 」,它的特色就是完整支援 Markdown 與各種程式碼、圖表語法,不一定需要登入就能快速開始共筆編輯,運作速度流暢,而且有完整中文版介面與解說。

「 HackMD 」甚至在不斷的改進中,還支援了一些很棒的功能,像是可以切換到簡報模式,支援上傳圖檔,可以調整分享權限,而且目前還是完全免費。




如果你對「 HackMD 」感興趣,可以先看看打開下面網頁,看看我用「 HackMD 」製作的本文大綱草稿。為了避免被隨意修改,所以我關閉了共同編輯功能,但你還是可以從下面文件查看語法與效果、測試簡報模式等。


打開上方連結後,你可以嘗試在左上方切換[檢視]、[雙欄]、[編輯]等模式,其中[雙欄]模式可以同時查看原始語法,以及顯示的效果。

你也可以利用右上方的[選單]打開[簡報模式],看看「 HackMD 」的筆記自動轉成簡報的效果。





1. 跨平台、跨裝置協同合作編輯


你可以在任何裝置用瀏覽器打開「 HackMD 」網頁,就可以在不同系統、不同螢幕上進行筆記了,在電腦、平板甚至是手機都適用。

你不一定需要登入,可以直接在「 HackMD 」新增筆記進行編輯,而編輯完成後會留下記錄在瀏覽器,你也可以記下網址,都能在以後回頭修改。

當然你也可以用自己的 Google、 Dropbox 等不同帳戶登入「 HackMD 」,登入後,可以獲得完整設定權限等功能。





2. 快速編輯,上手 Markdown 語法


「 HackMD 」在編輯時完全看不到傳統的編輯工具列,所有的編輯效果都用 Markdown 語法來完成。如果你不熟悉 Markdown 語法,可以試試看打開左上方的[?]按鈕,或是查看其「教學文件」,都可以學會完整的編輯語法。

我這邊也舉出幾個最常用的,應該要熟練起來的 Markdown 語法:
  • # 建立大標中標小標
  • - 建立無排序清單
  • 1. 建立有排序清單
  • - [ ] 建立待辦事項
  • **粗體**  建立粗體字
  • *斜體*  建立斜體字
  • ~~刪除線~~  建立刪除線
  • *** 建立分隔線
  • ==螢光筆== 建立螢光筆效果
  • [電腦玩物](http://www.playpcesor.com/) 建立超連結
利用 Markdown 語法,就能在「 HackMD 」中建立待辦清單、排序清單,做出基本標題編輯。

還有更多適合程式員的進階語法,可以做出流程圖、表格等編輯,大家可以從教學文件去研究。





3. 適合貼上程式碼


「 HackMD 」對於貼上各種程式碼也有很好的支援,只要使用:

```程式碼名稱=

```

這樣的語法形式,就能在之間貼上程式碼,並且用適合的程式碼顏色顯示出來。就像下圖這樣。





4. 自動完成編輯


針對一些特殊語法,「 HackMD 」提供了自動完成與提示的功能,包含下列這些:
  • 表情符號:輸入 : 顯示提示
  • 標頭:輸入 # 顯示提示
  • 參考:輸入 [] 顯示提示
  • 外部:輸入 {} 顯示提示
  • 圖片:輸入 ! 顯示提示
這樣一來就可以輸入關鍵字,來選擇需要的符號或標題了。





5. 插入引用文字


另外一個我覺得很值得學起來的編輯格式,就是:「引用」。

輸入以下的語法,前面以 > 開頭:

> 可以引用一段特殊的文字
> [name=Esor] [time=Fri, Oct 14, 2016 9:59 AM] [color=#907bf7]

就能顯示出引用的特殊格式。





6. 簡單上傳圖片


如果你需要在「 HackMD 」插入圖片時,可以直接拖曳圖片到網頁中,「 HackMD 」會自動上傳到「 imgur 」,並且自動產生語法,所以也不需要特別記住圖片的插入語法,而且這都是免費的。





7. 呈現大綱目錄

另外一個我很喜歡的設計是大綱模式,在「 HackMD 」的「檢視」模式中,右上方會顯示這份文件的標題大綱,方便快速跳轉。





8. 分享筆記與設定權限


要在「 HackMD 」分享筆記也很簡單,有兩個最直接的選擇:

  • 直接分享瀏覽器網址列的網址:這時候對方可以瀏覽這份文件,也能編輯這份文件。
  • 透過右上方的[發表]獲得分享網址:這時候對方只能瀏覽這份文件,不能編輯。



如果你還想設定更進階的權限呢?這時候你需要先登入「 HackMD 」的帳號,然後你可以在「檢視」模式的右上方,針對自己的文件修改不同權限,包含:

  • 知道網址的任何人都可以編輯
  • 只有也登入「 HackMD 」帳號者可以編輯
  • 只有擁有者可以編輯
  • 只有擁有者可以瀏覽與編輯
  • 刪除筆記





9. 如何儲存筆記?


基本上「 HackMD 」新增的文件都有專屬網址,都會即時儲存在雲端,但是你也可以透過右上方的[選單],將自己的筆記以 Markdown 格式儲存至 Dropbox 、 Google Drive 或是下載 .md 到您的電腦中。





10. 查看修訂版本


「 HackMD 」右上方的選單裡,也提供了[修訂版本]的功能,讓你隨時還原到某個重大的編輯時間點。





11. 將筆記轉換成簡報模式


最後,「 HackMD 」還支援簡報模式,最簡單的方式就是用下面的語法,分隔每一頁簡報段落:

---

這樣一來,線上筆記就可以按下[簡報模式],切換成可以換頁的簡報囉!

你可以用我的「電腦玩物的 HackMD 測試筆記」 來試試看上述部分功能,或是自己開一個「 HackMD 」文件來練習。

延伸閱讀相關文章:

轉貼本文時禁止修改,禁止商業使用,並且必須註明來自電腦玩物原創作者 esor huang(異塵行者),及附上原文連結:HackMD 取代 Hackpad 的中文版 Markdown 共筆平台上手教學


留言

  1. 這真的滿好用的
    就等推出部落格功能了 XD(咦)

    回覆刪除
    回覆
    1. 部落格功能的話 可以考慮logdown
      https://logdown.com
      同樣是支援markdown編輯

      刪除
  2. 用這一塊補上 evernote 的編輯功能應該不錯
    hackmd -> webcliper

    回覆刪除
  3. 要順便補充一下 分頁 / 簡報 的功能嗎?反正你都做了簡報了不是??
    // 感謝大大的分享,這個真的好用。

    回覆刪除
    回覆
    1. 我只用了最基本的,其他太複雜我暫時也尚未研究

      刪除
  4. 請問在共筆的環境下,可以設定無法變更彼此的內容嗎?

    回覆刪除
  5. 看這篇文章知道有HackMD, 這個真是太好用了!!!

    回覆刪除

張貼留言

相關文章:

這個網誌中的熱門文章

OpenShot 免費中文版影片剪輯軟體,何必用精簡版的威力導演

Google Maps 我的地圖完全教學!規劃自助旅行攻略

Messenger Lite 臉書即時通輕量版台灣下載開放,比較看看我該用哪一款?

To the Moon 繁中版登陸手機,經典說故事型 RPG 無劇透評析

Smallpdf 線上 PDF 轉檔 Word 與編輯免費全能工具,支援中文

五款免費中文 OCR 文字辨識軟體下載,建立強大無紙化辦公室

我所養成的 10 個最有生產力習慣,以及我如何養成這些習慣

Notion 把文件、任務、知識庫「無縫重組」的全新專案整理工具

Beholder 當個好人很難,傳承《1984》反烏托邦模擬遊戲心得

YouTube 簡約黑色劇院介面正式推出,立即啟動不需改程式碼