# How do you render different layouts? **URL:** \ **Category:** Uncategorized\ **Created:** [December 29, 2015, 10:04pm UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359 "2015-12-29T22:04:54Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![twisted1919](https://avatars.discourse-cdn.com/v4/letter/t/e495f1/32.png) [@twisted1919](https://discuss.emberjs.com/u/twisted1919)\ **Post date:** [December 29, 2015, 10:04pm UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/1 "2015-12-29T22:04:54Z")
I have a basic scenario where i have to show different layout to guests vs authenticated users. I tried to render other template than the application one by using below code in my route file: ```auto renderTemplate(){ this.render('login', { // the template to render into: 'guest', // the template to render into // outlet: 'login', // the name of the outlet in that template // controller: 'login' // the controller to use for the template }); } ``` but when i do so i get `Uncaught Error: Assertion Failed: You attempted to render into 'guest' but it was not found` even though the files are all there which seems to be a bug(?). The only way i managed to get this working is to output only `{{outlet}}` into the `application.hbs` template then in all my other templates do something like: ```auto {{title "Login"}} {{partial "partial/guest-header"}} ...markup... {{partial "partial/guest-footer"}} ``` which get rendered in app.hbs {{outlet}}, but this seems very tedious to maintain. I also tried to edit application.js as in: ```auto renderTemplate(){ if (this.router.currentRouteName == "login") { this.render('guest'); } else { this.render('application'); } } ``` But seems that `this.router.currentRouteName` is undefined at init and in order to make it work i have to place it into a `Ember.run.later` call, which again, seems very odd to do. So, that being said, what is the proper way to use various layouts? I mean, why is this so hard to achieve, is like i am fighting the framework (most likely i am) ? ---
**Author:** ![twisted1919](https://avatars.discourse-cdn.com/v4/letter/t/e495f1/32.png) [@twisted1919](https://discuss.emberjs.com/u/twisted1919)\ **Post date:** [December 30, 2015, 11:58am UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/2 "2015-12-30T11:58:19Z")
Really, nobody knows how to render different layouts? Weird… ---
**Author:** ![alexspeller](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/alexspeller/32/14812_2.png) [@alexspeller](https://discuss.emberjs.com/u/alexspeller)\ **Post date:** [December 30, 2015, 2:38pm UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/3 "2015-12-30T14:38:12Z")
Many people know how to do this, they just didn’t see your post and reply to it. I cover it in my embercamp London talk: [http://alexspeller.com/embercamp-london-talk-routing/](http://alexspeller.com/embercamp-london-talk-routing/) ---
**Author:** ![twisted1919](https://avatars.discourse-cdn.com/v4/letter/t/e495f1/32.png) [@twisted1919](https://discuss.emberjs.com/u/twisted1919)\ **Post date:** [December 30, 2015, 4:49pm UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/4 "2015-12-30T16:49:09Z")
@alexspeller - Thank you, finally something that makes sense. Great talk too 😉 ---
**Author:** ![fivetwentysix](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/fivetwentysix/32/10100_2.png) [@fivetwentysix](https://discuss.emberjs.com/u/fivetwentysix)\ **Post date:** [September 9, 2016, 9:42pm UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/5 "2016-09-09T21:42:52Z")
Can we have a textual response? ---
**Author:** ![whynot](https://avatars.discourse-cdn.com/v4/letter/w/c77e96/32.png) [@whynot](https://discuss.emberjs.com/u/whynot)\ **Post date:** [February 3, 2017, 12:16am UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/6 "2017-02-03T00:16:51Z")
i met the same problem. 😥 ---
**Author:** ![whynot](https://avatars.discourse-cdn.com/v4/letter/w/c77e96/32.png) [@whynot](https://discuss.emberjs.com/u/whynot)\ **Post date:** [February 3, 2017, 12:17am UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/7 "2017-02-03T00:17:25Z")
So, what’s going on really? i am confused. ---
**Author:** ![carrotalan](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/carrotalan/32/13282_2.png) [@carrotalan](https://discuss.emberjs.com/u/carrotalan)\ **Post date:** [August 12, 2017, 7:17pm UTC](https://discuss.emberjs.com/t/how-do-you-render-different-layouts/9359/8 "2017-08-12T19:17:20Z")
You need to create two parent routes like this: ``` this.route('logged-in', {path: '/'}, function(){ this.route('inventory', {resetNamespace: true}, function() { this.route('view', {path: ":id"}); }); }); this.route('login'); ``` The logged-in route and template contains all of your toolbars, navbars etc when you’re logged in as well as an unnamed outlet, like this: ``` {{bread-crumbs tagName="ol" outputStyle="bootstrap" linkable=true}}
{{outlet}}
``` The log in route just has your login form. Then you need to make your application template like this: ``` {{outlet "logged-in"}} {{outlet "login"}} ``` Then you need to make your login route have a renderTemplate like this: ``` renderTemplate: function(){ this.render("login", { outlet: "login" }); } ``` Whilst your logged-in route has a render template like this: ``` renderTemplate: function(){ this.render("logged-in", { outlet: "logged-in" }); } ``` Transitioning between login and any of the child routes under “logged-in” will hide the UI elements. The resetNamespace stuff and setting the logged-in path to “/” prevents the URL from showing “logged-in”.