WORDPRESS

【2021年】WordPressのクラシックエディタとグーテンベルグとは?プラグイン「Classic Editor」の導入方法まで1から解説

WordPressのクラシックエディタとグーテンベルグとは?プラグイン「Classic Editor」の導入方法まで
 

あずきです🐥

WordPressの新エディタ「グーテンベルグ(ブロックエディタ)」の登場からもう2年以上が経ちますが、そんななかで今なお底堅い人気を誇っている…

Classic Editor

の導入方法と、それ以前に…

そもそも「クラシックエディタ」と「グーテンベルグ」とは?

といった点について、ブログ初心者さん向けに1から解説していきます

 

まずWordPressでは、基本的に…

  • クラシックエディタ / Classic Editor
  • グーテンベルグ / Gutenberg

という2種類のなかからどちらか一方の「編集エディタ」を選んで、そのエディタ内で記事を作っていくことになります

つまり、記事を書くときの「編集画面タイプ」のこと!
 

で!

どちらのエディタを使っていくにしても、両者の「最低限のポイント」については、最初にしっかり押さえておくのがおすすめです

 

なぜなら、例えば「記事の作り方」についてググったりした際にも…

  • クラシックエディタ用の解説
  • グーテンベルグ用の解説

ここがごちゃ混ぜになってしまうと…

 

なんか自分の画面と全然違うんだけど!?泣

 

といったケースにもなりかねないからですね

ブロガーあるある
 

関連

「クラシックエディタとグーテンベルグ、結局どっちがおすすめなの?」「クラシックエディタのサポート期限っていつまで?」といった点については、こちらをどうぞ ↓

WordPressクラシックエディタはいつまで使える?結局グーテンベルグとどっちがおすすめ?
【2021年版】WordPressクラシックエディタはいつまで使える?結局グーテンベルグとどっちがおすすめ?【専業ブロガー4年目の本音】

続きを見る

 

ということで、さっそく見ていきましょー🐥

 

\ 当ブログで愛用しています /

ACTION AFFINGER6 バナー 01-300px

検証と改善を重ねた唯一無二のテーマ

「稼ぐ」に特化したワードプレステーマ『ACTION AFFINGER6』

今ならプラグイン「すごいもくじLITE」を期間限定で配布中!

※新エディタ「グーテンベルグ」への対応が強化されましたが、「クラシックエディタ」も引き続き使用できます

関連:【1番の本質】ACTION AFFINGER6って実際どう?気に入ってる点・気になる点を、専業ブロガーが本気レビュー【愛用テーマ】

【2021年】WordPressのクラシックエディタとグーテンベルグとは?プラグイン「Classic Editor」の導入方法まで1から解説

WordPress ヘッダー a-01

 

まず最初に、WordPressにおける2つの編集エディタ…

「クラシックエディタ」と「グーテンベルグ」とは?

という点について

 

この「クラシックエディタ」と「グーテンベルグ」とは、2018年冬にリリースされた…

WordPress5.0

への大型アップデートによって、結果的にユーザーが「二分化」された編集エディタです

 

そもそも!

「WordPress5.0」がリリースされるまで、WordPressの編集エディタというのは通常…

クラシックエディタ

のみでした

以前はそれ1本だったから、「クラシックエディタ」っていう名前すらなかったよ
 

そこに、2018年末から登場した「WordPress5.0」によって…

 

編集エディタが抜本的に生まれ変わります

 

この生まれ変わった「新しい編集エディタ」というのが、ズバリ…

グーテンベルグ

のこと

 

従来の「クラシックエディタ」が、いわば「Office Word」感覚のスタンダードな仕様だったのに対して、「グーテンベルグ」は…

 

直感的な操作性

 

というのが、まず1番の特徴です

 
クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-01

「クラシックエディタ」の画面例

 
クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-02

「グーテンベルグ」の画面例

 

まず!

「クラシックエディタ」の場合は、画面の上部にある…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-03-a

↑ こちらの「ツールバー」エリアを中心に、例えば…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-03-b

↑ 任意のテキストを選択した状態で…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-03-c

↑「太字」アイコンをクリックすると…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-03-d

↑ このように「太字」に変えられるなど、まさに「Office Word」のような「基本に忠実な操作感」となっていて、ブログ初心者さんでも極めてとっつきやすい仕様です

安心感がハンパない
 

一方で!

WordPress5.0から登場した「グーテンベルグ」の場合、まずそもそもの前提として…

ブロックエディタ

という、少し特殊なスタイルが採用されています

 

この「ブロックエディタ」とは、具体的には…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-04-a

↑ こういった記事コンテンツを形成している「段落」や「見出し」があったとしたら、その1つ1つを…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-04-b

↑ このように、それぞれ独立した「ブロック」として扱っていくんですね

 

この「ブロック」という意味合いが特によくわかる機能として、例えば…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-05-a

↑ こちらの「見出し」として使っているブロックを選択して…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-05-b

↑「上矢印」のアイコンをクリックしてみると…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-05-c

↑ このように、1つ上の「ブロック」に丸々移動させることができます

スマホのHOME画面みたいな感じ
 

また…

「グーテンベルグ」は画面の仕様もミニマル、つまり最小限まで簡略化されていて、いざ使いたい機能があったときには…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-06-a

↑ その「最小限」に表示されているアイコンなどから…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-06-b

↑ このように、「詳細」のメニューを呼び出すスタイルが基本となっています

良くも悪くも「スッキリさ」が追求されたエディタである
 

そんな ”今っぽい仕様” に一新された「グーテンベルグ」でしたが、この新エディタがいざリリースされると…

  • 前の画面と変わりすぎて困ってる
  • 操作方法がサッパリわからない
  • 普通に今までのを使わせてほしい

