Currently, I’m using enqueue_block_editor_assets to conditionally load styles for my custom template with get_page_template_slug. This works great on the frontend and the page editor. However, in the template chooser, the styles are not applied. I understand that this is because the rendering for the template chooser occurs client side and not server side so a method like get_page_template_slug is not going to be called as you navigate through the template chooser.

I’ve tried embracing theme.json to apply styles there instead of enqueueing assets with css the old way. However, I can’t find a way to include styles that only target my custom template.

Can you help me find a way to add custom template styles in the template chooser? Thanks!

function applyOverlineStyle(props, blockType, attributes) {
	if( ! enableOverlineColorOnBlocks.includes( blockType.name ) ){
		return props;
	}
	
	const { overlineColor, customOverlineColor } = attributes;

	props.style = {
		...props.style,
		'--wp--custom--overline-color': overlineColor
					? var( --wp--preset--color--${ overlineColor } )
				: customOverlineColor,
	}
	
	return props;
}

addFilter(
	'blocks.getSaveContent.extraProps',
	'pinwheel/overline-apply-style',
	applyOverlineStyle
)

How should I be adding the style to the paragraph?

Basically it appears that these blocks are trying to revert to their default settings. The thumbnails in the post grids and post carousels also seem to distort to a much taller height than I intended. These issues did not appear during the site building stage, and only came up after I took the site live and updated EB to 4.0.6.

I’ve faced some difficulties replicating the errors across different browsers and devices. My observations are that loading the site on new browsers or incognito mode gives the issue with the EB blocks, but the issue appears resolved if I load the site on an existing browser. I’ve also discovered that re-saving the page template on the WP full site editor and reloading fixes the issue on new browsers and incognito mode, but subsequent windows still give the error. These errors appear on Desktop, Tablet, and Mobile browsers.

The errors first appeared on all of my pages where EB is used, but currently only the Front Page features the error while the other pages seems to have stabilised, but I don’t know if it will return.

I’ve included screenshots of the error and the correct layout in an imgur album linked here: https://imgur.com/a/KPQURVf

Hope to get a response!

I’m not well-versed with going “under the hood” with WordPress but I’ve got v6.0.1 installed and, in my block editor, when I use a paragraph block and place a hyperlink onto a piece of text, due to the color styles of my theme, the link is the same color as my background and so is practically invisible.

I am looking for a means to edit the baseline styles of the paragraph block (or the link color in general) in the Gutenberg editor.

I saw the documentation about a theme.json file but I’m not sure how to invoke this rule in that file or if that’s the file I want to be editing. Perhaps there’s another section of the site where I can add a CSS rule but not sure what that rule would look like.

Anybody want to teach a man to fish? Point me in the right direction and help me to figure out how to customize styles in the block editor?

Thanks a lot,

Is it somehow possible (to reorder the appearance of the custom FOrmats styles) within the TinyMCE Custom Styles settings interface?

Is there a file which is storing the custom styles I’ve created which I can manually order?