はてなブログ編集をショートカットする裏技3選【便利なショートカットキー10個と無料ツール紹介】
ショートカットキー使い倒してますか？こんにちは！IT女子のちーさんです。
今日は、私がはてなブログを4年間使う中で編み出した、はてなブログを効率的に更新・編集する方法を伝授します。
覚えておこう！ショートカットキー
はてなブログの編集は、ショートカットキーを使うと便利です。
いちいちマウスでやるのではなく、ショートカットキーでやったほうが断然楽です。
見出しを作る
意外と知られてないショートカットキーかも。他のエディタでは機能しないのですが、はてブでは使えるショートカットキーです。
太字にする
登場頻度No.1のよく使うショートカットキーなので必ず覚えましょう！大抵のエディタはこれで太字になります。
切り取り
コピペするときに、コピー先の文言は決して貼り付け先に移動したいというときは、切り取りが便利です。
書式を無視して貼り付け
他のエディタなどで書いた文章をはてブのエディタに貼り付けたいときは、書式を無視して貼り付けましょう。そうすると、余計な装飾がなく貼り付けることができます。私は、iOS搭載のメモにいつも下書きを書いてからはてブに貼り付けてます。
全て選択
何らかの事情で一度書いた記事を全てコピーしたいときなどに使いましょう。全て消したいというときにも有効です。
元に戻す
「あ、間違えちゃった！」というときにあなたを救ってくれるショートカットキーです。このコマンドを押せば、きれいに元通りになります。
改行タグ<br>を追加
はてなブログで普通にエンターを押すと、<p>タグが付与されて段落になってしまいます。<p>タグ内での改行をしたい場合は、このショートカットキーで対応できます。
進む
これは主に、元に戻すコマンドを使った後に発動します。「あ、やっぱり元に戻さなくてよかった！」というときに、 押すと元に戻す前の状態に戻ります。
ブラウザ内タブ移動
はてなブログ内のコマンドではありませんが、ブラウザで他のタブを見ながらブログを書くことは多いですよね？ そんなときに使えるのがコレ。このコマンドを操作することで、見たいタブとはてなブログのエディタタブを自由に行き来できます。
ウィンドウの移動
他の作業ウィンドウに移動できるショートカットキーです。Macだと3本指でやるアレですね。ネットサーフィンでは3本指でもいいかもですが、やはりブログ執筆はキーボード操作がメインなので、ウィンドウの移動もショートカットキーで行った方が楽です。
ブラウザで使えるショートカットキーはこちらの記事でも紹介しています。
こちらの記事もオススメ
蛍光ペン装飾をショートカットする裏技
私は、ブログの装飾で蛍光ペンを使っていますが、これも実はある裏技を使ってショートカットキーでやっています。
蛍光ペンの装飾は、デフォルトでは搭載されておらず、はてなブログのCSSをいじる必要があります。
はてなブログのショートカットキーであまり使わない「斜体」コマンドを利用する方法です。
デフォルトの設定で斜体にするには、文字を選択して「Command（Ctrl）＋I」を押す斜体になります。
その際に、HTMLでは選んだ文字を囲うように<em></em>が付与されます。デフォルトのCSSでは「<em>で囲うと斜体になる」という設定になっているのですが、これを「<em>で囲うと蛍光ペンになる」に変えれば良いのです。
具体的には、はてなブログのCSS設定で、以下の文言を追記します。
/* 蛍光ペン */
.entry-content em{
font-weight:bold;
text-decoration: none;
margin:0 0.1em;
padding:0.1em 0.2em;
background:#fcfc60 !important;
background:linear-gradient(to bottom, transparent 60%, rgba(102,255,204,1) 60%) !important;
}
こうすると、エディタ上で「Command（Ctrl）＋I」をすると、蛍光ペンになります。
もしこれを設定しないと、わざわざHTML編集で蛍光ペンにするための記述をする必要が出てきます。（めんどくさい）
吹き出しをショートカットする裏技
最後に簡単に吹き出しを作る方法です。
吹き出しのCSS設定については以下の記事を参考にしてください。
吹き出しは記事のHTMLを少しいじらないと作れないようになっています。だた、挿入するHTMLの記述は毎回共通しているので、これを簡単に呼び出せればOKです。
そこで活躍するのが、Clipy（Mac）とClibor（Windows）です！
Clipy（Clibor）は、コピー履歴を保存するのですが、定型文の登録もできます。なので、コメントを呼び出すための文言を登録しておいて、<p>タグの中に入れればOK！
吹き出しHTMLはこうなってます。
<p class="r-fuki chihiro">最後に簡単に吹き出しを作る方法です。</p>
Cliborには、「 class="r-fuki chihiro"」を登録しておき、吹き出しにしたい<p>タグの"p"の後ろに入れればOKということです。
これらの裏技を使って、はてなブログ編集を高速化してみてくださいね！
以上、IT女子のちーさんでした！
