Attributes for Blocks

FAQ

属性を追加するにはどうすればよいですか ?

選択したブロックのインスペクターコントロール (ブロックの設定) で、一番下までスクロールし、「詳細設定」をクリックします。すると、「追加属性」という項目があるはずです。
「属性の追加」フィールドに属性名を入力し「追加」を押すと、ブロックに属性が追加され、その下にその属性名がラベルされた新しい入力欄が追加表示されます。そこにオプションとしての属性値を挿入できます。
属性の例： style, title, target, class, id, onClick, data-*, aria-*.

どのように機能しますか ?

通常ブロックの場合、属性はブロック保存コンテンツのルート要素に追加されます。つまり、属性はフロントエンドでのみレンダリングされ、エディターではレンダリングされません。ダイナミックブロックの場合、属性は render_callback 関数を介して追加され、ブロックがサーバー側、もしくはクライアント側のどちらでレンダリングされるかに応じて、エディターでも適用される場合があります。

すべてのブロックで機能しますか ?

blocks.getSaveContent.extraProps フィルタを利用できる WP Element をレンダリングする通常ブロックと、render_callback を利用するダイナミックブロックで動作するはずです。オーソドックスでないことをするサードパーティ製のブロックは、動作しないことがあります。
既知の未サポートブロック

Usage with Alpine.js

@ prefix in an attribute name is used for “override” mode in this plugin, for Alpine.js attributes use x-on:click instead of @click or use the shorthand syntax with two @ characters instead of one: @@click.

ブロックサポートを無効にする

afb_unsupported_blocks フィルターを子テーマの functions.php ファイルで使用し、追加属性を追加するためのブロックサポートを無効にできます。

add_filter('afb_unsupported_blocks', function($blocks) {
    $blocks[] = 'core/button';
    return $blocks;
});

無効にするとどうなりますか ?

カスタム属性を付加したブロックは、追加した属性によっては無効となる場合があります。その場合、「ブロックのリカバリーを試行」をクリックでカスタム属性を除いたブロックを復元、「HTML に変換」を選択すればカスタム属性を含むブロックを HTML として保持できます。ブロックが無効になるリスクを回避したい場合は、プラグインを無効にする前にすべてのカスタム属性を削除する必要があります。