wpmark/php-block-styles.php

## readme.md

      
    Raw
  

              readme.md
            
          
    Register block styles with PHP

You can now register different styles for WordPress blocks using PHP - no Javascript needed! Use the code here, either in your themes functions.php file or a plugin.
The name paramter forms part of the CSS class that is added to the block. Don't forget, this is all that block styles do, they had an additional class which then allows you to style them in a different way.
The class will take the form of is-style-{NAME}. So in the example here, when the "EyeBrow" style is applied to a heading, that heading block would have the class of is-style-eyebrow.

  
## php-block-styles.php
<?php
/**
 * Register some default block editor styles for this block.
 */
function hd_register_block_styles() {

	// add the small image style.
	register_block_style(
		'core/heading', // name of your block
		array(
			'name'  => 'eyebrow', // part of the class that gets added to the block.
			'label' => __( 'Eyebrow Heading' ),
		)
	);

}

add_action( 'init', 'hd_register_block_styles' );
	<?php
	/**
	* Register some default block editor styles for this block.
	*/
	function hd_register_block_styles() {

	// add the small image style.
	register_block_style(
	'core/heading', // name of your block
	array(
	'name' => 'eyebrow', // part of the class that gets added to the block.
	'label' => __( 'Eyebrow Heading' ),
	)
	);

	}

	add_action( 'init', 'hd_register_block_styles' );