Display a post’s featured image.
Previously “Post featured image” block.
This block is available in the latest version of WordPress and does not require the Gutenberg plugin.
Category: Theme
For developers
Block Grammar & Markup
<!-- wp:post-featured-image /-->
Context
Context is used to pass values from a block to a descendant block; for example, a query and post template passing the query ID to the inner blocks.
Uses context. Optional. Type: Object.
[
"postId",
"postType",
"queryId"
]Block Attributes
Optional. Type: Object.
Attributes provide the structured data needs of a block. They can exist in different forms when they are serialized, but they are declared together under a common interface.
{
"isLink": {
"type": "boolean",
"default": false
},
"aspectRatio": {
"type": "string"
},
"width": {
"type": "string"
},
"height": {
"type": "string"
},
"scale": {
"type": "string",
"default": "cover"
},
"sizeSlug": {
"type": "string"
},
"rel": {
"type": "string",
"attribute": "rel",
"default": ""
},
"linkTarget": {
"type": "string",
"default": "_self"
},
"overlayColor": {
"type": "string"
},
"customOverlayColor": {
"type": "string"
},
"dimRatio": {
"type": "number",
"default": 0
},
"gradient": {
"type": "string"
},
"customGradient": {
"type": "string"
},
"useFirstImageFromPost": {
"type": "boolean",
"default": false
}
}Block Supports
Optional. Type: Object.
A set of options that enables or disables block controls in the editor, for example gradient colors or padding.
{
"align": [
"left",
"right",
"center",
"wide",
"full"
],
"color": {
"__experimentalDuotone": "img, .wp-block-post-featured-image__placeholder, .components-placeholder__illustration, .components-placeholder::before",
"text": false,
"background": false
},
"__experimentalBorder": {
"color": true,
"radius": true,
"width": true,
"__experimentalSelector": "img, .block-editor-media-placeholder, .wp-block-post-featured-image__overlay",
"__experimentalSkipSerialization": true,
"__experimentalDefaultControls": {
"color": true,
"radius": true,
"width": true
}
},
"html": false,
"spacing": {
"margin": true,
"padding": true
},
"interactivity": {
"clientNavigation": true
}
}