Global layout

Global layout

Customize > General > Global Layout

This section holds the settings that apply everywhere: how wide the site is, how rounded its corners are, and two small conveniences, a page loader and a scroll-up button. Per-content-type layout (sidebar position, grid columns) lives under Content Layouts instead, and this section’s description says so.

Site width

Site Layout switches the whole site between full width and a boxed container. Pick the style with the radio image, then set its width:

• Site Container Width sets the width of the full-width layout’s inner container, in px or percent. Default is 1170px.
• Site Box Layout Container Width sets the width of the boxed layout, and only appears when Site Layout is set to boxed. Default is also 1170px.

Both accept px or %, so you can build a fluid layout instead of a fixed one.

Site Sidebar Width sets how wide the sidebar is when a page has one, default 28.125%. This is one shared setting: whether the sidebar sits on the left or right, or whether a content type has one at all, is chosen per content type under Content Layouts, not here.

Sticky Sidebar keeps the sidebar in view as a visitor scrolls past it, rather than letting it end where its content ends. On by default.

Corner radius

Three separate radius controls apply to different parts of the theme:

• Border Radius Value is the general radius, default 8px.
• Button Radius Value sets the radius on buttons specifically, default 6px.
• Form Radius Value sets the radius on form elements (inputs, selects, textareas), default 6px.

Keeping buttons and forms as separate controls means you can give buttons a pill shape while keeping form fields square, or the reverse, without one choice forcing the other.

Site loader

Site Loader shows a loading animation while the page content loads. It is off by default. Turn it on and two more controls appear:

• Loader Icon picks from six built-in animation styles.
• Loader Background Color sets the color behind the loader while it displays.

A loader adds a moment of animation before the page is interactive. Use it if your brand wants that moment; skip it if you would rather the page appear as fast as possible.

Scroll-up button

Site Scroll Up shows a button that returns visitors to the top of the page. Off by default. Once enabled:

• Site Scroll Up Style picks between two visual styles.
• Scroll Up Position sets left or right, and only applies to Style 1.

This is worth turning on for any page-length content: long blog posts, long product listings, long profile pages.

When to change these

Change container widths when your brand wants a narrower or wider reading measure than the 1170px default. Change the radius values together if you want a squared-off look instead of the default soft corners, since leaving one radius at its default while changing the others can look inconsistent. Leave the loader and scroll-up controls at their defaults unless you have a specific reason to add them: most sites do not need a loader, and the scroll-up button matters more as your pages get longer.