Improving Page Titles

Default page titles

Whenever we generate a route, Ember inserts a {{page-title}} into the templates based on the name of the route. In some cases, this works out quite well, like in the case of the bands route we generated in the previous chapter. However, in other instances, we have to manually adjust those default titles.

If you go to any songs page, you’ll find that the page title for them is Band | Bands | Rock & Roll with Octane. That’s because nested routes also imply inheriting the page title of the parent route and then prepending to it. Since we have {{page-title "Rock & Roll with Octane"}} in our application template and the application route is the parent of all routes, it will be the end of all page titles.

Next, the bands route adds its page title, Bands and the bands.band route adds Band, giving us the full page title of Band | Bands | Rock & Roll with Octane, which just looks funny.

To improve our page titles, let’s first remove the one in bands.band: