IntroductionIntroduction
A style allows you to change the appearance of one or several facets by adjusting every detail using CSS properties. It gives you control over how facets look on your page.
Styles were introduced in WP Grid Builder V2. You can learn more about styles here.
EditorEditor
In the edit style page, you’ll discover an editor comprising a top toolbar where you can choose the facet type to edit and responsive controls to adjust the appearance based on the browser width. On the right side panel, you’ll find all controls corresponding to the currently selected facet type, allowing you to style the facet display in the preview panel on the left.
The editor allows you to edit multiple facets, enabling you to apply the generated style globally. You have the freedom to create a style for one or several facets and use it either for individual facets or across your entire site. You can learn more about how to apply styles here.
SetupSetup
To add styles to a facet, start by selecting the one you want to modify from the dropdown selector in the top toolbar. Once selected, the controls will adjust according to the chosen facet. The controls panel features several expandable tabs where you can find settings to add styles such as spacings (margin, padding), typography, shadows, colors, and more.
Facets that utilize the same components, such as inputs, selects or buttons, will share styles for those shared components. This means that when you edit the style of a particular component within one facet type, the changes will be applied to all other facets using the same component. This feature can save time and prevent the need to assign the same settings repeatedly for components used in different areas.