MacBook Pro 13インチでWordPressブログを書くエディタを試行錯誤していたんですけど、MacアプリのMarsEditを使うことになりそうです。
ノートパソコンの13インチってとくに画面の縦が狭いのでブログエディタ選びが難しくなります。
Web画面のエディタにはビジュアルエディタとテキストエディタの2種類がありますが、
- ビジュアルエディタだと写真がそのまま表示されて全体を把握しにくい
- テキストエディタだとそもそも使いにくい
という問題があって13インチのノートパソコンではちょっと使いにくいのが本音でした。
そこでMarsEditならHTML書きながらリアルタイムプレビューされるし全体的に使いやすくてビジュアルエディタとテキストエディタの良いとこ取りのようなアプリとなっています。
※2017年12月にアップデートされ、MarsEdit 4になりました。14日間の試用期間付き。6,000円。
もくじ
WordPressのブログエディタ
MacBook Pro（13インチ）でブログを書く方法としては以下を試しました。
- WordPress標準のビジュアルエディタ
- WordPress標準のテキストエディタ
- MarsEdit
いろいろなんて言う割には誰でも使える標準のエディタとMarsEditしか試していません（笑）
他にもブログエディタはあるみたいですけど、ちょっと調べた限りMacでブログエディタを使うとしたらMarsEditが定番らしいので、情報を探すのも楽だと思います。
以下、実際にそれぞれのエディタのメリットやデメリットを簡単にメモしていきます。
WordPressのビジュアルエディタ
もともとWordPressの管理画面に実装されているエディタのビジュアルエディタです。誰でも使える標準の執筆モードですね。
Wordみたいに文字の色を変えたらそのまま見た目に反映されたり画像を挿入したら画像がそのまま見えたりしていわゆるリッチテキストエディタと言われるものです。
ただしちゃんと範囲選択しているのにHTMLタグが思ったとおりに適用されなかったりして好きじゃない人も多いようです。
個人的にはビジュアルエディタでもCSSを適用して自分のブログとまったく一緒の見た目にすればかなり使いやすいですけどね。
※追記：「OnePress Image Elevator」というプラグインを使えば貼り付けのショートカットキーCtrl+Vで画像の挿入が簡単にできるようになりました。
参考：「OnePress Image Elevator」の使い方と設定まとめ
これ以上簡単にしようがないほど効率化されたので、画像の挿入に関してはMarsEditよりも上記のほうが使いやすくなりました。
画面が広いデスクトップの場合は、Macでブログを書くとしてもビジュアルエディタのほうが便利かもしれません。
WordPressのテキストエディタ
標準のテキストエディタ（HTML編集モード）だとメリットはほぼありません。
タグは色分けされずに見難いし、プレビューボタンを押していちいちページを読み込まないと実際の見た目を確認できないし、
MacでもWindowsでもWordPress純正のテキストエディタはおすすめしません。テキストエディタ風にブログを書きたいなら、MarsEditなどのブログエディタの導入を考えたほうが良いでしょう。
MarsEditの特徴
さて、MarsEditの特徴を簡単に書いてみると、
リアルタイムプレビュー
自分のCSSを適用すればまったく同じ見た目にしてリアルタイムにプレビューを表示することができます。
画面左側でHTMLエディタを書いて右側にプレビュー画面を表示しておけば編集しやすいです。
標準のビジュアルエディタにCSSを適用すればリアルタイムプレビューできるようなものですが、HTMLとプレビューを同時に見たい人ならMarsEditのほうが良いということになりますね。
プレビューは実際のCSSが反映される
MarsEditのプレビュー設定にはCSSの欄があって自分のブログと同じデザインにすることができます。
設定はCSSのコピペが必要だったりするのでやや難しいですが、プレビューするならあったほうが良い設定です。
欲を言えばMarsEditのリッチテキストモードでCSSデザインを完全に反映させて直接編集ができたら最高ですけど、それはできないみたいです。
画像の挿入が簡単
MarsEditでは画像をドラッグ＆ドロップで挿入することができます。
- 画像ファイルをドラッグ、Skitchからドラッグ、iPhotoからドラッグなど、ドラッグに融通が効く
- MarsEditにドラッグする時に好きな場所に挿入できる。
- 挿入と同時にclass名・alt・サイズなどの指定ができるので二度手間にならない
- 大きな画像をドラッグしても自分が指定したサイズに自動でリサイズされてファイルサイズも小さくなるので画像の処理をあまり心配する必要がない
というふうにあまり難しいことを考えずにドラッグしまくれます。
ただしショートカットキーを使った貼り付けはできないのでその点ではWordPressビジュアルエディタでOnePress Image Elevatorのほうが使いやすいです。
画像の挿入に関しては、昔ほどMarsEditにアドバンテージはありません。
マークダウン記法が使える
MarsEditではマークダウン記法というHTMLタグに変換される専用のタグを使った記法が使えます。
例えばh2見出しを書く場合、普通のタグとマークダウンを比較してみると、
- 通常・・・ <h2>○○○</h2>
- マークダウン・・・ ##○○○
普通は開始タグと閉じタグが必要なのにマークダウン記法では閉じタグが必要ないのでそのまま書き進めることができます。
マークダウン記法はMarsEditだけじゃなく、記法をサポートしているエディタだったら使えるので覚えておいて損はありません。
ショートカットキーでタグ入力
MarsEditでは自分の好きなHTMLタグをショートカットキーに割り当てることができるのでやろうと思えば何でもできます。
自分はとりあえずh2タグのマークダウン「##」をcontrol+2に割り当てたりしてシャープの連続入力さえワンアクションで入力できるようにしました。
- control+2・・・「##」（h2見出し）
- control+3・・・「###」（h3見出し）
- control+4・・・「####」（h4見出し）
- control+R・・・「- 」（リスト）
これらを設定するだけでもかなり書きやすくなります。
その他 <span class="sankou">参考</span> のようなspanとclassで囲む自分で作った長いタグで囲むようなものもショートカットキーを設定できるので自分専用のタグをショートカットキーで呼び出すことができます。
ただし、これもビジュアルエディタだとh2見出しはCtrl+Alt+2で標準でできるし、長いタグで囲むのもAddQuicktagというプラグインを使えばできます。
長いタグもショートカットキーで挿入できるというのはメリットの一つですが、設定が一つ一つ必要になるので、使い始めるのが意外と面倒だったりしますね。
HTMLタグの自動色分け
開始タグ、class、URLなどがそれぞれ役割ごとに色分けされていてHTMLタグを直接いじりたい時に編集がしやすくなっています。
幅（width）を後で変えたい時とかすぐに見つけることができて便利。
HTML編集モードで書く人にとっては色分けが非常に重宝します。
プラグインによる機能拡張
例えばアプリの紹介リンクを作成するWebサービスにAppHtmlWebというサービスがありますがWebブラウザからアクセスする必要があるので操作がやや煩雑になります。
またMacのローカル上で動くAppStoreHelperというアプリもありWebブラウザよりマシですがMarsEditから画面を切り替えないといけないのでまだ完璧ではありません。
これをMarsEdit専用プラグインAppHtmlMEを組み込むことによってMarsEdit内でアプリの検索から貼り付けまでを完結することができるようになります。
- プラグインを起動するショートカットキーを押す
- iPhone・iPad・Macなどの検索対象を選択
- アプリ名検索
- 表示するレイアウトを選択
- HTMLタグが挿入される
という手順で完結できます。素晴らしい。（ただし設定がけっこうややこしい）
上記はアプリのリンクを作成する例でAppHtmlMEについて書きましたがその他にもMarsEditに組み込むことができるプラグインはいろいろあります。
オフラインで編集可能
今となってはWebのビジュアルエディタもだんだん高機能になってきたのでその差が縮まっていますが、MarsEditだとオフラインでもブログが書けます。
テキストの執筆から画像の挿入までMarsEdit内で完結させておいて、ネットに繋がった時にアップロードができるので、作業を切り分けできるメリットはあります。
ただ、今どきオフラインでもブログを書くような人は少ないんじゃないかと思うので、そこまでのメリットとは思えません。
Wi-Fiや色んな所で使えるし、スマホだとテザリングができるので、完全にオフラインで集中して執筆するような状況は少ないんじゃないでしょうか。
WordPressのエディタの使い勝手が上がってきた
この記事を執筆してから時間も経ち、今ではWordPress標準のエディタもかなり便利になってきました。
上記までに紹介してきた中で、画像の挿入、マークダウン、基本的なHTMLタグのショートカットキー挿入など、ビジュアルエディタが確実に進化してきています。
画像の挿入はOnePress Image Elevatorというプラグインが登場して完全にビジュアルエディタのほうが便利になったし、マークダウンはWordPress 4.3から標準対応したし、実際の見た目をそのまま再現することも可能で、テーマによっては標準機能として搭載しているものも出てきました。
徐々にブログエディタが必要になることも少なくなるんじゃないかなぁって思ってます。
まとめ
以上、WordPressのビジュアルエディタとMarsEditを比較していきました。
昔ほどMarsEditにアドバンテージがありませんが、上記で上げてきた特徴と相性が良いなら検討の余地ありです。
