Avoiding Site Builder CSS and HTML duplication

Avoiding Site Builder CSS

Our Site Builder adds some markup (classes, IDs, etc) to certain elements within the pages. You should avoid adding your own CSS styles to these elements directly as those can adversely effect the Site Builder editing of those pages.

If you do want to use these classes for your own custom styles, then you should add styles to child elements of these instead of directly to these elements.

Correct

Incorrect

.sb-formbuilder form {

/* styles here */ }

.sb-formbuilder {

/* styles here */ }

Avoiding duplication of Site Builder HTML element classes

Our Site Builder adds HTML around the various Modules and Widgets that you add to the page. Examples of the HTML and class names can be found here:

pageSite Builder Markup

You should avoid using those same classes and should not copy entire blocks of HTML from a current page into a new HTML widget on the page without first checking to make sure none of the reserved HTML elements are present.

Otherwise, after adding this code to the site, it can negatively impact the behavior of the Site Builder.

Last updated