Skip to main content

​
Other page builders

Vara SaaS detects three page builders besides Elementor and steps aside for them too.

​
Supported builders

When any of these are present on a page with content, the theme removes its container, page title, sidebar, and breadcrumbs, and lets the builder render full width — exactly as it does for Elementor.

​
What works the same

Full-bleed layout

Container, theme h1, sidebar, and breadcrumbs are removed on detected pages.

Header and footer retained

Your site chrome stays in place and is styled from the Customizer.

Dark mode

The token layer applies. Hardcoded colors inside builder content will not remap — that is up to the builder.

Body classes

vara-elementor-active and vara-saas-builder-page are added, so you can target builder pages in custom CSS.

​
What does not work

No brand color or font injection. With Beaver Builder, Divi, or Bricks, you must set your brand colors and fonts inside that builder’s own global settings. The theme’s Customizer controls the theme’s own components — header, footer, blog, single posts — and will not restyle your builder content.
This is the practical difference between Elementor and the others in this theme:

​
Theme Builder equivalents

Elementor Theme Builder, Beaver Builder’s Theme Builder, Divi’s Theme Builder, and Bricks’ template system will not attach their header or footer templates. None of these are registered locations. The theme’s PHP header and footer always win.If you need a custom header or footer, you need a child theme. See Child themes.

​
Choosing between builders

​
Verifying detection works

1

Build your page

Save it with your builder, not just preview it.
2

Check the body class

View source and look for vara-saas-builder-page on the body element.
3

Assign the template as a fallback

Set the page’s template to Page Builder Full Width under Page Attributes. This guarantees full width regardless of whether detection succeeds. See Page templates.

​
Troubleshooting

Detection failed. Assign Page Builder Full Width to the page — that works regardless of the builder.
Expected. Only Elementor receives injected global colors. Set your brand colors in your builder’s own global settings.
Hardcoded colors in your builder content will not remap. Use the builder’s global settings or theme-aware classes instead of hardcoded hex values.

Elementor

The fully integrated option.

Block editor

No builder at all.