Automatically Adding Classes to Elements in Bricks

In the Bricks Facebook group a user asks:

Default classes for theme style elements?

Is it possible to assign default classes to elements in the theme style settings?

Say I wanted all buttons added to the site to have the “class size-one” is that possible. I see in the theme style editor panel I can assign various settings like padding and define colors but is there an add on or setting that will let me assign classes to them in theme styles?

While it may not be possible to automatically add classes in the active class input for elements in the Bricks builder, we can use the bricks/element/settings filter to append our desired classes that should appear on the frontend.

Add the following in child theme‘s functions.php (w/o the opening PHP tag) or a code snippets plugin:

add_filter( 'bricks/element/settings', function( $settings, $element ) {
  if ( $element->name === 'button' ) {
      $element->attributes['_root']['class'][] = 'btn btn-primary';

  return $settings;
}, 10, 2 );

Replace btn btn-primary as needed.

Instant access to 390+ Bricks code tutorials with BricksLabs Pro

1 comment

  • Adel Raouti

    Thanks. The problem with this solution that it do not appear in the builder interface. How we can fix that?

Leave your comment