UI Settings

UI Settings is where you tune how the builder itself behaves — which panels sit on
which side, whether the canvas follows your selection, which editor the Rich Text
element opens. Open the builder, click the Oxygen logo in the top-left corner, and
choose Preferences. UI Settings is the first tab.

Everything on this tab is saved in your browser and applies the moment you change it —
there's no save button, and nobody else editing the site is affected. The other two
Preferences tabs, Custom Fonts and Breakpoints,
work the other way around: they're site-wide and they have a save button.

Settings

Auto-scroll to active element — on by default. The canvas scrolls to whatever you
select, wherever you select it from, so picking an element in the Structure panel brings
it into view. Turn it off if you'd rather the canvas stayed put.

Scale content to fit the screen (zoom) — on by default. When the breakpoint you're
editing is wider than the canvas area, the canvas is zoomed out so the whole width
fits. It only ever scales down, so a narrow breakpoint like Phone Portrait is still
shown at its real size. With it off, the canvas stays at actual size and the canvas
area scrolls horizontally instead. Cmd/Ctrl + Shift + S toggles it without opening
Preferences.

Disable Message For Empty SSR Elements — off by default. Some elements are rendered
by PHP on the server, and when one comes back empty the builder shows a placeholder
message in its place so you don't see a hole where an element should be. Turn this on
to hide that message.

Show elements ID in the Structure Panel — off by default. Adds each element's ID to
its row in the Structure panel, which is useful when you're writing custom CSS or
linking to an anchor.

Disable Code Editor Line Wrapping — off by default. Long lines in Oxygen's code
editors wrap by default; turn this on and they scroll horizontally instead.

Prefer TinyMCE For Rich Text — on by default. Decides which editor the Rich Text
element opens: TinyMCE, the same editor the WordPress classic editor uses, or Oxygen's
own. One exception you can't override here — a rich text field that supports variables
always opens Oxygen's editor, whichever way this is set.

Include Custom Breakpoints in Breakpoint Dropdowns — off by default. Some element
settings take a breakpoint as their value rather than being set per breakpoint —
"stack below this breakpoint", for example. Those dropdowns list only the built-in
breakpoints unless you turn this on. Turning it on shows a link to the limitations that
apply; read it before you rely on the setting, and note that individual controls can
still opt out.

Disable Custom Unit Dropdown — off by default. Numeric inputs offer a custom unit,
which swaps the number field for a free-text one where you can type a whole CSS value —
calc(100svh - 50px), for instance. Turn this on and that free-text field is disabled,
so nobody can type or edit a custom value. Values already saved as custom stay as they
are.

Default Unit Type — px by default. The unit a numeric input starts on before you
choose one. The choices are px, %, em, rem, vw, vh, svw, svh, auto
and custom.

Remember Last Tab Per Element — off by default. The Element Properties panel has
Content, Design and Settings tabs. By default the panel keeps one active tab for
everything, so selecting a new element leaves you on the tab you were already using.
Turn this on and each element remembers the tab you left it on.

Panel Positions

The builder's panels open on the left or the right, and each one remembers its own
side. Set them here.

Out of the box, Add and Structure open on the left, and Element Properties,
History & Revisions, Variables and Selectors open on the right. Changing a
panel's side takes effect immediately: the panel is reopened on its new side so you can
see the result.

Reset to defaults puts every panel back on its default side.

Popout Position

The last control in the Panel Positions group has nothing to do with panels. Some
controls open in a popout rather than expanding in place, and a popout can open another
popout. This setting decides where those nested popouts go:

• Stacked — a nested popout covers its parent, anchored to the parent's header and
  offset slightly so you can see how deep you are.
• Stacked (First Visible) — the first nested popout opens to the right of its
  parent, so the parent stays readable; anything deeper stacks.
• Side By Side — every nested popout opens to the right of its parent.

The first popout you open is always placed against the control that opened it — this
setting only affects what happens from the second level down.