diff --git a/bundles/org.openhab.ui/web/src/pages/developer/widgets/widget-edit.vue b/bundles/org.openhab.ui/web/src/pages/developer/widgets/widget-edit.vue
index c8819deb1..ec5e1e3c4 100644
--- a/bundles/org.openhab.ui/web/src/pages/developer/widgets/widget-edit.vue
+++ b/bundles/org.openhab.ui/web/src/pages/developer/widgets/widget-edit.vue
@@ -26,7 +26,7 @@
     <f7-block v-else :key="blockKey + 'b'" class="widget-editor vertical">
       <f7-row resizable>
         <f7-col resizable style="min-width: 20px" class="widget-code">
-          <editor class="widget-component-editor" mode="application/vnd.openhab.uicomponent-definition+yaml?type=widget" :value="widgetDefinition" @input="(value) => widgetDefinition = value" />
+          <editor class="widget-component-editor" mode="application/vnd.openhab.uicomponent+yaml?type=widget" :value="widgetDefinition" @input="(value) => widgetDefinition = value" />
         </f7-col>
         <f7-col v-if="ready" resizable style="min-width: 20px" class="widget-preview padding-right margin-bottom">
           <generic-widget-component :key="widgetKey" :context="context" @command="onCommand" />
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/pages/layout/layout-edit.vue b/bundles/org.openhab.ui/web/src/pages/settings/pages/layout/layout-edit.vue
index e4c7557b5..b5e828a43 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/pages/layout/layout-edit.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/pages/layout/layout-edit.vue
@@ -31,7 +31,7 @@
         />
       </f7-tab>
       <f7-tab id="code" @tab:show="() => { this.currentTab = 'code' }" :tab-active="currentTab === 'code'">
-        <editor v-if="currentTab === 'code'" :style="{ opacity: previewMode ? '0' : '' }" class="page-code-editor" mode="application/vnd.openhab.uicomponent-definition+yaml?type=layout" :value="pageYaml" @input="(value) => pageYaml = value" />
+        <editor v-if="currentTab === 'code'" :style="{ opacity: previewMode ? '0' : '' }" class="page-code-editor" mode="application/vnd.openhab.uicomponent+yaml?type=layout" :value="pageYaml" @input="(value) => pageYaml = value" />
         <!-- <pre class="yaml-message padding-horizontal" :class="[yamlError === 'OK' ? 'text-color-green' : 'text-color-red']">{{yamlError}}</pre> -->
 
         <oh-layout-page class="layout-page" v-if="ready && previewMode" :context="context" :key="pageKey" />
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/pages/tabs/tabs-edit.vue b/bundles/org.openhab.ui/web/src/pages/settings/pages/tabs/tabs-edit.vue
index 8d74c2738..9a22f8a19 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/pages/tabs/tabs-edit.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/pages/tabs/tabs-edit.vue
@@ -61,7 +61,7 @@
       </f7-tab>
 
       <f7-tab id="code" @tab:show="() => { this.currentTab = 'code' }" :tab-active="currentTab === 'code'">
-        <editor v-if="currentTab === 'code'" class="page-code-editor" mode="text/x-yaml" :value="pageYaml" @input="(value) => pageYaml = value" />
+        <editor v-if="currentTab === 'code'" class="page-code-editor" mode="application/vnd.openhab.uicomponent+yaml;type=tabs" :value="pageYaml" @input="(value) => pageYaml = value" />
         <!-- <pre class="yaml-message padding-horizontal" :class="[yamlError === 'OK' ? 'text-color-green' : 'text-color-red']">{{yamlError}}</pre> -->
       </f7-tab>
     </f7-tabs>