プラグインを使わずにMarkdownでWordPressのブログを更新する(実践編)

LINEで送る
Pocket

今回は、半年ほど前に書いた記事、

プラグインを使わずにMarkdownでWordpressのブログを更新する(基礎編) | WEB EGG

の実践編です。
予告の通り、

  • Markdownが書きやすいエディタ
  • WordPressのプラグインを利用せずにMarkdownでブログ記事を書く

をメインに説明します。




目次

  • Markdownが書きやすいエディタ
  • WordPressのプラグインを利用せずにMarkdownでブログ記事を書く
  • Markdownだと何がいいの?
  • なんでWordpressプラグインを避けるの?

Markdownが書きやすいエディタ

Markdownとは、Markdownの書き方については、基礎編を御覧ください。
ざっくり書くと、HTMLより見やすく書きやすいマークアップ記法です。

僕がMarkdownを書くときに使っているアプリは主に2つです。

Mou

MouApp

2つとか行っておきながらも、
MacでMarkdown書くならこれ一択だと思います。

この子のすごいところは、

  • 動作が軽い
  • Markdown記法の完璧なシンタックスハイライト
  • リアリタイムプレビュー
  • Markdownで書いたものをHTMLとしてコピーできる
  • PDF書き出し
  • プレビューのCSSとカラースキームが豊富
  • CSSもカラースキームも自作可能

です。

例えば今書いている文章をMouで見るとこんな感じです。

プラグインを使わずにmarkdownでwordpressのブログを更新する 実践編 md

他のエディタでもある程度はハイライトしてくれるのですが、
Mouのシンタックスハイライトは完璧です(主観)。
ハイライトがあると、それだけで構文ミスやタイポに気づけるので助かります。

シンタックスハイライトがあると、構文解析に処理を割かれて
動作が重くなってしまうこともありません。動作がすごく軽量です。

そして、何よりありがたいのが、リアルタイムプレビューです。
Markdownで書いている内容を、リアルタイムにHTML形式で見ることができます。

Markdownに慣れていないうちは、
どういうHTMLになるか、見ながら書きたい」ってことも有ると思います。

エディタとプレビューの2カラムで作業をするので、
エディタ部分の横幅が狭いと感じるときは⌘+Shift+iを押せば、
プレビュー画面のON/OFFが出来ます

書いているときはプレビューをOFFにして、
ひと通り書き終わったらONにしてどういう見た目になっているかチェック。
という具合に使い分けると、いい感じになると思います。

しかも、デフォルトでGithubのテーマが入っているので、
(ブログとは関係ないけど)GithubのREADMEを書く時にも重宝します。

また、プレビューのテーマは自分で追加できるので、
自分のブログのCSSを持ってきてApplication Support/Mou/CSSに追加すれば、
自分のブログでどういう表示になるかも手軽に分かってしまいます。

ギークな方々は、やたらと自分好みにカスタマイズしたがると思います。
そんな方々は、いくらでもテーマをカスタマイズできる喜びを噛み締められます。

僕は自分のブログでの表示部分は、MarsEditに任せているので、
プレビューのテーマは特にいじっていません。

他にも、プレビュー画面の方をPDF形式で書き出せるので、
ドキュメントを作成するときに楽だったりします。

Sublime Text2

Sublime

言わずもがな知れたSublime Text2(ST2)です。
こちらは削除や置換など、文章の編集にめっぽう強いので、

大規模な修正を入れるときには一度ST2の方に全文持って来て、
ガツっと修正してまたMouに戻す、なんてことをしたりします。

ST2でも、パッケージをインストールすれば、
それなりにMarkdownを書く、プレビューすることは可能なのですが、
Markdownの書き心地についてはMouの圧勝なので、基本Mouで書いています。

WordPressのプラグインを利用せずにMarkdownでブログ記事を書く

そして、本題です。

MouでMarkdownで書いたものを、
HTMLとしてコピー(⌘+Alt+c)して、MarsEditに貼り付けます。

スクリーンショット 2013 07 14 18 19 11

貼り付けると、ブログでのプレビューが表示されます。

あとはタグやその他情報を調整して、送信すればOKです。

MarsEditでMarkdown記法を使うことも可能なのですが、
エディタとしての機能はかなり貧弱なので、わざわざMarsEditで書く利点はありません。

また、Markdownのまま送信するにはWordpress側にプラグインが必要です。
なのでMouで書いて、HTMLとしてMarsEditに貼り付けて送信しています。

Markdownだと何がいいの?

何より記事の作成・編集・修正が超絶楽です。

タグをいちいち書く必要がないので、
プレーンな文章を書いているような間隔でマークアップされた記事を書いていけます。

また、HTMLの記事を修正しようとすると、
ブログの本文として必要のない文字(タグ)が多数含まれてしまいます。

ですが、Markdownではたかだか2~3文字のマークアップしか無いです。

そのため文章中のbrを追加、削除したりタグの名前を変えたり、
というHTMLあるあるの煩わしさがありません

その分、classをつけたりid付けたりインラインCSSを書いたりという自由度は失うのですが、
CSSを考えて書いていれば、それらを使わなければ表現不可能なことって稀だと思います。

必要であれば、
HTMLを貼り付けたMarsEdit側で少し修正を入れれば済む話ですしね。笑

なんでWordpressプラグインを避けるの?

WordPressのプラグインだと、なんかあった時に困ると考えているからです。

例えば、
そのプラグインのバグや不具合によって、公開中の記事に影響が出る
という可能性があります。

しかし、手元ではMarkdownで書いて、公開はHTMLという形にしておくと、
HTMLで記事を更新していれば、ほとんどの場合バグや不具合は起きませんし、
プラグインのメンテナンスやアップデートという手間も減ります。

プラグインが悪いとは思っていませんが、
減らせるリスクは減らしておくべきだと思います。

まとめ

という感じで、いつもMarkdownを使ってブログ記事を書いています。

まだMarkdownを触ったことがなくて、ブログを書いている方が居たら、
是非基礎編と当記事を読んで、Markdownを使って記事を更新してみて下さい!

最期まで読んで下さいまして、ありがとうございました。

プラグインを使わずにMarkdownでWordpressのブログを更新する(基礎編) | WEB EGG




LINEで送る
Pocket