Gridder

The Gridder is Lay Theme's visual layout editor. You use it to build pages, projects, news posts, Deck slides and other Lay Theme layouts with rows, columns and draggable elements.

Please see the Getting Started video to learn the basics. This page explains the main parts of the Gridder and links to the detailed sections.

You can find the Gridder when you edit a page, project or another post type that supports Lay Theme layouts.

The Gridder

Layout basics

A Gridder layout is built from rows and elements. Rows create the vertical structure of the page. Elements are the actual content inside those rows, for example images, text, videos, thumbnail grids, tables, accordions or custom HTML.

Elements can be resized, moved across columns and stacked inside browser-filling rows. Selecting an element opens its settings in the sidebar, where you can adjust spacing, opacity, borders, shadows, aspect ratios, scroll animations and phone-specific settings.

Gridder Elements

Use Gridder Elements to learn what each element does and when to use it. The important element groups are "+Image", "+Video", "+WooCommerce" and "+More". You can choose which buttons are visible in "Lay Options" → "Gridder Buttons to show".

Gridder Rows

Use Gridder Rows to learn about row background images, row background videos, browser-filling rows, row gutters and row background colors. Most row settings are available by right-clicking an empty part of a row.

Gridder Defaults

Use Gridder Defaults to set the defaults that new layouts start with, like frame settings, row gutters and column gutter behavior. Defaults are especially helpful when you want a consistent layout rhythm across many pages or projects.

Phone layouts

Many element settings have a phone tab in the sidebar. If you need a completely different mobile arrangement, activate Custom Phone Layouts and create a separate phone layout from the Gridder.