WordPressのブロック一覧です。『メディア』に入っているものです。WordPressバージョンは 6.8.2 です。
画像
<!-- wp:image {"id":13,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-1024x727.webp" alt="" class="wp-image-13"/></figure>
<!-- /wp:image -->
ギャラリー
<!-- wp:gallery {"linkTo":"none"} -->
<figure class="wp-block-gallery has-nested-images columns-default is-cropped"><!-- wp:image {"id":13,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-1024x727.webp" alt="" class="wp-image-13"/></figure>
<!-- /wp:image -->
<!-- wp:image {"id":15,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coral-square.webp" alt="" class="wp-image-15"/></figure>
<!-- /wp:image --></figure>
<!-- /wp:gallery -->
ギャラリーは画像を複数入れられます。上の例では2つ挿入しています。
音声
<!-- wp:audio {"id":16} -->
<figure class="wp-block-audio"><audio controls src="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/sample.wav"></audio></figure>
<!-- /wp:audio -->
カバー
<!-- wp:cover {"url":"https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-1024x727.webp","id":13,"dimRatio":50,"customOverlayColor":"#5f6968","isUserOverlayColor":false,"sizeSlug":"large","layout":{"type":"constrained"}} -->
<div class="wp-block-cover"><img class="wp-block-cover__image-background wp-image-13 size-large" alt="" src="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-1024x727.webp" data-object-fit="cover"/><span aria-hidden="true" class="wp-block-cover__background has-background-dim" style="background-color:#5f6968"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"タイトルを入力...","fontSize":"large"} -->
<p class="has-text-align-center has-large-font-size"></p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover -->
画像に重ねてテキストを表示できます。
ファイル
<!-- wp:file {"id":13,"href":"https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-scaled.webp"} -->
<div class="wp-block-file"><a id="wp-block-file--media-14f62391-3a35-44c2-8949-7f460f11e3db" href="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-scaled.webp">coming-soon-bg-image</a><a href="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-scaled.webp" class="wp-block-file__button wp-element-button" download aria-describedby="wp-block-file--media-14f62391-3a35-44c2-8949-7f460f11e3db">ダウンロード</a></div>
<!-- /wp:file -->
ファイルへのリンクがボタンで表示されます。
メディアとテキスト
<!-- wp:media-text {"mediaId":13,"mediaLink":"https://php4wordpress.calculator.jp/2025/09/17/%e3%83%a1%e3%83%87%e3%82%a3%e3%82%a2/coming-soon-bg-image/","mediaType":"image"} -->
<div class="wp-block-media-text is-stacked-on-mobile"><figure class="wp-block-media-text__media"><img src="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/coming-soon-bg-image-1024x727.webp" alt="" class="wp-image-13 size-full"/></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"コンテンツ…"} -->
<p></p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text -->
画像とテキストを横並びで表示します。初期配置は「画像左テキスト右」ですが、「テキスト左画像右」も設定可。
動画
<!-- wp:video {"id":18} -->
<figure class="wp-block-video"><video src="https://php4wordpress.calculator.jp/wp-content/uploads/2025/09/sample.mp4"></video></figure>
<!-- /wp:video -->
更新日:
