WordPressのサイドバーや投稿コンテンツでレガシーウィジェットを使いたいですか?
バージョン5.8で、WordPressは新しいブロックベースのウィジェットエディターを追加し、サイトにリッチコンテンツを簡単に追加できるようになりました。幸いなことに、サイト上でクラシックウィジェットを使用することもできます。
この投稿では、WordPressウィジェットをブロックに変換する方法を紹介します。

このガイドでは以下のトピックを取り上げる:
- What Is the Difference Between a WordPress Widget and a Block?
- Can a WordPress Widget Be Simply Converted to a Block?
- How to Add Widgets to Your Classic Theme's Sidebar in WordPress
- How to Add Widgets to Your Block Theme's Sidebar in WordPress
- How to Add Widgets to Your Post Content in WordPress
- Learn More Tricks to Use WordPress Blocks and Widgets
WordPressウィジェットとブロックの違いとは?
WordPressウィジェットは、ウィジェット対応エリアに追加できるコンテンツ要素で、メインページや投稿コンテンツの一部とはみなされないセクションです。
通常、サイドバー、フッター、ヘッダー、その他WordPressテーマがウィジェット対応とみなすセクションが含まれます。

技術的には、WordPressブロックは同じように動作します。しかし、ブロックがウィジェットとどのように異なるかは、クラシックWordPressテーマかブロックWordPressテーマかによって異なります。
クラシックWordPressテーマを使用している場合、WordPressブロックはメインページや投稿エリアに追加するコンテンツ要素です。
一方、ブロックWordPressテーマには、もはや区切りのウィジェットエディターがありません。つまり、ヘッダー、ページ自体、またはどこにあるかにかかわらず、追加するコンテンツ要素はすべてWordPressブロックと呼ばれます。
バージョン5.8で、WordPressは新しいブロックベースのウィジェットエディターを導入しました。これにより、ソーシャルメディアフィードやソーシャルアイコンのようなビジュアルウィジェットの追加がより簡単になりました。

しかし、WordPressブロックにアップグレードされていないレガシーウィジェットに依存している場合はどうでしょうか?幸い、まだ使うことができます。
レガシーウィジェットをウィジェット対応エリアやページの他の部分に簡単に追加する方法を紹介します。使用する方法は、クラシックテーマを使用しているか、ブロックテーマを使用しているかによって異なります。
その前に、開発者の視点からウィジェットとブロックの違いを簡単に説明しよう。
WordPressウィジェットをブロックに変換することは可能か?
もしあなたがWordPressのレガシーウィジェットを作成した開発者なら、それを新規ブロックウィジェットに変換できるかどうか疑問に思うかもしれません。
ウィジェットとブロックは似ているように見えますが、実はかなり違います。例えば、両者はまったく異なるプログラミング言語を使ってコーディングされている。ウィジェットはPHPで書かれ、ブロックはJavaScriptで書かれます。
つまり、ウィジェットをブロックに変換する簡単な方法はない。
しかし、それは問題ではありません。既存のウィジェットは、WordPressの新しいバージョンでも動作し続けます。ウィジェットのコードを更新する予定がない場合は、そのままにしておいてください。
しかし、ウィジェットに新機能を追加し続けたい場合、レガシーウィジェットを置き換える新しいブロックを作成するのがベストです。カスタムWordPressブロックの作成方法については、こちらのガイドを参照してください。

WordPressでクラシックテーマのサイドバーにウィジェットを追加する方法
クラシックテーマを使用している場合、Legacy Widgetを使用することで、WordPressサイトのサイドバーやその他のウィジェット対応エリアにクラシックウィジェットを追加することができます。
注意: 外観 ” ウィジェットではなく、外観 ” 編集と表示されている場合は、ブロックテーマを使用しています。次の方法に従ってください。
まず、WordPress管理エリアの外観 ” ウィジェットに移動する必要があります。
次に、「+ブロックを追加」ボタンをクリックする。ポップアップから、「レガシーウィジェット」アイコンをクリックする必要がある。

ここで、ドロップダウンメニューから使用したいウィジェットを選択できます。
クリックするだけだ。

ウィジェットはサイドバーに追加されます。
画面上部の「更新」ボタンをクリックして、新規ウィジェットを保存することを本当に〜してもよいですか?

さらに詳しく知りたい方は、WordPressでウィジェットを追加して使用する方法と、アクセシビリティモードでWordPressウィジェットを追加する方法のステップバイステップガイドをご覧ください。
WordPressでブロックテーマのサイドバーにウィジェットを追加する方法
初期設定のTwenty Twenty-Twoテーマなどのブロックテーマでは、WordPressのフルサイトエディターを使用できます。フルサイト編集は、サイトのテーマをスタイリングするためのカスタマイザーを提供しますが、初期設定ではレガシーウィジェットを含みません。
つまり、フルサイトエディターからレガシーウィジェットにアクセスできなくなります。さらに、クラシックテーマからブロックテーマに切り替えた場合、使用していたレガシーウィジェットは移行されません。
幸いなことに、プラグインを使ってレガシーウィジェットのサポートを追加することができます。X3P0 Legacy Widgetプラグインをインストールして有効化するだけです。詳しくは、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。
注: プラグインはWordPressの最新バージョンでテストされていないことにお気づきでしょう。とはいえ、私たちはこのプラグインを試しており、このチュートリアルで最もうまく機能するのはこのプラグインだけです。
未検証のプラグインを使用することについての記事を読むと、より詳しい情報が得られます。より良いプラグインを見つけたら、遠慮なくコメントで教えてください!
有効化した場合、プラグインはフルサイトエディターにレガシーウィジェットを追加します。これにより、新しいテーマでレガシーウィジェットを使用できるようになります。

ウィジェットの追加に満足したら、’Save’ボタンをクリックして、変更を正式なものにすることができます。
WordPressで投稿コンテンツにウィジェットを追加する方法
WordPressのブロックコンテンツエディターの素晴らしい点の一つは、投稿やページの中など、ウィジェット対応エリア以外でもウィジェットを追加できることです。
コンテンツエディターに入ったら、画面上部の「+ブロック追加」ボタンをクリックします。
次に、「ウィジェット」セクションまでスクロールダウンし、コンテンツに追加したいウィジェットを見つけます。その後、投稿にウィジェットをドラッグすることができます。

画面右の設定パネルでウィジェットをカスタマイズできます。
完了したら、ブログ投稿やページを公開したり更新したりするだけです。

さらに詳しく知りたい方は、投稿日やページコンテンツにWordPressウィジェットを追加する方法をご覧ください。
WordPressのブロックとウィジェットをさらに詳しく使いこなそう
WordPressのウィジェットやブロックについて詳しくなったところで、それらを最大限に活用する方法をさらに学びたいと思うかもしれません。まずはこちらの投稿をご覧ください:
- WordPressブロックエディター(Gutenberg)で再利用ブロックを作成する方法
- 初心者ガイド:WordPressブロックパターンの使い方
- WordPressで先頭固定表示サイドバーウィジェットを作成する方法
- モバイルでWordPressウィジェットを非表示にする方法(初心者でも簡単)
- WordPressウィジェットにカスタマイザーを追加する方法
- WordPressの特定のページにウィジェットを表示または非表示にする方法
このチュートリアルで、WordPressのウィジェットをブロックに変換する方法を学んでいただけたら幸いです。また、WordPressで投稿日やページごとに異なるサイドバーを表示する方法や、Gutenbergに最適なWordPressテーマも参考にしてみてください。
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Have a question or suggestion? Please leave a comment to start the discussion.