メインコンテンツへ移動
3 分間の読書時間 (674 語)

Gutenberg用のログイン、登録、検索ブロックを紹介します

カバー

何よりも、WordPressはコンテンツ管理を容易にするために作成されました。長年にわたり、WordPressの利用はブログ投稿の執筆と密接に結びついていました。しかし、Advanced Gutenbergの最新アップデートにより、ログイン、登録、検索機能をページと投稿の両方に並べて追加することで、より自由にページを作成するためのツールが提供されます。.

Advanced Gutenberg 2.1は、WordPressのよりバニラな機能を指先で利用できるようにする2つの新しいブロックタイプ、ログインと登録、および検索ブロックを提供します。これら2つの新しいブロックを使用すると、ログインと登録をシームレスに統合してメンバーを引き付けたり、検索バーを表示してメンバーが探しているものを見つけやすくすることができます。.

Gutenbergを使用したログインと登録

こんなことを想像してみてください - あなたは製品の究極のワンページャーを作成しました。最後に、ユーザーを登録させたいと思っています。どうしますか? ユーザーに上にスクロールして登録してもらうか、テンプレートを更新しますか? Advanced Gutenberg 2.1を使用すると、ページの最後にブロックを追加するだけで済みます。.

ログインおよび登録機能は、ログイン/登録フォームと呼ばれる1つのブロックで提供されます。ユーザーは、既にアカウントを持っているかどうかによって、ログインと登録のビューを自分で切り替えることができます。編集中は、ブロックメニューの表示切り替えボタンを押すことで、ログインと登録のビューをプレビューできます。

 

このフォームのすべてのテキストは、要素をクリックして編集できます。ボタン テキストやラベルも含まれます。このブロックは、機能を備えているにもかかわらず、一見シンプルですが、サイドバーからコンテンツをカスタマイズできます。.

最初に表示されるのは、フォーム固有の設定です。デフォルトで表示されるログインビューまたは登録ビューを選択できます。そのすぐ下で、ユーザーがログインまたは登録した後にフォームがリダイレクトされる先(ホームページ、ダッシュボード、またはカスタムページ)を指定できます。そのすぐ下で、ブロックの寸法をカスタマイズして外観のカスタマイズを開始できます。ヘッダーの色やフォームのロゴ、寸法をカスタマイズするオプションを試すことができます。.

 

設定をさらにスクロールすると、ログインと登録のビュー間の切り替えを無効にできます。たとえば、フォームが顧客を募集することを目的としたページにある場合、登録ビューはおそらくより賢明な選択肢ですが、ログインファンクションは引き続き利用可能です。推奨はされませんが、パスワードリセットリンクを非表示にすることもできます。.

サイドバーのその他のオプションは、従来の Advanced Gutenberg カスタマイズオプションです。入力フィールドの背景、ラベル、値の色を変更できます。下部に、Advanced Gutenberg は、境界線や送信ボタンとその動作をカスタマイズするオプションを用意しています。.

 

新しいGutenberg検索ブロック

ユーザーをメンバーに変えると、次の大きな課題が発生します。それは、メンバーを維持することです。Advanced Gutenberg 2.1の2番目の新しい追加機能は、検索バーブロックです。これは、メンバーが次に読むべき記事を探すことができるように、記事の最後など、どこにでも挿入できる便利なツールです。

 

このブロックには、モダンなスタイルとクラシックな外観の2つのスタイルから選択できます。さらに、ブロック設定からさまざまなオプションでカスタマイズできます。デフォルトでは、検索バーはコンパクトですが、幅をフルに広げたり、ピクセル単位で独自の幅を指定したりできます。.

検索アイコンの位置をデフォルトの左寄せではなく右に移動できます。アイコンは、検索機能が画像を探すものであることを示すように変更することもできます。その他、テキストからボタンまで、ログイン・登録ブロックと同じように変更できます。.

 

Gutenbergの機能は、WordPress 5.0のリリースからほぼ1年が経過しても、私たちを驚かせ続けています。Advanced Gutenbergを使用すると、より機能的なブロックへの最新の取り組みで、あなたの創造性を解き放つことができます。新しいメンバーを引き付けたい場合でも、既存のメンバーを維持したい場合でも、Advanced Gutenberg 2.1であなたの好みに合ったものが見つかります。.

最新情報をお届け

ブログを購読すると、新しい更新情報があった際にメールでお知らせしますので、見逃すことはありません。.

関連記事

 

コメント

まだコメントはありません。最初にコメントを投稿してください
既に登録済みですか? こちらからログイン
2026年4月2日(木)

キャプチャ画像