碼字工作者的發文姿勢—— 用MWeb+Markdown Here+七牛 輕松實現多平台發布
1.對於寫作你最頭疼什么
對於大多數碼字工作者來說，隨時隨地記錄靈感，構思文章，集中書寫，其實是一件令人感到享受的事兒。當這一切都完成，為了能夠有更廣泛的讀者閱讀，需要在不同平台上發表的時候，問題就來了。
在不同的平台上發表之時，最痛苦的兩件事情莫過於：
1. 每在一個平台發布一次，都要重新檢查調整一遍排版；
2. 文章的所有插圖，需要在每個平台上重新上傳一份。
這？！好想shi有沒有？…尤其是微信公眾號，不知道大家有沒有遇到過，用Chrome瀏覽器，在上傳圖片時經常會遇到沒有響應的時候，面對這種情況，你所付出的時間成本，以及精神成本，不言而喻。
那有沒有一種自動化的方法，當編輯完一篇文章后，不用再一次一次地解決排版問題，以及圖片上傳問題，直接可以一鍵發表到不同的內容平台？今天就給大家介紹一套我自己踐行的方法，讓你從此迎娶高富帥/白富美，實現財富自由，走上人生巔峰。喂，醒一醒…… 總之，是讓工具來解放你的生產力，你就有更多的時間用於學習思考。
2.我目前的發布流程
我目前的發布流程只需三步：
1. 在MWeb中復制Markdown內容；
2. 粘貼到瀏覽器中各大平台編輯器中；
3. 按住 CTRL + ALT + M 一鍵排版，點擊發布。
圖片無需一次次重傳，10秒鍾輕松搞定多平台發布，是不是很心動？別急！我們一步一步來學習。在正式操作之前，我想現針對一些基本概念和原理進行一些科普。
3. 關於Markdown及圖床的一些科普
這里我們會用到Markdown、MWeb、圖床、七牛、Markdown Here，這些都是啥，有什么作用，下面分別來向大家一一介紹。
3.1 為什么使用Markdown？
學過一些HTML、CSS基礎的同學一定清楚，CSS的出現是為了使內容和樣式相分離，如果要改樣式只需改動CSS即可。同樣Markdown出現的根本目的也是使書寫內容與實際展現樣式相分離，書寫者只需更專注於書寫本身，只需通過Markdown標記語言來分清文章層次結構，而無需把過多精力浪費在重復的排版中。
首先Markdown是一門標記語言，不要害怕，你一分鍾就能入門，學習成本極低，而一旦熟悉了這種語法規則，會有一勞永逸的效果。如果你想了解更多請自行搜索。但我強烈建議你直接下載一個Markdown編輯器上手實踐就行。語法學習強迫症患者可閱讀如下鏈接。
創始人 John Gruber 的 Mardown 語法說明
3.2 Markdown的編輯器
市面上的Markdown編輯器成千上萬，單是在少數派上搜索Markdown就能搜出一大堆。過去也使用了幾款市面口碑好的，比如Ulysses、Bear、DayOne…花高價買了Ulysses的Mac版和iOS版，在這個顏值即正義的時代，我不得不承認，這些工具都好正。但讓我一直頭疼的是圖片編輯和發布的問題。即使在編輯器里的樣式萬般嫵媚動人，到最后發布的時候依然面臨需要借助其他工具解決圖片發布的鬧心問題，操作體驗真心不夠自動連貫。（注：之前用圖床工具iPic，單就工具來說不錯，只是整體寫作發布流程還是不夠流暢。）
有一天圖片問題甚至影響到我寫作的時候，我開始想，這個問題肯定有很多人早就遇到過，那肯定有一些解決方案，MWeb的偶遇解決這一難題，雖然其顏值可能比Ulysses和Bear在某些方面要低一些，但其對於碼字工作者實際使用場景、流程、功能的把握已經遠遠超過其他。
3.3 圖床
文章中插圖的問題怎么解決？如果寫一篇文章，不用每次在不同的平台發表時還要重新再上傳一遍圖片，不光是上傳圖片的問題，你還要每次發布時都在原文中修改一遍圖片鏈接呢，最好的解決方式就是把圖片都上傳到一個公有服務器，這樣所有平台發表的文章原文就可以一樣了，圖片鏈接地址就是公有服務器上的圖片外鏈。圖床就是專門存儲這些圖片的空間，說白了就是一個圖片服務器。
圖床的話因為之前並沒有用過太多，知乎了一下發現七牛評價最高，所以就直接注冊了七牛，並且MWeb提供對七牛的支持，至少現在感覺還不錯哦。
3.4 Markdown Here
在早先，我在使用了一段Mardown時間后，雖然Markdown在編輯器中都夠完美展現排版效果，但怎樣真正用到自己的寫作發文過程中，是我一直面臨的問題。直到有一天看到李笑來老師的一篇 Markdown Here教程才明白，哦，原來Markdown是這么玩的。Markdown解決了內容與樣式相分離的問題，那樣式這塊，Markdown Here提供了便捷的解決方案。
Markdown Here設置界面內可以配置你希望文本渲染成的CSS樣式。你可以個性化定制你的CSS。關於自定義Markdown Here CSS樣式的問題，以后我另開專題來介紹。
接下來重點來了，要實現一鍵發布的夢想，只要完成以下前期配置操作就可以啦。
4. 工具配置 Step by Step
4.1 注冊七牛並創建圖床
1. 注冊登錄：七牛雲開發者平台官網 https://portal.qiniu.com/signin ；
2. 添加對象存儲：「登錄首頁」→「對象存儲」→「立即添加」；
3. 創建存儲空間：這一步就是為你創建圖床的過程。
4. 為存儲空間命名：你需要為你的存儲空間取一個名字，可以根據你目前作品/項目名稱來命名，比如我目前的專題項目叫「整理我的人生」,那我就命名為「clearmylife」。
5. 選擇存儲區域：根據你所在的區域或你面向讀者用戶的區域選擇一個，如果你不知道，那就選擇默認的吧。
6. 訪問控制：這個默認為公開空間。填完之后，直接「確定創建」。至此你已經創建了屬於你自己的圖床。
7. 另外你還要記錄3個信息，因為一會在配置MWeb圖床的時候會用到。分別是 Access Key、Secret Key（在頁面「個人面板」→「個人中心」→「秘鑰管理」中有顯示，如下圖）、圖片URL前綴（如下圖）
4.2 配置MWeb
1. 下載安裝MWeb： 點擊MWeb官網 下載MWeb並安裝；
2. 圖床設置：點擊右上角「分享」，在下拉菜單中選擇「把本地圖片傳至圖庫…」，點擊「新增服務」，會彈出「偏好設置—發布服務」
按照下述步驟來添加本地圖片上傳服務（圖床）
1. 名稱：隨心所欲，你自己起個名字就行；
2. API地址：一定要填寫你在七牛上申請存儲空間機房對應的API接口。可點擊「問號」查看詳細內容。如：華東：http://upload.qiniu.com ；華北：http://upload-z1.qiniu.com ；華南：http://upload-z2.qiniu.com 。
3. 空間名稱：七牛開發者主頁→對象存儲→你剛剛添加的空間名稱。
4. Access Key：「個人面板」→「個人中心」→「秘鑰管理」中AK位置，記錄過。
5. Secret Key：「個人面板」→「個人中心」→「秘鑰管理」中SK位置，記錄過。
6. 圖片URL前綴：「對象存儲」→「更多操作」→「內容管理」→「外鏈默認域名」，或直接復制一張你上傳圖片的外鏈，截取前綴即可。
7. 驗證：填完之后，點擊「驗證」，如果完全按照上述步驟，你一次就能通過！至此，恭喜你，你已經成功了99%了。
4.3 配置Markdown Here
1. 在Chrome上安裝Markdown Here插件:
2. 安裝完后在Chrome瀏覽器右上角會出現Markdown Here插件圖標，右鍵點擊圖標，選擇選項，修改「基本渲染CSS樣式」
3. 如果對於CSS並不了解，我建議你，先拿來主義，先嘗試，再研究。比如說，先拿來李笑來老師的版本吧 https://gist.github.com/xiaolai/aa190255b7dde302d10208ae247fc9f2 復制Github上的代碼粘貼至下圖基本渲染CSS中。
注：如何根據自己的審美修改Markdown Here CSS 樣式，后續會單開一篇文章介紹。
5. 一鍵發布
能跟着一步一步操作到這里，不容易，原諒我的啰嗦。
接下來就是見證奇跡的時刻啦！
1. 在MWeb上全身心寫一篇文章（圖片直接貼，是不是感覺很爽？），寫完后，點擊「分享」→「把本地圖片傳至圖庫…」
2. 在「選擇本地圖片自動上傳服務」的對話框中，點擊「上傳圖片」。此時你文中的圖片就全部上傳至你的七牛圖床上了。
3. 圖片上傳完后，你會看到遠程那一行會顯示圖片遠程連接地址。
復制粘貼發布
1. 點擊上圖「復制Markdown」（這個Markdown中本地圖片鏈接已經完全轉化為了遠程圖片鏈接）；
2. 然后打開打開微信公眾號后台素材庫的編輯器，粘貼。（不止是微信公眾號哦，知乎，新浪微博發表頭條，簡書這些個通吃）；
3.Ctrl+Alt+M 一鍵渲染CSS樣式；
一下是渲染前后的樣式對比：
6. 為什么微信公眾號圖片沒顯示
這時候你應該迫不及待地准備預覽發布了。當你按照上述步驟操作后，文章保存預覽都可以清晰看到圖片，但發到手機上卻看不到，別急，由於微信后台還要將你的這些圖片重新上傳到微信的服務器，先壓縮，再打水印，需要一些時間。