can content be present when using ui-router views?

I have the following html and controller. For some reason, the line marked <p>Application Shell... does not render at all for url /. This line is outside of any named views and I had expected it to show up irrespective of any views.

I wonder if I am using the ui-router incorrectly. Can there be other content on page when views are used? Is this because of ionicFramework or is this behavior native to angular/ui-router? I will appreciate your help.

I have 2 "views" - search, which should be populated when in state is search; and a combination of nav+detail which should be populated otherwise. 

<body ng-app="myapp">
    <ion-nav-view>
    </ion-nav-view>
</body>

--- shell.html ---------

<div>
    <ion-header-bar class="logo-bar">
      some header
    </ion-header-bar>
    <div style="background: pink">
        <p style="position: absolute; top: 146px;"> {{name}}, Application Shell, has 2 peer subviews</p>
        <ion-nav-view name="searchContent" style="position: absolute; top: 44px;">coming soon... search</ion-nav-view>
        <ion-nav-view name="navContent" style="position: absolute; top: 88px;">coming soon... nav</ion-nav-view>
        <ion-nav-view name="detailContent" style="position: absolute; top: 126px;">coming soon... detail</ion-nav-view>
    </div>
    <div class="bar bar-footer bar-balanced">
        <div class="title">Footer</div>
    </div>
</div>

----- nav.html ----------

<div style="background: yellow">
    <p>nav content is in yellow</p>
</div>

----- detail.html ------

<div style="background: orange">
    <p>detail content is in orange</p>
</div>

----- router (states) ---

function RouterConfig($stateProvider, $urlRouterProvider) {
        $stateProvider
            .state('root', {
                abstract: true,
                templateUrl: "templates/shell.html"
            })
            .state('root.home', {
                url: "/",
                views: {
                    'navContent': { templateUrl: "templates/nav.html" },
                    'detailContent': { templateUrl: "templates/detail.html" }
                }
            })
            .state('root.search', {
                url: "/search",
                views: {
                    'searchContent': { templateUrl: "templates/search.html" }
                }
            });
        $urlRouterProvider.otherwise('/');
} // RouterConfig()

This behaviour is a part of AngularJS Routing. However, if you want some static content to be a part of one or more views that you use, You can always use ngInclude directive for loading some static contents.

For e.g.

<div class="slide-animate" ng-include="yourStaticFile.html"></div>

More details can be found here