> For the complete documentation index, see [llms.txt](https://docs.hello-lisa.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.hello-lisa.com/developers/widgets/configuration-options/layout.md).

# Layout

The optional layout option defines, which layout is used for rendering the library. It accepts an object, with the following layout configuration options:

### Type definition

```
type LayoutConfig = {
  assetOrientation?: Orientation;
  breakpoints?: number[];
  view?: 'grid' | 'list' | 'slider';
};
```

### Asset orientation

The assetOrientation option defines whether assets should be rendered in portrait or landscape format.

```
window.LiSA.library.configs.push({
  layout: {
    assetOrientation: 'landscape',
  },
});
```

### Breakpoints

The breakpoints option allows you to define individual breakpoints for your responsive design. If not provided, LiSA Library defaults to the breakpoints described in Responsive design .

```
window.LiSA.library.configs.push({
  layout: {
    breakpoints: [480, 854],
  },
});
```

### View

The view option sets the library's layout. It accepts a string value that is one of the following:

list (Default) — A vertical show listing. grid — A grid view of all shows slider — Similar to the grid layout, except for keeping all shows of a section in a horizontal, scrollable row.

```
window.LiSA.library.configs.push({
  layout: {
    view 'grid',
  },
});
```