General Questions
Do I need to use the Genesis Framework to use Genesis Custom Blocks or Genesis Custom Blocks Pro?
No. Genesis Custom Blocks and Genesis Custom Blocks Pro can be used with any theme. The only requirement is that the block editor (Gutenberg) is enabled.
Template Questions
What prefix does Genesis Custom Blocks use for custom blocks? WordPress® uses core for the blocks that come standard with WordPress (e.g. core/paragraph, core/image), so what does Genesis Custom Blocks use?1
Custom blocks built with Genesis Custom Blocks are prefixed with genesis-custom-blocks. For example, if you created a custom block with the name feature, it would be registered as genesis-custom-blocks/feature
My template outputs the value of my field, but I want to use the value as a PHP variable first, without any output.
If variables are being output, the likely cause is that you’re using block_field() instead of block_value().
You can return the value of the block without any output by using the block_value() function.
See block_value() for details about this function.
I’d like to change the template output of my block in the editor (different from the frontend).
You can create a new template called blocks/{name}/preview.php or blocks/preview-{name}.php
See Add a Custom Block to Your Website Content for more details.
I can add my block to a post, but the template doesn’t show in the editor or frontend output.
This may be happening because the template is in the wrong place and/or has the wrong name.
See Add a Custom Block to Your Website Content for information on where templates should be located and how they should be named.
I have assigned a custom CSS Class to my block in the editor. How do I output that in my template?
The CSS class can be output using block_field( 'className').
I want to include my Custom Block templates somewhere other than my theme (for example, in a plugin).
You can do this by using the genesis_custom_blocks_template_path filter.
For templates to be in a plugin’s /blocks directory, add the following code to the root of the plugin:
/**
* Gets an alternate template path.
*
* @param string $path The template path.
* @return string An alternate template path.
*/
function cb_alternate_template_path( $path ) {
unset( $path );
return __DIR__;
}
add_filter( 'genesis_custom_blocks_template_path', 'cb_alternate_template_path' );Field Questions
After using a repeater field in my template, I start having problems with the order that other posts on my site appear in.
This may be happening because the template doesn’t include the reset_block_rows() function at the end of the repeater loop.
To fix it, you can add reset_block_rows( 'repeater-slug' ); directly after the endwhile of your repeater loop.
See reset_block_rows{} for details about this function.
I am using the image field and want to output the image, but I get the URL instead.
Check to make sure you are using the correct field in your template.
For images, block_field() outputs the URL, but block_value() outputs the attachment post ID.
See Image for more details.
I want to add rich styles (bold, italic, links, etc.) to my text.
Rich text styles can be added using the Rich Text field or the Classic Text field*.
The Textarea field doesn’t support rich text.
See Rich Text for more details.
*These fields are only available with a Genesis Pro subscription.
There’s a comma between values when outputting a multi-select field.
Check to make sure you are using the correct field in your template.
For multi-select, block_field() outputs a comma separated list of selected items and block_value() outputs an array.
See Multi-Select for examples of outputting multi-select values with a different separator or format.
Function Questions
The block_value() template function only returns an ID for my Image field. How do I get the URL?
To get the image URL, you can use the wp_get_attachment_image() function, like this:
$image_id = block_value( 'image' ); // This will return the image's ID. $image_url = wp_get_attachment_image( $image_id, 'thumbnail' );
Using wp_get_attachment_image is a really handy way of getting the best image size for the job. You can even pass an array of width and height to get the most optimal image:
$image_url = wp_get_attachment_image( $image_id, array( 800, 600) );
I’m trying to use multiple repeaters, but after the first one, the rows don’t work.
This may be happening because the template doesn’t include the reset_block_rows() function at the end of the repeater loop.
To fix it, you can add reset_block_rows( 'repeater-slug' ); directly after the endwhile of your repeater loop.
See reset_block_rows() for details about this function.
Style Questions
How do I access the “Additional CSS Class” setting in my template?
This setting is saved using a pre-defined slug: className. You can output it using block_field('className') or echo block_value('className').
I’d like to change the style of my block in the editor (different from the frontend).
You can create a new stylesheet called blocks/{name}/preview.css or blocks/preview-{name}.css
See Add a Custom Block to Your Website Content for more details.
My block template shows but the styles aren’t working.
This may be happening because the stylesheet is in the wrong place and/or has the wrong name.
See Style Your Custom Blocks for information on where stylesheets should be located and how they should be named.
Can I use a shared set of styles between blocks?
Yes. You can add a global block stylesheet in {theme directory}/blocks/blocks.css. This will be loaded whenever a Custom Block is used on the page.
See Style Your Custom Blocks for more details.
Error Questions
I’m seeing the following error message: Error loading block: The response is not a valid JSON response.
The block template contains invalid PHP code. When the PHP errors in the template are fixed, this error message should disappear.