[WordPress] ビジュアルエディターを便利に使うためのショートカットまとめ

こんにちは！きち（@YOSHI_YANO）です。このブログもそうですが、WordPressというブログシステムを使用しています。僕の周りのブロガーさん達はテキストエディターを使っている方が多いのですが、僕はずっとビジュアルエディターを使っています。理由はビジュアルエディターの方が文章を書くということに集中できるということと、単純にその方が早いから。という理由です。

ですので、ビジュアルエディター推奨派なのですが、もっとビジュアルエディターの良さを知ってもらうために、ビジュアルエディターをもっと便利に使うためのショートカットをまとめておきたいと思います。

※ちなみに今回はMacでの操作で書いていますが、Windowsの方は「command → Ctrl」「option → Alt」に置き換えてやれば同じことができます。（できるはずｗ）

ビジュアルエディターでよく使うショートカット

見出し（command＋数字）

ショートカット：
command＋数字

これが最もよく使うショートカットですが、見出しを作成するために使うショートカットです。エディター上部を選択してもいいのですが、ショートカットの方が断然早いのでショートカットを覚えておいたほうが効率が上がります。

使い方としてはまず普通に文字を打った後、見出しにしたい部分を選択して、「command＋数字」

見出しレベル2にしたい場合は、command＋2を使います。他にも見出し3とか見出し4を使いたい場合は、数字の部分を「3」とか「4」でやってやればOKです！

文字を太字にする（command＋b）

ショートカット：
command＋b

文字を太字にして強調させたい場合は「command＋b」です。コントロールバーの「B」の部分にあたります。ショートカットもbなので覚えやすいですね。※ちなみにこの太字はソースでいうとstrongにあたるためHTML上の強調にあたり、見た目を太くする<b></b>とは意味が異なりますのでご注意を。記事内のテキストとして強調させたい場合に使用して下さい。あと使いすぎは禁物です。

リンクを挿入（option＋Shift＋a）

ショートカット：
option＋Shift＋a

リンクを設置する場合は、リンクさせたいテキストを選択後「option＋Shift＋a」でできます。ポップアップでリンクの設定画面がたちあがるので、リンクを打ち込むか自分の過去記事にリンクさせたい場合は下の「既存のコンテンツにリンク › 検索」を押せば記事タイトルがでてきますので、選択すればURLとタイトルが上の部分に挿入されるので、あとは「リンク追加」を押すだけです。

ちなみに選択するのは文字だけじゃなくて画像でもOKです。

引用文にする（option＋Shift＋q）

ショートカット：
option＋Shift＋q

ブログをしている方でよく使うのがこの「引用」ですよね。ショートカットは「option＋Shift＋q」。Wikipediaなどで文章を抜粋して自分のブログにのせたりする場合によく使います。

リストタグを作成（option＋Shift＋u）（option＋Shift＋o）

ショートカット：
[番号なしリスト] option＋Shift＋u
[番号つきリスト] option＋Shift＋o

最後にこれもよく使うタグとして、リストタグがあります。細かな説明が難しかったので下のアニメーションgifをご覧ください。基本的な使い方は先に改行したテキストを書いておいて、それを選択して「option＋Shift＋u」か「option＋Shift＋o」を押すだけです。uとoの違いは番号なしリストか番号付きリストかどうかです。

続きを読む− moreタグ（option＋Shift＋t）

ショートカット：
option＋Shift＋t

使っているかたもいない方もいるかと思いますが、続きを読むタグ（more）のショートカットです。moreの「m」じゃないんかい！と思われるところですが、つづきをよむ（tudukiwoyomu）の頭文字の「t」とおぼえて下さい。「m」じゃない理由は下記…

メディアを追加（option＋Shift＋t）

ショートカット：
option＋Shift＋m

上のmoreタグが「m」じゃないはこのせいです。メディア[media]の頭文字の「m」が使われています。おそらく続きを読むタグは使う人が限られるし、こちらのメディアを追加の方が需要があるのでこちらが優先されているんですね。

ビジュアルエディターをさらに使いやすくするプラグイン「Ultimate TinyMCE」の紹介

ここまでよく使う基本のショートカットを抑えてきたのですが、ショートカットだけではできない（そもそもWordPressのビジュアルエディターにない）機能もあります。そんなときはプラグインのUltimate TinyMCEをインストールしてやれば幸せになれるかもしれません。

どうしてもタグを挿入したい場合

ブログなどをしている場合、Amazonの商品リンクを貼りたいとかアフィリエイトタグを挿入したいという場合がでてきます。そんなときはテキストエディタに切り替えるしかないのですが、この「Ultimate TinyMCE」を使えばビジュアルエディターのままでタグの操作が可能になります。

プラグインを有効化するだけでデフォルトの機能が有効になりビジュアルエディターの見た目が少し変わり、「< >」というボタンが出現します。このボタンを押すと、ポップアップでコードが表示されて、ビジュアルエディターのままタグを表示・操作することができるようになります。

タグを見慣れない方には少し吐き気がするかもしれませんが、Amazonの商品用ソースを入れたりする方はある程度見慣れているかと思いますので、試してみてください。ちょっとしたことですが便利ですよ！

テキストエディタとビジュアルエディターを表示切り換えすると思わぬ不具合がでたり、タグが消えたりってことがあるのですが、この機能を使えばその不具合もほとんどなくなっていると実感しています。（※ただし完全に不具合がなくなるかどうかわかりませんのでその辺りは自己責任で。）

他にも多機能だよ！

またこのプラグインはデフォルトでは使えないタグなども使えるようにできたり、機能をカスタマイズすることができるので、興味がある方はいろいろ試してみてください。Ultimate TinyMCEに関してはネタワンさんがうまくまとめてくれているのでそちらをご参照下さい。

参考：Ultimate TinyMCE – ビジュアルエディタを拡張できるWordPressプラグイン – ネタワン

まとめ

さて、ビジュアルエディターの便利なショートカットについて書いていきましたが、あらためて見てみると使っているタグはほとんどありませんね。でもブログを書く上で使うタグというのは僕の場合、そんなにたくさんありません。

なので今後もビジュアルエディターを極めていきたいと思うのですが、この記事をみてビジュアルエディターも悪く無いじゃんという方がいてくれたら嬉しいっす。