diff --git a/source/_dashboards/sections.markdown b/source/_dashboards/sections.markdown index acaa724ce76..46b77fdf735 100644 --- a/source/_dashboards/sections.markdown +++ b/source/_dashboards/sections.markdown @@ -6,16 +6,62 @@ description: "Lets you organize your cards in sections on a grid." --- The sections view lets you organize your cards in sections on a grid. -It allows you to group card directly in sections, without having to use horizontal or vertical stack cards. +You can group cards without using horizontal or vertical stack cards. -There are a few options to rearrange cards. You can move cards within the section, -move them from one section into another or even move the entire section. -You can also copy and paste cards. +

+ A fully populated dashboard in Sections view layout + A fully populated dashboard in Sections view layout +

-To see how it works, check out the demo: +
+

The sections view was released beginning of March 2024 and is experimental! Do not build your daily dashboard on top of it yet! We are still collecting feedback.


It is not possible to migrate dashboards into sections view.

+
+ +## Creating a sections view + +1. If you have multiple dashboards, in the left sidebar, select the dashboard to which you want to add the sections view. +2. [Add a new view](/dashboards/views/#adding-a-view-to-a-dashboard) and under **View type**, select **Sections**. +3. To add a card, select the **Add card** button. + - Follow the [steps on adding cards](/dashboards/cards/#adding-cards-to-your-dashboard). + + ![Add Section button](/images/dashboards/sections_view_add-card-or-section.png) + +4. To add a section, select the **Create section** button. +5. To edit the section title, select the Edit icon button. + - If you leave the section title empty, this line will be hidden. +6. To delete a section, select the Delete icon button. + +## Rearranging sections and cards + +In the sections view, you can rearrange sections and cards by dragging them to a new location. This is not yet possible in other views. + +1. To edit your dashboard, in the top right corner, select the pencil icon. +2. To rearrange sections, hold the Move icon button and move the card. + +

+ Rearranging sections by dragging + Rearranging sections by dragging +

+ +3. To rearrange cards, tap and hold the card and move it to your desired location. + +

+ Rearranging cards by dragging + Rearranging cards by dragging +

+ +## Check out the demo + +Check out the demo from the March live stream on dashboards. +## About the sections view layout + +To learn all about the design decisions and the grid layout used for the sections view, refer to the [Dashboard chapter 1 blog post](/blog/2024/03/04/dashboard-chapter-1/). + +## YAML configuration + {% configuration %} type: required: false @@ -28,3 +74,6 @@ type: - [Masonry view](/dashboards/masonry/) - [Panel view](/dashboards/panel/) - [Sidebar view](/dashboards/sidebar/) +- [Dashboard chapter 1 blog post](/blog/2024/03/04/dashboard-chapter-1/) +- [Adding cards to a view](/dashboards/cards/#adding-cards-to-your-dashboard) +- [Adding a new view](/dashboards/views/#adding-a-view-to-a-dashboard) \ No newline at end of file diff --git a/source/images/dashboards/sections_view_add-card-or-section.png b/source/images/dashboards/sections_view_add-card-or-section.png new file mode 100644 index 00000000000..3f5ac636fd4 Binary files /dev/null and b/source/images/dashboards/sections_view_add-card-or-section.png differ