Open Jiang

StackEdit 自定 CSS 匯出 HTML Template StackEdit 是一個所見即所得的線上 Markdown 編輯器，在先前的文章已有許多的介紹。身為程式設計在寫筆記的時候更是需要像這樣的工具，讓我們更能聚焦在內容上並且能運用 highlight.js 來標註程式碼。 檔案分享的方法 Google 雲端硬碟、Dropbox 我們更可以將筆記透過 StackEdit 直接發佈至 Google Blogger 上，或是儲存在自己的 Google 雲端硬碟、Dropbox 等等的位置。 Gist、StackEdit Viewer 如果需要將資料分享給其他沒有安裝 Markdown Viewer 的人，除了使用上述的方法，我們也可以將檔案發佈至 Gist ，或是將我們的 Markdown 檔案放至網路，透過 StackEdit 的 Viewer 將網址引入直接使用瀏覽器觀看。Ex： Here 。 https://stackedit.io/viewer#!url= [ 放置 Markdown 檔案的 URL 位址 ] PDF StackEdit 的 PDF 功能是需要透過雲端的轉換（透過 Pondoc + LaTex 實踐），對於這個部分的功能是贊助者項目，如果覺得 StackEdit 好用，很建議大家贊助讓他們可以更長久的經營。另外一個方式，是利用 StackEdit Viewer + Chrome Browser 來實踐。 開啓 Chrome Browser 開啓 StackEdit Viewer：Menu –> StackEdit Viewer 在 Viewer 模式下開啓列印 選擇 「Save as PDF」 HTML 另外一種跨平臺支援的方式是使用 HTML，只要是有瀏覽器都可以觀看，而且透過 CSS 可以改變成我們自己想要變化的風格。也是今天主要想和大家分享的方法。 使用自定的 CSS 匯出 HTML 檔案 StackEdit 匯出 HTML 的方式所匯出的檔案是很陽春白白靜靜的檔案，無論字型還是區塊安排都會有一點點的悲劇。還好，它還提供了一個以自定 Template 來匯出 HTML 的方式，讓我們有機會透過自定的 CSS 檔來...

StackEdit 發佈至 Blog 的段落問題 前一陣子動工修改 Bolgger 的模板，設計修改版面的時候是停留在面後一直沒有特別的去注意段落間距，這幾天回來看最近的文章，突然發現段落們的感情未免也太好了一點，居然都黏在一起…（如下圖）。 原本的文章確實是有段落，清清楚楚的分隔開來的！ 段落跑版的原因 滑鼠右鍵開啓網頁的原始碼觀察，發現原本該是 <p>...</p> 的部分已經被改成 <br /> ，不是段落而是換行了。 國外有篇發問提到這個問題 How can I make blogger insert p tags instead of when using rich text editor? ，在舊有的編輯器上會使用 <div> 和 <br> 來取代 <p> ，所以原先在 StackEdit 裡匯出有 <p> 段落的文章也會在經過 Blogger 時被取代成換行符號。 解決方法 請在 Blogger 後臺隨意的開啓一片文章，在右手邊文章設定 -> 選項 -> 換行符號，點選成「按下 Enter 鍵可建立換行符號」項目，此步驟只需要設定一次，設定會自行記住套用至其他的文章。 完成設定後，請重新再由 StackEdit 發佈一次讓 Blogger 能夠更新內容，更新的方法是由後臺找到該文章的 Post ID，在 StackEdit 發佈的地方加填上要更新文章的 Post ID，幫助辨識是哪一篇文章。重新更新發佈後就可以發現段落已經恢復原樣了！