How to customize Navbar property in Yii2 - css

Question

I have navigation header like this:
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-collapse collapse">
<form class="navbar-form navbar-right" role="search">
<div class="form-group has-feedback">
<input id="searchbox" type="text" placeholder="Search" class="form-control">
<span id="searchicon" class="fa fa-search form-control-feedback"></span>
</div>
</form>
</div><!--/.navbar-collapse -->
</div>
</div>
I have problem when I want to convert this code using yii\bootstrap\NavBar;:
<div class="navbar-collapse collapse">
<form class="navbar-form navbar-right" role="search">
<div class="form-group has-feedback">
<input id="searchbox" type="text" placeholder="Search" class="form-control">
<span id="searchicon" class="fa fa-search form-control-feedback"></span>
</div>
</form>
</div><!--/.navbar-collapse -->
And this is the code of my Layout using yii\bootstrap\NavBar;:
<?php
NavBar::begin([
'brandLabel' => 'My Company',
'brandUrl' => Yii::$app->homeUrl,
'options' => [
'class' => 'navbar navbar-inverse navbar-fixed-top',
'role' => 'navigation',
],
]);
NavBar::end();
?>
I have been read Navbar Widget, but still don't understand. Is there anyone who can teach me to using Navbar widget on Yii2 framework?.

Answer 1

Ok here is the code for that,here i am just placing the searchbox from exactly what you posted in question and i am guessing that you know how to echo other menu links in navbar
Anyway it goes like this
<?php
NavBar::begin([
'brandLabel' => 'My Company',
'brandUrl' => Yii::$app->homeUrl,
'options' => [
'class' => 'navbar navbar-inverse navbar-fixed-top',
'role' => 'navigation',
],
]);
$menuItems = [
['label' => 'Home', 'url' => ['controller url here']],
];
echo Nav::widget([
'options' => ['class' => 'navbar-nav navbar-right'],
'items' => $menuItems,
]);
echo "<form class='navbar-form navbar-right' role='search'>
<div class='form-group has-feedback'>
<input id='searchbox' type='text' placeholder='Search' class='form-control'>
<span id='searchicon' class='fa fa-search form-control-feedback'></span>
</div>
</form>";
NavBar::end();
?>