block_core_image_render_lightbox()


WordPressのblock_core_image_render_lightbox()関数は、ブロックエディタ内の画像にライトボックス機能を追加するために使用されます。この関数は、画像ブロックのレンダリング時に自動的に適用され、ユーザーが画像をクリックすると拡大表示される機能を提供します。

構文

block_core_image_render_lightbox( string $block_content, array $block );

引数の説明:

  • $block_content (string) — ブロックのコンテンツを表すHTML文字列。
  • $block (array) — ブロックの属性や設定を含む配列。

例1: 基本的な使用例

この例では、画像ブロックにライトボックス機能を適用します。

add_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 10, 2 );

例2: カスタムブロックにライトボックスを追加

カスタムブロックにライトボックス機能を追加する例です。

add_filter( 'render_block_my-custom-block', 'block_core_image_render_lightbox', 10, 2 );

例3: ライトボックスの無効化

特定のブロックでライトボックスを無効にする例です。

remove_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 10 );

例4: ライトボックスのスタイル変更

ライトボックスのスタイルをカスタマイズする例です。

add_filter( 'block_core_image_render_lightbox', function( $content ) { return str_replace( 'class="lightbox"', 'class="lightbox custom-style"', $content ); } );

例5: ライトボックスのスクリプト追加

ライトボックスにカスタムスクリプトを追加する例です。

add_action( 'wp_footer', function() { echo '<script>console.log("Lightbox initialized");</script>'; } );

例6: ライトボックスの条件付き適用

特定の条件下でのみライトボックスを適用する例です。

add_filter( 'render_block_core/image', function( $content, $block ) { if ( isset( $block['attrs']['enableLightbox'] ) && $block['attrs']['enableLightbox'] ) { return block_core_image_render_lightbox( $content, $block ); } return $content; }, 10, 2 );

例7: ライトボックスのカスタムクラス追加

ライトボックスにカスタムクラスを追加する例です。

add_filter( 'block_core_image_render_lightbox', function( $content ) { return str_replace( '<img', '<img class="custom-class"', $content ); } );

注意点

  • この関数は、ブロックエディタ内の画像ブロックにのみ適用されます。
  • カスタムブロックに適用する場合は、適切なフィルターフックを使用してください。
  • ライトボックスのスタイルやスクリプトを変更する場合は、テーマやプラグインの互換性に注意してください。

関連機能：