といった困惑の声が続出したんですね

 

すると、そういった切実な要望に応えるように、WordPress5.0以降のバージョンでも「以前までの標準エディタ」に戻すことができる…

Classic Editor

というプラグインが登場します

 

この「Classic Editor」は、2021年現在でリリースからまだ「2年程度」にも関わらず…

クラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 1-07

↑ このように有効インストール数「500万以上」という驚異的な数字で、それだけ「クラシックエディタ」の需要や人気が高いことを示しています

 

もちろん「Classic Editor」は無料のプラグインで、導入の手順も「インストールして有効化」するだけと、ほんの一瞬です

具体的な導入方法については、このあと解説するよ!
 

結果!

「WordPress5.0」がリリースされて以降、WordPressの編集エディタは…

  • 新エディタ → グーテンベルグ(ブロックエディタ)
  • 旧エディタ → クラシックエディタ

にユーザーが実質「二分化」されることになったというのが、大まかな流れになります

 

関連

「クラシックエディタとグーテンベルグ、結局どっちがおすすめなの?」「クラシックエディタのサポート期限っていつまで?」といった点については、こちらをどうぞ ↓

WordPressクラシックエディタはいつまで使える?結局グーテンベルグとどっちがおすすめ?
【2021年版】WordPressクラシックエディタはいつまで使える?結局グーテンベルグとどっちがおすすめ?【専業ブロガー4年目の本音】

続きを見る

 

ということで、そんな「クラシックエディタ」の導入手順について見ていきましょう🐥

\ 当ブログで愛用しています /

ACTION AFFINGER6 バナー 01-300px

検証と改善を重ねた唯一無二のテーマ

「稼ぐ」に特化したワードプレステーマ『ACTION AFFINGER6』

今ならプラグイン「すごいもくじLITE」を期間限定で配布中!

※新エディタ「グーテンベルグ」への対応が強化されましたが、「クラシックエディタ」も引き続き使用できます

関連:【1番の本質】ACTION AFFINGER6って実際どう?気に入ってる点・気になる点を、専業ブロガーが本気レビュー【愛用テーマ】

 

【2021年】WordPressプラグイン「Classic Editor」の導入方法【デフォルトの「グーテンベルグ」から、「クラシックエディタ」に戻すやり方】

WordPress ヘッダー a-02

 

つづいて、WordPressにデフォルトで設定されている「グーテンベルグ」から…

クラシックエディタ

へ編集エディタを変更する手順についてです

 

さきほどもお伝えしたように…

Classic Editor

という公式のプラグインを使います

「インストール」と「有効化」だけだから、1分もかからないよ!
 

注意

プラグインを使用することで、ご利用中のWordPress環境などによっては不具合が生じてしまう可能性があります。 プラグインの使用に際しては、あらかじめデータやファイルをバックアップされたうえで、ご自身の責任にて行ってください

 

関連:WordPressプラグイン「BackWPup」の設定方法を初心者向けに解説【ブログに必須な自動バックアップ】

 

WordPress管理画面の左側にある一覧メニューから…

WordPressプラグイン インストール 1-01

↑「プラグイン」という項目にカーソルを合わせ、開いたメニュー内にある「新規追加」をクリックしましょう

 

つづいて、画面の右上にある…

WordPressプラグイン インストール 1-02

↑ こちらの検索フォームに Classic Editor と入力し、その下の検索結果から…

WordPressのクラシックエディタとグーテンベルグとは?「Classic Editor」の導入方法 2-01

↑ このアイコンが目印のプラグイン「Classic Editor」を探し、右上の「今すぐインストール」ボタンをクリックします

 

「今すぐインストール」ボタンが「有効化」という表示に切り替わったら、つづいて「有効化」ボタンもクリックしましょう

WordPressプラグイン インストール 1-03

↑「プラグインを有効化しました。」と表示されたら、プラグインの「インストール&有効化」は完了です

▼ 「クラシックエディタ」における基本的な記事作成は、こちらをどうぞ ▼

あずきのWordPressブログガイド 第7章「記事編」TOP アイキャッチ
【2020年】ワードプレスで記事を作って投稿しよう!【あずきのWordPressブログガイド/第7章TOP】

続きを見る

 

今回の記事はこちらの章に属しています

 第4章 プラグイン 編         

次の章はこちらからどうぞ

 第5章 サイトマップ 編        

全9章のTOPです

あずきのワードプレスブログ「完全初心者」ガイド

\ 当ブログで愛用しています /

ACTION AFFINGER6 バナー 01-300px

検証と改善を重ねた唯一無二のテーマ

ACTION AFFINGER6

 

 ✔ 洗練されたビジュアルと、ターゲットに合わせた「変幻自在」な柔軟性!

 ✔ 時間のかかる面倒なカスタマイズも、「クリック1つ」でさくさく実現!

 ✔ 本気で戦うためのSEO対策と、「稼ぐ」に特化したアフィリエイト機能!

今ならプラグイン「すごいもくじLITE」を期間限定で配布中!

※新エディタ「グーテンベルグ」への対応が強化されましたが、「クラシックエディタ」も引き続き使用できます

 

公式:「稼ぐ」に特化したワードプレステーマ『ACTION AFFINGER6』

関連:【1番の本質】ACTION AFFINGER6って実際どう?気に入ってる点・気になる点を、専業ブロガーが本気レビュー【愛用テーマ】

 

About me

あずきアイコン main-01 背景透過

- 専業ブロガー・フリーランス -

あずき

 

独立4年目 / 元アパレル → 歴10年

 

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます。 普段はTwitter(@azuki_rinrin)にわりといるので、覗いてもらえると嬉しいです^^

-WORDPRESS