-
Notifications
You must be signed in to change notification settings - Fork 59
Blade Bootstrap Template
Alvaro Vasconcelos edited this page Aug 10, 2018
·
6 revisions
The following view files will get you started with a basic Bootstrap navbar using the Blade template engine.
Recommended save to views/partials/menu
.
<nav class="navbar navbar-inverse" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#menu-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand">Caffeinated Menu</a>
</div>
<div class="collapse navbar-collapse" id="menu-collapse">
<ul class="nav navbar-nav">
@include('partials.menu.items', ['items'=> $menu_example->roots()])
</ul>
</div>
</div>
</nav>
Recommended save to views/partials/menu
.
@foreach($items as $item)
<li @if($item->hasChildren())class ="dropdown"@endif>
@if($item->link) <a @if($item->hasChildren()) class="dropdown-toggle" data-toggle="dropdown" @endif href="{{ $item->url() }}">
{!! $item->title !!}
@if($item->hasChildren()) <b class="caret"></b> @endif
</a>
@else
{{$item->title}}
@endif
@if($item->hasChildren())
<ul class="dropdown-menu">
@foreach($item->children() as $child)
<li><a href="{{ $child->url() }}">{{ $child->title }}</a></li>
@endforeach
</ul>
@endif
</li>
@if($item->divider)
<li{{\HTML::attributes($item->divider)}}></li>
@endif
@endforeach
For Bootstrap 4+ :
@foreach($items as $item)
<li class ="nav-item @if($item->hasChildren()) dropdown @endif @if($item->isActive()) active @endif">
<a class="nav-link @if($item->hasChildren()) dropdown-toggle @endif" @if($item->link) href="{{ $item->url() }}" @endif
@if($item->hasChildren()) id="dropdown-{{$loop->index}}" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" @endif >
{!! $item->title !!}
@if($item->hasChildren()) <b class="caret"></b> @endif
</a>
@if($item->hasChildren())
<div class="dropdown-menu" aria-labelledby="dropdown-{{$loop->index}}">
@foreach($item->children() as $child)
<a class="dropdown-item" href="{{ $child->url() }}">{{ $child->title }}</a>
@if($child->divider)
<div class="dropdown-divider"></div>
@endif
@endforeach
</div>
@endif
</li>
@endforeach
To include the dynamic menu into the navigation menu as a drop down list:
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"
aria-expanded="false">Menu<span class="caret"></span></a>
<ul class="dropdown-menu">
@include('partials.menu.items', ['items'=> $menu_example->roots()])
</ul>
</li>
</ul>
🔴 Best Temporary Email - https://1secmail.ru 🔴