Beaver builder themer styles applied to multiple rows

Author Posts



Is it possible to save style with BB themer which can be saved and reused in multiple pages?



Hey Jasmin,

But do you mean you want to create a reusable module that will appear on multiple pages, and you want to the style changes you make with Microthemer to apply no matter which page the module appears on?

In which case, yes. I would recommend adding a custom class to the module/row that contains the reusable content. Microthemer will pick up on this parent class when suggesting selectors for the content contained within e.g.:

.custom-class h3
.custom-class .fl-node-12345
.custom-class .icon

Although the .custom-class prefix often won’t be included in the default selector suggestion Microthemer suggests. So you would need to display the advanced settings in targeting mode and then use the dropdown menus on the Targeting suggestions tab to find the selector that targets the element(s) you want and also includes the .custom-class prefix.

In the example selectors above, I suggested a .custom-class .fl-node-12345 example. In actual fact, you might want to avoid these selectors with node numbers in them. Because Beaver builder changes these numbers in these classes for each instance of the module, your Microthemer selectors will not apply globally across multiple pages.

Oh and another thing to make sure is that you disable the page-id modifier in the CSS modifiers feature, which makes all Microthemer selectors apply only to the current page you are working on. This isn’t enabled by default.

I’m offering this advice without looking at your site/use case. Please feel free to share some links if the above advice isn’t helpful.


Note: this answer was updated when I realised from your other forum post and video that the principles of changing node classes across instances of saved BB modules applies to Beaver themer too, or you are in fact using Beaver Builder.

You must login or register to reply to this topic.