A New Class to Button Block

  • Dear Developer Team,

    I would like to add a following class to the button’s style dropdown:

    btn-outline-primary

    I put it directly Advanced > ADDITIONAL CSS CLASS(ES). This is the result:

    <a href="#" class="btn btn-outline-primary btn-primary"></a>

    Unfortunately, the btn-primary overrides my btn-outline-primary class.

    What should I do?

Viewing 1 replies (of 1 total)
  • Plugin Contributor tschortsch

    (@tschortsch)

    Hi @foldesistudio. You can add custom button styling options with the wpBootstrapBlocks.button.styleOptions JavaScript hook (see: https://github.com/liip/bootstrap-blocks-wordpress-plugin#wpbootstrapblocksbuttonstyleoptions).

    In your case this would look something like this:

    function outlinePrimaryStyleOption( styleOptions ) {
	styleOptions.push( {
		label: 'Outline primary',
		value: 'outline-primary',
		bgColor: '#ff0000',
		textColor: '#ffffff',
	} );
	return styleOptions;
}
wp.hooks.addFilter(
	'wpBootstrapBlocks.button.styleOptions',
	'myplugin/wp-bootstrap-blocks/button/styleOptions',
	outlinePrimaryStyleOption
);

    Hope this helps!

Viewing 1 replies (of 1 total)
  • The topic ‘A New Class to Button Block’ is closed to new replies.

Tags