get_block_core_post_featured_image_overlay_element_markup()


WordPressのget_block_core_post_featured_image_overlay_element_markup()関数は、ブロックエディタで使用される関数で、投稿のアイキャッチ画像にオーバーレイ要素を追加するためのマークアップを生成します。

構文

get_block_core_post_featured_image_overlay_element_markup( int $post_id, array $attributes );

引数の説明:

  • $post_id(int) — オーバーレイを追加する投稿のID。
  • $attributes(array) — オーバーレイのスタイルやクラスなどの属性を指定する配列。

例1: 基本的なオーバーレイの追加

この例では、投稿のアイキャッチ画像にデフォルトのオーバーレイを追加します。

<?php echo get_block_core_post_featured_image_overlay_element_markup( get_the_ID(), array() ); ?>

例2: カスタムクラスの追加

オーバーレイにカスタムクラスを追加する例です。

<?php echo get_block_core_post_featured_image_overlay_element_markup( get_the_ID(), array( 'class' => 'custom-overlay' ) ); ?>

例3: 背景色の指定

オーバーレイの背景色を指定する例です。

<?php echo get_block_core_post_featured_image_overlay_element_markup( get_the_ID(), array( 'style' => 'background-color: rgba(0, 0, 0, 0.5);' ) ); ?>

例4: テキストの追加

オーバーレイにテキストを追加する例です。

<?php echo get_block_core_post_featured_image_overlay_element_markup( get_the_ID(), array( 'content' => '注目の投稿' ) ); ?>

例5: カスタムスタイルの適用

オーバーレイにカスタムスタイルを適用する例です。

<?php echo get_block_core_post_featured_image_overlay_element_markup( get_the_ID(), array( 'style' => 'padding: 20px; font-size: 18px;' ) ); ?>

例6: 複数の属性を組み合わせる

複数の属性を組み合わせてオーバーレイをカスタマイズする例です。

<?php echo get_block_core_post_featured_image_overlay_element_markup( get_the_ID(), array( 'class' => 'custom-overlay', 'style' => 'background-color: rgba(255, 0, 0, 0.3);', 'content' => '注目の投稿' ) ); ?>

例7: 投稿IDを動的に指定

動的に投稿IDを指定してオーバーレイを追加する例です。

<?php echo get_block_core_post_featured_image_overlay_element_markup( $post->ID, array( 'class' => 'dynamic-overlay' ) ); ?>

注意点

  • この関数はブロックエディタ内で使用することを想定しています。テーマやプラグインで使用する場合は、適切なコンテキストで使用してください。
  • $attributesの内容によっては、意図しないスタイルが適用される可能性があるため、テスト環境で確認することを推奨します。

関連機能: