MacのMarsEditとWordPressビジュアルエディタの比較

MarsEditIcon

最近MacBook Proの13インチでWordPressブログを書くエディタを試行錯誤していたんですけどどうやらMacアプリのMarsEditを使うことになりそうです。

ノートパソコンの13インチってとくに画面の縦が狭いのでブログエディタ選びが難しくなります。

Web画面のエディタにはビジュアルエディタとテキストエディタの2種類がありますが、

  • ビジュアルエディタだと写真がそのまま表示されて全体を把握しにくい
  • テキストエディタだとそもそも使いにくい

という問題があって13インチのノートパソコンではちょっと使いにくいのが本音でした。

そこでMarsEditならHTML書きながらリアルタイムプレビューされるし全体的に使いやすくてビジュアルエディタとテキストエディタの良いとこ取りのようなアプリとなっています。

※2017年12月にアップデートされ、MarsEdit 4になりました。14日間の試用期間付き。6,000円。

カテゴリ: 仕事効率化, ソーシャルネットワーキング
価格: 無料 (掲載時)
スポンサーリンク

WordPressのブログエディタ

MacBook Pro(13インチ)でブログを書く候補としては以下の方法を試しました。

  • Web画面のビジュアルエディタ
  • Web画面のテキストエディタ
  • MarsEdit

いろいろなんて言う割には誰でも使えるWeb画面のエディタとMarsEditしか試していません(笑)

他にもブログエディタはあるみたいですけどちょっと調べた限りMacでブログエディタを使うとしたらMarsEditが高機能だし使っている人が多いので情報を探すのも楽だと思います。

以下、実際にそれぞれのエディタのメリットやデメリットを簡単にメモしていきます。

WordPressのビジュアルエディタ

WordPressビジュアルエディタの編集画面

もともとWordPressの管理画面に実装されているエディタのビジュアルエディタです。誰でも使える標準の執筆モードですね。

Wordみたいに文字の色を変えたらそのまま見た目に反映されたり画像を挿入したら画像がそのまま見えたりしていわゆるリッチテキストエディタと言われるものです。

ただしちゃんと範囲選択しているのにHTMLタグが思ったとおりに適用されなかったりして好きじゃない人も多いようです。

個人的にはビジュアルエディタでもCSSを適用して自分のブログとまったく一緒の見た目にすればかなり使いやすいですけどね。

※追記:「OnePress Image Elevator」というプラグインを使えば貼り付けのショートカットキーCtrl+Vで画像の挿入が簡単にできるようになりました。

参考:「OnePress Image Elevator」の使い方と設定まとめ

Webのビジュアルエディタで使えるので当然Macでも使えます。画面が広いデスクトップの場合は、Macでブログを書くとしてもビジュアルエディタのほうが便利かもしれません。

WordPressのテキストエディタ

WordPressテキストエディタ

Web画面から編集するテキストエディタ(HTML編集モード)だとメリットはほぼありません。

タグは色分けされずに見難いし、プレビューボタンを押していちいちページを読み込まないと実際の見た目を確認できないし、

MacでもWindowsでもWordPress純正のテキストエディタはおすすめしません。テキストエディタ風にブログを書きたいなら、MarsEditなどのブログエディタの導入を考えたほうが良いでしょう。

MarsEditの特徴

さて、MarsEditの特徴を簡単に書いてみると、

リアルタイムプレビュー

MarsEditリアルタイムプレビュー

自分のCSSを適用すればまったく同じ見た目にしてリアルタイムにプレビューを表示することができます。

画面左側でHTMLエディタを書いて右側にプレビュー画面を表示しておけば編集しやすいです。

Web画面でのHTMLエディタとプレビュー画面の良いとこ取りでしかもリアルタイム表示という使いやすい仕様ですね。

プレビューは実際のCSSが反映される

MarsEditプレビューに自分のCSSを反映

MarsEditのプレビュー設定にはCSSの欄があって自分のブログと同じデザインにすることができます。

ただしこれに関してはさっき説明した通り、ビジュアルエディタでもCSSを反映させることは可能です。

参考:WordPressビジュアルエディタのCSSに実際の表示を適用する方法

なので、個人的にはMarsEditのCSS反映はそこまでの衝撃ではありませんでした。

欲を言えばMarsEditのリッチテキストモードでCSSデザインを完全に反映させて直接編集ができたら最高ですけど、それはできないみたいです。

画像の挿入が簡単

MarsEdit画像挿入

MarsEditでは画像をドラッグ&ドロップで挿入することができます。

  • 画像ファイルをドラッグ、Skitchからドラッグ、iPhotoからドラッグなど、ドラッグに融通が効く
  • MarsEditにドラッグする時に好きな場所に挿入できる。
  • 挿入と同時にclass名・alt・サイズなどの指定ができるので二度手間にならない
  • 大きな画像をドラッグしても自分が指定したサイズに自動でリサイズされてファイルサイズも小さくなるので画像の処理をあまり心配する必要がない

