diff --git a/src/logic/page/PageInstance.py b/src/logic/page/PageInstance.py
index 9c3b1c73a4095496bd92b0b9e169b2dbbfafe86a..fc0496013829f59ef402677c0a7f077ffad4def8 100644
--- a/src/logic/page/PageInstance.py
+++ b/src/logic/page/PageInstance.py
@@ -14,3 +14,6 @@ class TileLayoutSettings:
class PageInstance:
uniqueName: str
tileLayouts: Dict[str, TileLayoutSettings]
+
+ def get_tile_layouts_sorted(self):
+ return {k: v for k, v in sorted(self.tileLayouts.items(), key=lambda item: item)}
diff --git a/src/templates/page.html b/src/templates/page.html
index 470c143d2bb55ae46ea9b497927ce22515195ed9..4cdfb8ec2675528e875a6d69fbd250ad076dfd3e 100644
--- a/src/templates/page.html
+++ b/src/templates/page.html
@@ -16,7 +16,7 @@
</head>
<body>
<div class="grid-stack">
- {% for tileName, tileLayoutSettings in page.tileLayouts.items() %}
+ {% for tileName, tileLayoutSettings in page.get_tile_layouts_sorted().items() %}
<div class="grid-stack-item"
id="tile-{{ page.uniqueName | replace(' ', '_') }}_{{ tileName }}"
data-gs-x="{{ tileLayoutSettings.x }}" data-gs-y="{{ tileLayoutSettings.y }}"