I use following code to make the url nav-link active class when route to 'localhost:3000/home' route :
<a class="nav-link {{ (request()->is('home')) ? 'active' : '' }}" href="{{ route('home') }}">Home</a>
But change url to 'localhost' route, the similar code is not working:
<a class="nav-link {{ (request()->is('')) ? 'active' : '' }}" href="{{ route('home') }}">Home</a>
The localhost:3000/ route means / in Laravel. So you use / instead of ''
<a class="nav-link {{ (request()->is('/')) ? 'active' : '' }}" href="{{ route('home') }}">Home</a>
Related
I'm trying to do what language is included in it added class"active"
I try this way but it doesn't work for me
<div class="lang">
<ul>
#foreach(LaravelLocalization::getSupportedLocales() as $localeCode => $properties)
<li>
<a
class="{{ Request::path() === LaravelLocalization::getLocalizedURL() ? 'active' : ''}}"
rel="alternate"
hreflang="{{ $localeCode }}"
href="{{ LaravelLocalization::getLocalizedURL($localeCode, null, [], true) }}">
{{ $properties['native'] }}
</a>
</li>
#endforeach
</ul>
</div>
You should do:
{{ $localeCode == LaravelLocalization::getCurrentLocale() ? 'active' : ''}}
How can I add a direct link onto a nav item in a menu opposed to a reference to a section?
in my config.toml, I've added a link but it first places the baseurl in front of it:
[menu]
[[menu.nav]]
name = "Summary"
URL = "services"
weight = 2
[[menu.nav]]
name = "Contact"
URL = "contact-us"
weight = 3
[[menu.nav]]
name = "Methods"
URL = "blog"
weight = 4
[[menu.nav]]
name = "Français"
url = "https://example.com/" #this is the link I want to add
weight = 5
I found this post, but don't know html so am unsure where to add a change in the layout/partials/navigation.html file.
My suspicion is it's somewhere in this range of the partial.
{{ if .IsHome }}
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto navigation-menu">
<li class="nav-item"><a class="nav-link" data-scroll href="#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
{{ range $.Site.Menus.nav }}
<li class="nav-item"><a class="nav-link" data-scroll href="#{{ .URL }}">{{ .Name }}</a></li>
{{ end }}
</ul>
</div>
{{ else }}
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto navigation-menu">
<li class="nav-item"><a class="nav-link" data-scroll href="{{ $.Site.BaseURL }}#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
{{ range $.Site.Menus.nav }}
<li class="nav-item"><a class="nav-link" data-scroll href="{{ $.Site.BaseURL }}#{{ .URL | absURL }}">{{ .Name }}</a></li>
{{ end }}
</ul>
</div>
{{ end }}
Thanks for any help!
The navigation URLs are not handled great by this theme. Try to replace
the href="{{ $.Site.BaseURL }}#{{ .URL | absURL }}" to href="{{ .URL |relURL }}". It should work for both internal and external links
{{ if .IsHome }}
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto navigation-menu">
<li class="nav-item"><a class="nav-link" data-scroll href="#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
{{ range $.Site.Menus.nav }}
<li class="nav-item"><a class="nav-link" data-scroll href="{{ .URL | relURL }}">{{ .Name }}</a></li>
{{ end }}
</ul>
</div>
{{ else }}
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto navigation-menu">
<li class="nav-item"><a class="nav-link" data-scroll href="{{ $.Site.BaseURL }}#body">{{ with $.Site.Params.home }}{{ . }}{{ end }}</a></li>
{{ range $.Site.Menus.nav }}
<li class="nav-item"><a class="nav-link" data-scroll href="{{ .URL | relURL }}">{{ .Name }}</a></li>
{{ end }}
</ul>
</div>
{{ end }}
and in your config.yaml, add "/" before the internal link.
baseurl = "/"
[menu]
[[menu.nav]]
name = "Summary"
URL = "/services"
weight = 2
[[menu.nav]]
name = "Contact"
URL = "/contact-us"
weight = 3
[[menu.nav]]
name = "Methods"
URL = "/blog"
weight = 4
[[menu.nav]]
name = "Français"
url = "https://example.com/" #this is the link I want to add
weight = 5
If I want to add active class to routes I'll use:
class="{{ Route::currentRouteNamed('products.index') ? 'active' : '' }}"
If I want use it in static links I'll use:
class="{{ Request::is('/blog') ? 'active' : ''}}"
But what If I want to use it on dynamic url's? like adding custom link to my menu then I have something like:
#foreach($menus as $menu)
<li class="">
{{$menu->title}}
</li>
#endforeach
now what should i use as my li class in order to add active class?
If $menu->link looks like home for example, do the same:
<a href="{{ $menu->link }}" {{ request()->is($menu->link) ? 'class="active"' : '' }}>{{ $menu->title }}</a>
Try using the below code :
#foreach($menus as $menu)
<li class="{{Request::is($menu->link) ? 'active': ''}}">
{{$menu->title}}
</li>
#endforeach
Hi experts I'm trying to display here a content depending on logged in user. If their role id = 2, the link will be diplayed in the sidebar. But then it has an error. Thanks
#if(({{ Auth::user()->role_id }})=="2")
<li class="{{ Request::is('activity*') ? 'active open' : '' }}">
<i class="fa fa-list-alt"></i> {{ Auth::user()->role_id }} User Log
</li>
#endif
#if((Auth::user()->role_id)=="2")
<li class="{{ Request::is('activity*') ? 'active open' : '' }}">
<i class="fa fa-list-alt"></i> {{ Auth::user()->role_id }} User Log
</li>
#endif
No need for the {{ }} as # already means you are using php
I'm trying to add an id attribute to a link if a given variable is not empty. To do so I'm using the inline-if sentence.
<li><a {{ $link['element_id'] }} != "" ? {{"id=" . $link['element_id'] }} : '' href="{{ url($link['url']) }}">{{$link['name']}}</a></li>
Output:
I believe you issue is that it is out of the php itself. Did you try using
<li><a {{ $link['element_id'] != "" ? 'id=' . $link['element_id'] : ''}} href="{{ url($link['url']) }}">{{$link['name']}}</a></li>
And also a good practice is to use one type of quotes in the php code preferably single ones.
You can use conditional inside the blade mustache syntax:
<li><a id="{{ $link['element_id'] != '' ? $link['element_id'] : '' }} href="{{ url($link['url']) }}">{{$link['name']}}</a></li>
This one should works:
<li>
<a id="{{ $link['element_id'] !== '' ? $link['element_id'] : null }}" href="{{ url($link['url']) }}">
{{ $link['name'] }}
</a>
</li>
Try something like this :
<li>
<a #if($link['element_id']!="") {{"id=" . $link['element_id'] }} #endif href="{{ url($link['url']) }}" >
{{$link['name']}}
</a>
</li>
But if you really want to do it via "inline-if" (this should work):
Your issue is that your are not putting the php between the brackets.
<li>
<a {{ $link['element_id']!= "" ? "id=" . $link['element_id'] : ''}} href="{{url($link['url'])}}">
{{$link['name']}}
</a>
</li>