というふうにあまり難しいことを考えずにドラッグしまくれます。

ただしショートカットキーを使った貼り付けはできないのでその点ではWordPressビジュアルエディタでOnePress Image Elevatorのほうが使いやすいです。

マークダウン記法が使える

MarsEditマークダウン記法

MarsEditではマークダウン記法というHTMLタグに変換される専用のタグを使った記法が使えます。

例えばh2見出しを書く場合、普通のタグとマークダウンを比較してみると、

  • 通常・・・ <h2>○○○</h2>
  • マークダウン・・・ ##○○○

普通は開始タグと閉じタグが必要なのにマークダウン記法では閉じタグが必要ないのでそのまま書き進めることができます。

マークダウン記法はMarsEditだけじゃなく、記法をサポートしているエディタだったら使えるので覚えておいて損はありません。

※追記:WordPressビジュアルエディタでもマークダウン記法が使えるようになったので、そんなに差が無くなりました。

ショートカットキーでタグ入力

MarsEditショートカットキー

MarsEditでは自分の好きなHTMLタグをショートカットキーに割り当てることができるのでやろうと思えば何でもできます。

自分はとりあえずh2タグのマークダウン「##」をcontrol+2に割り当てたりしてシャープの連続入力さえワンアクションで入力できるようにしました。

  • control+2・・・「##」(h2見出し)
  • control+3・・・「###」(h3見出し)
  • control+4・・・「####」(h4見出し)
  • control+R・・・「- 」(リスト)

これらを設定するだけでもかなり書きやすくなります。

その他 <span class="sankou">参考</span> のようなspanとclassで囲む自分で作った長いタグで囲むようなものもショートカットキーを設定できるので自分専用のタグをショートカットキーで呼び出すことができます。

ちなみにWordPressビジュアルエディタにはAddQuickTagというショートコード挿入用のプラグインがありますが、ショートカットキーが使えないので、この点ではMarsEditのほうが便利です。

HTMLタグの自動色分け

MarsEditのタグ色分け

開始タグ、class、URLなどがそれぞれ役割ごとに色分けされていてHTMLタグを直接いじりたい時に編集がしやすくなっています。

幅(width)を後で変えたい時とかすぐに見つけることができて便利。HTML編集モードで書く人にとっては非常に重宝します。

プラグインによる機能拡張

AppHtmlME検索

例えばアプリの紹介リンクを作成するWebサービスにAppHtmlWebというサービスがありますがWebブラウザからアクセスする必要があるので操作がやや煩雑になります。

またMacのローカル上で動くAppStoreHelperというアプリもありWebブラウザよりマシですがMarsEditから画面を切り替えないといけないのでまだ完璧ではありません。

これをMarsEdit専用プラグインAppHtmlMEを組み込むことによってMarsEdit内でアプリの検索から貼り付けまでを完結することができるようになります。

  • プラグインを起動するショートカットキーを押す
  • iPhone・iPad・Macなどの検索対象を選択
  • アプリ名検索
  • 表示するレイアウトを選択
  • HTMLタグが挿入される

という手順で完結できます。素晴らしい。(ただし設定がけっこうややこしい)

上記はアプリのリンクを作成する例でAppHtmlMEについて書きましたがその他にもMarsEditに組み込むことができるプラグインはいろいろあります。

オフラインで編集可能

今となってはWebのビジュアルエディタもだんだん高機能になってきたのでその差が縮まっていますが、ビジュアルエディタとMarsEditの最大の違いはオフラインでもブログが書けること。

テキストの執筆から画像の挿入までMarsEdit内で完結させておいて、ネットに繋がった時にアップロードができるので、作業を切り分けできるメリットはあります。

WordPressのエディタの使い勝手が上がってきた

この記事を執筆してから時間も経ち今ではWordPress標準のエディタもかなり便利になってきました。

画像の挿入はOnePress Image Elevatorというプラグインが登場して完全にビジュアルエディタのほうが便利になったし、マークダウンはWordPress 4.3から標準対応したし実際の見た目をそのまま再現することも可能だし。

徐々にブログエディタが必要になることも少なくなるんじゃないかなぁって思ってます。

まとめ

以上、WordPressのビジュアルエディタとMarsEditを比較していきました。昔ほどMarsEditにアドバンテージがありませんがオフラインでブログを書くなら選択肢のひとつとしてありかもという感じです。

カテゴリ: 仕事効率化, ソーシャルネットワーキング
価格: 無料 (掲載時)
スポンサーリンク

このページのシェア・保存はこちら

スポンサーリンク

著者のフォローはこちら

名前:
Twitter
YouTube

ーーー

プロフィール
問い合わせフォーム
当サイトご利用時の注意事項

制作物:邪魔なサイトを除外する検索エンジン「ノイズレスサーチ

コメント(本文のみでOK。URL含むコメントは承認待ちになります)

メールアドレスが公開されることはありません。