> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.maglr.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Getting started with grid mode

|| Grid mode is in beta and available in selected accounts only.

Grid mode is one of the two ways to build a scene in the Maglr editor. In a grid scene, content sits in rows and columns and adapts to the screen: when a text gets longer or shorter while you finalise your copy, the content around it moves along, and the mobile version is generated for you. In a freeform scene, you position every element yourself, so content that changes size can overlap other elements. This article explains what a grid scene is and the steps to a first published grid page.

## Grid scene basics

A grid scene is a scene whose content snaps to a column grid and stacks from top to bottom, instead of being placed freely. The scene grows taller as you add content.

Content in a grid scene is organised in three levels:

* **Rows** — horizontal bands across the page. A row holds elements directly, or holds columns.
* **Columns** — side-by-side slots inside a row. A column holds elements.
* **Elements** — the content itself: text, images, videos, buttons and so on.

![A selected row in a grid scene with two columns, a video and a heading, over the blue bands of the column grid](https://storage.crisp.chat/users/upload-1/plugin/-/4/b/a/a/4baaf9a6d64adc00/1-01-grid-scene_1bgau63.png =1000xauto)

You don't have to create rows and columns yourself. When you place an element on the page, it gets its own row. When you place an element beside another one, it is placed next to it, and columns are created when they are needed.

For the full explanation, see [Rows, columns and elements](https://help.maglr.com/en/article/rows-columns-and-elements-1b9y9uh/).

## Grid scenes and freeform scenes

Every scene in the editor is either a grid scene or a freeform scene. You choose this when you create the scene, and it can't be changed afterwards. One page can hold both grid scenes and freeform scenes.

Which scenes you can create depends on your license:

* **Advanced and Enterprise licenses** — grid scenes and freeform scenes.
* **Basic license** — grid scenes only, in the Build view.

Which one to choose:

* **Grid** — for building fast and clean: the layout adapts to every screen automatically.
* **Freeform** — for pixel-precise control and advanced animations, such as a scroll path.

## Your view decides what you can do

What you can do in a grid scene depends on your view in the editor: **Design**, **Build** or **Content**. Your role and your license decide which view you get. For example, on a Basic license you work in the Build view.

Some grid mode articles have a section for one view only, under a heading such as "In the Build view". For what each view can do, see [Roles and views in the editor](https://help.maglr.com/en/article/roles-and-views-in-the-editor-13gasx2/).

## Making your first grid page

These are the steps from an empty page to a published grid page. Each step links to the article that explains it.

1. Add a grid page from your project's overview in the dashboard, or open an existing page in the editor and add a grid scene with `Add scene`. See [Create a grid scene](https://help.maglr.com/en/article/create-a-grid-scene-pbot58/).
2. Optionally, set the scene's height. See [Grid scene settings](https://help.maglr.com/en/article/grid-scene-settings-x7ftdk/).
3. Add content by dragging elements and building blocks onto the page, or with the `+` on the canvas. See [Add elements and building blocks](https://help.maglr.com/en/article/add-elements-and-building-blocks-1oleumf/).
4. Arrange the content: move it, put things side by side, change widths. See [Arrange content in the Build view](https://help.maglr.com/en/article/arrange-content-in-the-build-view-bj1tw2/) or [Select, move and resize in the Design view](https://help.maglr.com/en/article/select-move-and-resize-in-the-design-view-3o1az1/).
5. Edit the text. See [Edit text in a grid scene](https://help.maglr.com/en/article/edit-text-in-a-grid-scene-kmko07/).
6. Add backgrounds where needed. See [Backgrounds in a grid scene](https://help.maglr.com/en/article/backgrounds-in-a-grid-scene-110f7ef/).
7. Check and adjust the mobile version. See [Edit the mobile version of a grid scene](https://help.maglr.com/en/article/edit-the-mobile-version-of-a-grid-scene-1795qwu/).
8. Preview and publish. Grid pages are previewed and published the same way as any other page. See [Preview & test your project](https://help.maglr.com/en/article/preview-test-your-project-1g0k0my/) and [Publish your project live](https://help.maglr.com/en/article/publish-your-project-live-cxy0n/).

## All grid mode articles

**For everyone**

* [Roles and views in the editor](https://help.maglr.com/en/article/roles-and-views-in-the-editor-13gasx2/)
* [Create a grid scene](https://help.maglr.com/en/article/create-a-grid-scene-pbot58/)
* [Grid scene settings](https://help.maglr.com/en/article/grid-scene-settings-x7ftdk/)
* [Rows, columns and elements](https://help.maglr.com/en/article/rows-columns-and-elements-1b9y9uh/)
* [Add elements and building blocks](https://help.maglr.com/en/article/add-elements-and-building-blocks-1oleumf/)
* [Backgrounds in a grid scene](https://help.maglr.com/en/article/backgrounds-in-a-grid-scene-110f7ef/)
* [Edit text in a grid scene](https://help.maglr.com/en/article/edit-text-in-a-grid-scene-kmko07/)
* [Card list and Card slider](https://help.maglr.com/en/article/card-list-and-card-slider-1jqidwd/)
* [Edit the mobile version of a grid scene](https://help.maglr.com/en/article/edit-the-mobile-version-of-a-grid-scene-1795qwu/)

**Build view**

* [Arrange content in the Build view](https://help.maglr.com/en/article/arrange-content-in-the-build-view-bj1tw2/)

**Design view**

* [Select, move and resize in the Design view](https://help.maglr.com/en/article/select-move-and-resize-in-the-design-view-3o1az1/)
* [Layout types and position settings](https://help.maglr.com/en/article/layout-types-and-position-settings-25u81/)

**Content view**

* [Edit content in the Content view](https://help.maglr.com/en/article/edit-content-in-the-content-view-m6cbjw/)

## Frequently asked questions

### Can I change a freeform scene into a grid scene?

No. A scene is a grid scene or a freeform scene from the moment you create it, and this can't be changed later. To use grid mode, add a new grid scene and rebuild the content there. See [Create a grid scene](https://help.maglr.com/en/article/create-a-grid-scene-pbot58/).

### Can I use grid mode on a Basic license?

Yes. On a Basic license you build grid scenes in the Build view, using Maglr's ready-made templates, building blocks and elements. Freeform scenes are not available on a Basic license. See [Roles and views in the editor](https://help.maglr.com/en/article/roles-and-views-in-the-editor-13gasx2/).

### How do I preview and publish a grid page?

You preview and publish a page with grid scenes the same way as any other page in the editor. See [Preview & test your project](https://help.maglr.com/en/article/preview-test-your-project-1g0k0my/) and [Publish your project live](https://help.maglr.com/en/article/publish-your-project-live-cxy0n/).