Setting default button attributes

add_filter( 'generateblocks_default_button_attributes', function() {
    $color_settings = wp_parse_args(
        get_option( 'generate_settings', array() ),
        generate_get_color_defaults()
    );
    return [
        'styles' => [
            'display' => 'inline-flex',
            'alignItems' => 'center',
            'backgroundColor' => $color_settings['form_button_background_color'],
            'color' => $color_settings['form_button_text_color'],
            'paddingTop' => 'var(--button-padding-block, 1em)',
            'paddingRight' => 'var(--button-padding-inline, 2em)',
            'paddingBottom' => 'var(--button-padding-block, 1em)',
            'paddingLeft' => 'var(--button-padding-inline, 2em)', 
			'textDecoration'=> 'none', 
			'&:is(:hover, :focus)' => [
            	'backgroundColor' => $color_settings['form_button_background_color_hover'],
				'color' => $color_settings['form_button_text_color_hover'],
			],
    	],
		'className' => 'gb-button',
	];
} );

Several things are happening in this example:

  1. Customizer options from GeneratePress are retrieved. (lines 2-4)
  2. New GenerateBlocks button defaults are set. (lines 8-19)
  3. Some style defaults are coming from the GeneratePress Customizer options, so that (as long as you’ve referenced Global Colors) changes you make to button and text colors in the Customizer will automatically update GenerateBlocks buttons. (lines 10-11, 18-19)
  4. Some style defaults are coming from CSS variables that I defined in style.css (or the Customizer’s Additional CSS panel). I’ve also defined fallbacks (1em, 2em) just in case those CSS variables are ever deleted. (lines 12-15)
  5. A custom class gb-button is also being added to every button by default. (line 22)

Addendum: this snippet by itself would add the gb-button class to every button by default.

add_filter( 'generateblocks_default_button_attributes', function() {
	return [
		'className' => 'gb-button',
	];
} );

Leave a Comment