【WordPress】「段落」を「見出し」に一瞬で変換する方法(Gutenbergエディタ) | G.C.M Records

G.C.M Records ボカロP「アンメルツP」（gcmstyle/安溶二）情報発信サイト

G.C.M Recordsからのお知らせ

プロセカULTIMATE採用曲「人生」ダウンロードカードや各種グッズの通販実施中！

最新記事

アイキャッチ「Gutenbergで「段落」を「見出し」に一瞬で変換する方法」

【WordPress】「段落」を「見出し」に一瞬で変換する方法(Gutenbergエディタ)

カテゴリ： webデザイン・サイト運用, 創作ノウハウ・ハウツー　タグ: , ,

はじめに

こんにちは、ボカロPのアンメルツPと申します。

このブログは WordPress を使って書いております。
「WordPress5」以降はGutenberg（グーテンベルク）という新しいエディターが採用されて
そこそこ快適に使っておりますが、不満も一部あります。

ある程度はショートカットキーなども用意されて効率化されているものの
まだWordなどの個別アプリのエディターに比べると充実していません。

その中でも頻繁に使うのにかかわらず、（直接的な）ショートカットキーがなくて困っていたのが
「段落」を「見出し」（h2,h3,h4など）に変換する方法でした。

特に私の場合、原稿を平文で作成して後から見出しを作ったり、
執筆した著書からこのブログ向けに入力した文章を転記することもよくあります。

その際、段落→見出しへの変換が、かなりクリック数のいる操作であると日々感じていました。

WordPressエディタ「Gutenberg」の画面より。段落から見出しへの変更に、わざわざツールバーを開く行為めちゃくちゃ面倒だと思いませんか
段落から見出しへの変更に、わざわざツールバーを開く行為めちゃくちゃ面倒だと思いませんか

（１）変換したい段落をクリック
（２）ツールバーの左上「ブロックタイプまたはスタイルを変更」クリック
（３）出てくるものから「見出し」をクリック
（４）見出しはデフォルトでは「h2」のため、「h3」「h4」を出したい場合「レベルを変更」をクリック
（５）出てくるものから「H4」をクリック

なんと最大5クリックが必要になります。
たかが5回とはいえ、これが10個も20個も続くものですからだんだん更新する気力が失せてきますね。

しかし実はちょっとしたテクニックを覚えるだけで、この作業が割と一瞬でできてしまうということに
最近気づきましたので、その方法を紹介したいと思います。
（以下の説明は Windows 10を前提にしております）

Markdown記法を使えば解決

実は、Gutenbergのエディターでは「Markdown記法」を使うことができるのです。

参考記事
Gutenbergでマークダウン記法を使って執筆速度をアップしよう | hatena chips

エンジニアの方にはもうここまで説明が終わってしまうと思うのですが、
ここはボカロ P のサイトということで、
個人サイトを運用している同人作家やミュージシャンの方向けに引き続き説明していきます。

「Markdown」とは、Wikiの編集などで採用されている、エディタ上で効率化を図れる記法の仕組みです。
身近なところでは、「Togetter」で手動の文章を入力する際に見出しをつける時にも使いますね。

Gutenbergで使えるすべてのMarkdown記法は上記の参考記事がとても詳しいのでそちらをご覧ください。

ここでは記事タイトルであるところの、段落を見出しに変換する方法に絞って解説します。

見出し「h2」を入力→先頭に「## 」（シャープ2つと半角スペース）
見出し「h3」を入力→先頭に「### 」（シャープ3つと半角スペース）
見出し「h4」を入力→先頭に「#### 」（シャープ4つと半角スペース）

このような感じでh1からh6まで対応しております。
普通の段落の始めに入力することで、もうその時点で見出しに即座に変換されるわけですね。

この状態でスペースキーを押すと…
この状態でスペースキーを押すと…
入力欄がh2に即座に変わります
入力欄がh2に即座に変わります

実はこれは既に段落に文字が入力されている場合も有効です。

その場合、文章の先頭に#をいくつかと半角スペースを入力することで、即座に見出しに変換されます。

ということは…

キーボードの「Home」キーを押す→シャープをいくつか入力→スペースを入力

にて、段落が見出しに変換されるということになります。

マウスの5クリックとキーボードを数回叩くのとでは、もうこれはかなり手間が違ってきます。
個人サイトでガンガン文章を編集していこうという方は、是非覚えていただきたいと思います。

応用編

マウスを使わずにキーボードで操作ができるということは、
そこからキーボード操作を省略できる仕組みと組み合わせると
さらに手間が節約できることを意味します。

例えば、これはどちらかと言うとWordPress上で既にある段落を見出しに変換するというよりは
WordPressに貼り付ける前、別のエディターで編集する際にあらかじめ仕込んでおく方が向いていますが、
「#### 」を「ｈ４」のような言葉で辞書登録しておくというのはひとつの方法です。

それから、PCアプリ「PhraseExpress」を普段から使っている人ならそこに登録する手もあります。
例えば「4;」を「#### 」に紐づけておけばキーボードを打つ手間がかなり減りますね。

私は「Elgato Stream Deck」を使って、これをマルチアクションとして登録しました。
これにより、ボタンを1個押しただけで段落が見出しに変換できる環境の完成です！

「Home」キーとテキスト入力の組み合わせにより、ボタンひとつで段落を見出しに変換できるようになりました

皆様もお持ちの環境と照らし合わせてぜひお試しください。

Elgato Stream DeckでURLを特定のブラウザで開く方法

★同人作家、ミュージシャン向け！
WordPressでの個人サイト制作本『令和時代の個人サイト制作入門』
紙の本およびダウンロード配信（PDF）を各種同人ショップで実施中です。
140ページの充実した内容となっておりますので、ぜひご覧ください。

令和時代の個人サイト制作入門 ～WordPressで一国一城の主になる方法～

次の記事「」へ

前の記事「」へ

著者「アンメルツP」について

関連記事・広告

記事をシェアする