# Grid Layout (Legacy)

{% hint style="info" %}
We highly recommend that you use the [Block Grid](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/block-editor/block-grid-editor) instead.

The Grid Layout has been marked as obsolete and development on the property editor has been discontinued. It will be removed as a core property editor with the release of Umbraco 14, planned for Summer 2024.
{% endhint %}

`Returns: JSON`

Gives editors a grid layout editor which allows them to insert different types of content in a predefined layout.

<figure><img src="https://3872888104-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgEH4FChbCn7eDDqREvdE%2Fuploads%2Fgit-blob-f2cabc6bd805cdf03f575f703d406bb7cb281880%2Feditor.png?alt=media" alt=""><figcaption></figcaption></figure>

## [What are Grid Layouts](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/what-are-grid-layouts)

The basic concept of Grid Layouts.

## [Configuring the Grid Layout data type](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/configuring-the-grid-layout-datatype)

How to setup your Grid Layout data type.

## [Settings and styling](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/settings-and-styles)

Add settings and styles.

## [Grid editors](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/grid-editors)

Explanation of default Grid editors and how to customise them.

## [Build your own Grid editor](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/build-your-own-editor)

Build your own Grid editor from the ground up.

## [Render Grid in template](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/render-grid-in-template)

Render content created with Grid Layouts in your templates.

## [Grid Layout Best Practices](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/grid-layout-best-practices)

General guidelines when contemplating Grid Layout implementation.

## [Add values programmatically](https://docs.umbraco.com/umbraco-cms/13.latest/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/grid-layout/add-value-programmatically)

Example how to add values programmatically.