\r\n \u003C/main>\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\nNext, we complement this layout in an nested `/layout/header/sidebar.vue`:\r\n```html\r\n\u003Ctemplate>\r\n \u003Cdiv class=\"sidebar-template-root\">\r\n \u003Caside>\r\n \u003C!-- -->\r\n \u003C/aside>\r\n \u003Carticle>\r\n \u003Cnuxt/>\r\n \u003C/article>\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\nFinally, we use this layout on the page\r\n```html\r\n\u003Ctemplate>\r\n \u003Cp>Page content ...\u003C/p>\r\n\u003C/template>\r\n\r\n\u003Cscript>\r\n export default {\r\n layout: 'header/sidebar'\r\n }\r\n\u003C/script>\r\n```\r\nAs a result, we will get a page with the following code:\r\n```html\r\n\u003Cdiv class=\"header-template-root\">\r\n \u003Capp-header>\u003C/app-header>\r\n \u003Cmain>\r\n \u003Cdiv class=\"sidebar-template-root\">\r\n \u003Caside>\r\n \u003C!-- -->\r\n \u003C/aside>\r\n \u003Carticle>\r\n \u003Cp>Page content ...\u003C/p>\r\n \u003C/article>\r\n \u003C/div>\r\n \u003C/main>\r\n\u003C/div>\r\n```\r\n\r\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\r\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This feature request is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2683\">#c2683\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2095,2096],{"name":2053,"color":2054},{"name":2056,"color":2057},3099,"[Feature request]: Create nested Layouts","2025-03-18T08:49:20Z","https://github.com/nuxt/nuxt/issues/3099",0.76720256,["Reactive",2103],{},["Set"],["ShallowReactive",2106],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"Iun646ehCTkhcaL6OJZYPHNCX3NTecFY5ngMmNaKjIQ":-1},"/nuxt/nuxt.com/1227"]