Featured Content

Last modified: January 25, 2024

link Block names

t2/featured-content-layout
t2/featured-query-post
t2/featured-single-post

A featured content post template is made up of a list of blocks. Any block can be used in a template.

Here’s an example of a template:

<!-- wp:t2/post-link -->
	<!-- wp:t2/post-featured-image /-->
	<!-- wp:group {"align":"full","layout":{"inherit":false}} -->
		<div class="wp-block-group alignfull">
			<!-- wp:t2/post-title /-->
		</div>
	<!-- /wp:group -->
<!-- /wp:t2/post-link -->

The default template can customized by add templates to a t2/featured-content folder in the theme. The templates should be structured like so:

theme
|-- style.css
|-- functions.php
|-- t2
    |-- featured-content
        |-- default.html
        |-- post-type-{my-post-type-name}.html

link Changing allowed inner blocks

Changing the allowed blocks in the featured content layout can be done in t2.json. Return the names of blocks you want to allow.

Default: [t2/featured-query-post, t2/featured-single-post]

"t2/featured-content-layout": {
	"allowedBlocks": [
		"core/cover",
		"core/paragraph",
		"t2/featured-query-post",
		"t2/featured-single-post"
	]
}

link Changing allowed grid sizes

Changing the allowed grid sizes in the featured content layout can be done in t2.json. Add a number array of with allowed columns in a 12 grid system (ex 6 columns = 50%), or/and a number array of allowed rows.

Default columns: [4, 8, 12]
Default rows: [1, 2]

"t2/featured-content-layout": {
	"allowedColumns": [ 4, 6, 8, 12 ],
	"allowedRows": [ 1, 2, 3 ]
}

link Styles

link Column and row gap

{
	"settings": {
		"custom": {
			"t2/featuredContentLayout": {
				"spacing": {
					"columnGap": "1rem",
					"rowGap": "1rem"
				}
			}
		}
	}
	...
}

link Single block gap

This needs to be a single value since it is used in calculations. This can not be used as shorthand for column and row.

{
	"settings": {
		"custom": {
			"t2/featuredContentLayout": {
				"spacing": {
					"gap": "1rem"
				}
			}
		}
	}
	...
}

link Properties (t2.json)