如何在Bootstrap xPage上添加两个导航栏

Question

这是我简单的xPage：

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">
    <xe:applicationLayout id="applicationLayout1">
        <xe:navbar id="navbar1" headingText="Navigation Bar" fixed="fixed-top">
        </xe:navbar>
        <xe:this.configuration>
            <xe:simpleResponsiveConfiguration
                fixedNavbar="fixed-top" invertedNavbar="true"
                collapsedLeftMenuLabel="Menu" collapseLeftColumn="true" navbar="true"
                pageWidth="fixed">
                <xe:this.navbarAppLinks>
                    <xe:pageTreeNode label="App Layout App Link 1"
                        page="AppLinkPage.xsp">
                    </xe:pageTreeNode>
                </xe:this.navbarAppLinks>
                <xe:this.navbarUtilityLinks>
                    <xe:pageTreeNode label="App Layout Utility Link 1"
                        page="UtilityPage.xsp">
                    </xe:pageTreeNode>
                </xe:this.navbarUtilityLinks>
            </xe:simpleResponsiveConfiguration>
        </xe:this.configuration>
    </xe:applicationLayout>
</xp:view>

它使用应用程序布局导航栏。我想添加另一个来放置更多的控件/按钮。第二个导航栏应该粘在主导栏上并且是页面宽度。我将响应式导航栏控件放入应用程序布局，然后设置fixedNavbar =＆＃34; unfixed-top＆＃34;它看起来不错，除了它没有页面宽度（见图中的＃1）。如果我设置fixedNavbar =＆＃34; fixed-top＆＃34;然后它出现在主导航栏上（参见＃2）。那么如何使第二个导航栏页面更宽？