Block Locking API

Topics

  • 特定のブロックの移動、削除機能のロック
  • 特定のブロックの編集のロック
  • パターンやテンプレートへのブロックロックの適用
  • パターンまたはテンプレート内のコンテンツのみの編集への適用
  • ロック機能を制御する権限の変更

Block Locking API を使用すると、エディター内の特定のブロックに対する操作を制限できます。この API を使用すると、ユーザーによる特定のブロックの移動、削除、編集を抑止でき、レイアウトの一貫性とコンテンツの整合性を確保できます。

特定のブロックの移動、削除機能のロック

ユーザーはエディターを通してブロックをロックし、それを解除できます。ロック UI のオプションにより、コンテンツキャンバス内でのブロックの移動や削除を抑止できます。

ロックインターフェースの画像

ネストして含まれるブロックに対してロックオプションを適用するには、外側のブロックに対して「内部のすべてのブロックに適用」オプションをオンにします。しかし、ロックしたブロックをひと固まりにはできません。

Top ↑

特定のブロックの編集のロック

ナビゲーションブロック同期パターン (再利用可能ブロック) にはブロックの移動や削除をロックする機能の他に、ブロックの内容の編集をロックする追加機能があります。含まれる内部のブロックに対する変更を抑止します。

Top ↑

パターンやテンプレートへのブロックロックの適用

パターンやテンプレートを作成する際、テーマ作成者は同じ UI ツールを使用してブロックのデフォルトのロック状態を設定できます。例えば、テーマ作成者はヘッダーの様々な部品をロックできます。ただしデフォルトでは、編集権限を持つユーザーがロックを解除できる点について注意してください。さまざまなブロックを異なる方法でロックしたパターンの例や、ロックされたブロックを持つテンプレートの作成も参照してください。これらのパターンはエディター自身で構築でき、ロックオプションを追加し、ドキュメントに従って登録します。

Top ↑

パターンまたはテンプレート内のコンテンツのみの編集への適用

この機能は WordPress 6.1で導入されました。ブロックの移動や削除を抑止する「ブロックのロック」とは対照的に、「コンテンツのみの編集」は、パターンレベル、またはテンプレートレベルでの使用のために設計されました。すべてのデザインツールを隠しつつ、ブロックのコンテンツは編集できます。これはユーザーインターフェイスを簡素化し、デザインを維持する素晴らしい機能です。このオプションが追加されると、次のように変化します。

  • コンテンツでない子ブロック (コンテナ、スペーサー、カラムなど) は、リストビューから消え、キャンバス上でクリックできず、完全に編集できません。
  • インスペクタにはすべての「コンテンツ」子ブロックのリストが表示されます。このリストでブロックをクリックすると、そのブロックの設定パネルが表示されます。
  • メインのリストビューには、コンテンツブロックのみが表示され、実際の入れ子に関係なく、すべて同じレベルで表示されます。
  • コンテンツをロックされたコンテナ内の子ブロックは、自動的に移動、削除がロックされます。
  • 追加の子ブロックは挿入できず、デザインとレイアウトを保持します。
  • ブロックツールバーに「修正」へのリンクがあり、ユーザーはオン、オフを切り替えて、より広範なデザインツールにアクセスできます。現在のところプログラムでは、このオプションを削除できません。

このオプションは、カラム、カバー、グループブロックに加え、block.json 内に templateLock 属性を持つサードパーティ製ブロックにも適用できます。この機能を採用するには、"templateLock": "contentOnly"を使用する必要があります。この機能を実装したパターンの例を挙げます。詳細については関連するドキュメントを参照してください。

注:コンテンツロックを管理する UI はなく、コードレベルで管理する必要があります。

Top ↑

ロック機能を制御する権限の変更

エージェンシーとプラグイン作成者は、ブロックのロックとロック解除の権限を持つユーザーを制限することで、さらにカスタマイズした体験を提供できます。デフォルトでは管理者であれば誰でもブロックをロックし、またロックを解除できます。

開発者は block_editor_settings_all フックにフィルターを追加して、ブロックのロックに関する権限を設定できます。 このフックはコールバック関数に2つのパラメータを渡します。

  • $settings – エディタの構成可能な設定の配列。
  • $context – WP_Block_Editor_Context のインスタンス。現在のエディターに関する情報を含むオブジェクト。

具体的には、開発者は $settings['canLockBlocks'] の値を true または false に設定することで変更できます。一般には1つ以上の条件チェックを実行した上で、設定します。

次の例では、ページを編集中、すべてのユーザーのブロックロックの権限を無効化しています。

add_filter( 'block_editor_settings_all', function( $settings, $context ) {
	if ( $context->post && 'page' === $context->post->post_type ) {
		$settings['canLockBlocks'] = false;
	}

	return $settings;
}, 10, 2 );

もう1つの一般的なユースケースは、サイトのビジュアルデザイン (テーマの編集) を編集できるユーザーにのみブロックのロックやロック解除を許可する例です。次のコードに示すように、edit_theme_options 機能をテストするのがベストでしょう。

add_filter( 'block_editor_settings_all', function( $settings ) {
	$settings['canLockBlocks'] = current_user_can( 'edit_theme_options' );

	return $settings;
} );

開発者は、誰がブロックをロックし、解除できるかの決定に、あらゆる種類の条件チェックを利用できます。これはフィルターフックで実現可能な、ほんの一例です。

原文

最終更新日: