Breakdance allows you to customize the Builder’s User Interface (UI) via Settings > Preferences.
Settings
- Auto-scroll to active element: Toggle whether an element is scrolled to in the Builder when it is active.
- Scale content to fit the screen (zoom): Decide if the content within the Preview Window is scaled to fit the current screen and adjust the screen’s size for open panels.
- Dark Mode: Enable Breakdance’s Dark Mode for the Builder
- Show Experimental Elements: Show elements that are marked experimental. Using experimental elements may or may not work and support is not provided for them.
- Disable Messages For Empty SSR Elements: If an element doesn’t have an SSR.php file, hide the warning in the Builder.
- Show Elements ID in the Structure Panel: Display each element’s ID within the Structure panel.
- Disable Code Editor Line Wrapping: Turn off line wrapping when using a custom code control.
- Prefer TinyMCE For Rich Text: Toggle whether the TinyMCE editor is used or the default Breakdance Rich Text editor.
- Include Custom Breakpoints in Breakpoints Dropdown: Allows for Custom Breakpoints to be used in Breakpoints Dropdown. See Limitations.
- Enable Experimental Page Navigation: This experimental option will keep Breakdance’s UI visible while changing pages or templates using the Quick Navigator.
Panel Positions
You can choose to change where panels show when using Breakdance.
- Add, Element Properties, Selectors, Global Settings, Structure, History & Revisions: Choose whether each panel is displayed on the left or right of the Builder.
- Popout Position: Choose how Popout controls display
- Stacked: Each Popout control is on top of one another from where the Popout is clicked.
- Stacked (First Visible): The first Popout is next to where the Popout control is clicked and all other Popouts are placed on top of the first Popout.
- Side By Side: Popouts are always placed next to the previous Popout so they are never on top of one another.
