Style Variations

The Style Variations page lists all defined Variations for a selected Site Page element (e.g. Variations for Site Page Widgets).

• Click the + Add Variations button (near the top-right) to add a new Variation. Enter a descriptive Title and type/paste the CSS Declarations, then Save.
• Click Edit to change the Title and/or Declarations of an existing Variation.
• Click the Trash Can icon to delete a Variation that you no longer want. Any Widget that used to apply that Variation would be reset to the "None" variation that adds no custom CSS Declarations.

After defining one or more style variations, you can edit a Site Page that has at least one Widget on the page. On each Widget (in its title bar that's shown only while editing a site page) you'll see a "leaf" icon near the upper-right. Clicking that Style Variations leaf icon will display a picker with all "Style Variations for Site Page Widgets." A red-dotted-line shows around the Style Variation that's currently-applied to the Widget, and you can apply a different Style Variation by clicking it.

NOTE: See the Styles help page for general notes about editing CSS.