Reputation: 167
I'm currently using laravel blade and i currently implemented bootstrap along with the blade template.
Would want to have the navigation button able to interact dynamically along with the selected pages
<div class="navbar">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#"><b>iMakan</b></a>
</div>
<div>
<ul class="nav navbar-nav navbar-right">
<li><a class="active "href="/">Home</a></li>
<li><a href="about">About Us</a></li>
<li><a href="contact">Contact Us</a></li>
<li><a href="auth/login">Login</a></li>
<li><a href="503">Cart</a></li>
</ul>
</div>
</div>
</nav>
</div>
Upvotes: 4
Views: 2495
Reputation: 5943
Laravel provides a built-in function you can use: Request::is()
.
From the API docs:
Determine if the current request URI matches a pattern.
You use is like this:
Request::is('about'); // returns a boolean
<a href="about" @if(Request::is('about')) class="active" @endif>
You could write a helper function to take care of it:
function isActive($path, $class = 'active')
{
return (Request::is($path)) ? $class : '';
}
Put it in a file called helpers.php
in your app
directory and include it in the autoload-part of your composer.json
like this:
"autoload": {
"files": [
"app/helpers.php"
]
},
Maybe you need to do a composer dump-autoload
in your terminal.
And finally use it like this:
<a href="about" class="{{ isActive('about') }}">About</a>
Upvotes: 6
Reputation: 1059
There is a package you can use, but using only what laravel provides I would suggest the following:
<a href="{{ URL::route('home') }}"
class="{{ Route::current()->getName() === 'home' ? : 'active' : ''">Home</a>
Using URL::route(...)
will create a URL based on the name of the route and you can check if this name is currently used with the providec check. To name a route, read the laravel documentation about routing.
Upvotes: 0
Reputation: 11320
Here's my way What i do, You shall follow this too
If you have the last part of url like home
for Home, aboutus
for About Us, then you can do this
Step 1 :
Get Request Uri
$_SERVER['REQUEST_URI']
Step 2 :
Inside you class
you can have this condition
<?php if ($_SERVER['REQUEST_URI']=='/') { echo 'active'; } ?>
So you will be having
<li><a href="about" class='<?php if ($_SERVER['REQUEST_URI']=='/') { echo 'active'; } ?>' >About Us</a></li>
The condition will echo active
according to your uri
So you will be having something this
<ul class="nav navbar-nav navbar-right">
<li><a class="<?php if ($_SERVER['REQUEST_URI']=='/') { echo 'active'; } ?>" href="/">Home</a></li>
<li><a class='<?php if ($_SERVER['REQUEST_URI']=='/aboutus') { echo 'active'; } ?>'href="about" >About Us</a></li>
<li><a class='<?php if ($_SERVER['REQUEST_URI']=='/contactus') { echo 'active'; } ?>'href="contact">Contact Us</a></li>
<li><a class='<?php if ($_SERVER['REQUEST_URI']=='/login') { echo 'active'; } ?>' href="auth/login">Login</a></li>
<li><a class='<?php if ($_SERVER['REQUEST_URI']=='/cart') { echo 'active'; } ?>' href="503">Cart</a></li>
</ul>
Then you will be getting the class='active'
according to your url.
Hope this helps you.
Upvotes: 0