Hi guys i have trouble in making different icon for url using laravel breadcrump, , here the picture
I want to make icon HRMS and Dashboard is different
Here my blade file
<link rel="stylesheet" type="text/css" href="{{ asset("/css/hrms2.css") }}">
#if (count($breadcrumbs))
<ol class="breadcrumb">
#foreach ($breadcrumbs as $breadcrumb)
#if ($breadcrumb->url && !$loop->last)
<li class="breadcrumb-item" style="">
<a class="bread-color" href="{{ $breadcrumb->url }}">
<i class="fa fa-home"></i> {{ $breadcrumb->title }}</a>
</li>
#else
<li class="breadcrumb-item active">{{ $breadcrumb->title }}</li>
#endif
#endforeach
</ol>
#endif
You need to pass icon name also in $breadcrumb object and use $breadcrumb->icon instead of fa-home
<ol class="breadcrumb">
#foreach ($breadcrumbs as $breadcrumb)
#if ($breadcrumb->url && !$loop->last)
<li class="breadcrumb-item" style=""><a class="bread-color" href="{{ $breadcrumb->url }}"> <i class="fa {{ $breadcrumb->icon }}"></i> {{ $breadcrumb->title }}</a></li>
#else
<li class="breadcrumb-item active">{{ $breadcrumb->title }}</li>
#endif
#endforeach
Related
I ran the command to generate the customization files for my blog's pagination.
I was able to customize the appearance of the buttons but the issue I now have is that when the page number gets to say 8, the pagination link shows up to 8 links. I would like to implement the '...' separator within the link. My bootstrap-4.blade.php is as follows
<div class="row">
<div class="col-12">
<ul class="pagination justify-content-center">
{{-- Previous Page Link --}}
#if ($paginator->onFirstPage())
<li>
<a aria-label="Next">
<i class="fas fa-arrow-left"></i>
</a>
</li>
#else
<li class="px-1">
<span><i class="fas fa-arrow-left"></i></span>
</li>
#endif
{{-- Pagination Elements --}}
#foreach ($elements as $element)
{{-- "Three Dots" Separator --}}
#if ($paginator->currentPage() > 4 && $page === 2)
<li class="px-1"><span class="page-link">...</span></li>
#endif
{{-- Array Of Links --}}
#if (is_array($element))
#foreach ($element as $page => $url)
#if ($page == $paginator->currentPage())
<li class="px-1"><a style="background:#56107c; color:white; cursor:not-allowed;" href="{{ $url }}">{{ $page }}</a></li>
#else
<li class="px-1">{{ $page }}</li>
#endif
#endforeach
#endif
#endforeach
{{-- Next Page Link --}}
#if ($paginator->hasMorePages())
<li class="px-1">
<span><i class="fas fa-arrow-right"></i></span>
</li>
#else
<li>
<a aria-label="Next">
<i class="fas fa-arrow-right"></i>
</a>
</li>
#endif
</ul>
</div>
</div>
#endif
You can use a built in function $posts->links(), it will auto create everything - links, numbers and next.
I have a dynamic menu and sub menu in my website and want to make not clickable menu to only those menu that have sub menu.
here is code
#foreach($levels as $category)
<li class="text-black-50">
<a href="/category/{{ $category->slug }}" title="">
{{ $category->name }}
</a>
</li>
#if($category->children->count() > 0 )
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
#foreach($category->children as $child)
<li>
{{ $child->name }}
</li>
#endforeach
</ul>
</li>
#else
#endif
#endforeach
I quick solution over your code is don't use href att when the menu has a submenu. Using your code:
#foreach($levels as $category)
<li class="text-black-50">
#if($category->children->count() > 0 )
<a href="/category/{{ $category->slug }}" title="">
{{ $category->name }}
</a>
#else
<a style="pointer-events: none; cursor: default;">
{{ $category->name }}
</a>
#endif
</li>
#if($category->children->count() > 0 )
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
#foreach($category->children as $child)
<li>
{{ $child->name }}
</li>
#endforeach
</ul>
</li>
#else
#endif
#endforeach
I hope It's helps!
In laravel, i am trying to send 4 different types of notifications to a user.Here is my part of code.
<div class="panel-body">
<ul class="nav" role="tablist">
<li role="presentation">
<a href="{{ url('/approvals/capexapproval') }}">
CAPEX
#if(Auth::user()->unreadNotifications->count()>0)
<span class="badge badge-light">
{{count(Auth::user()->unreadNotifications)}}
</span>
#endif
</a>
</li>
<li role="presentation">
<a href="{{ url('/approvals/creditapproval') }}">
CUSTOMER
#if(Auth::user()->unreadNotifications->count()>0)
<span class="badge badge-light">
{{count(Auth::user()->unreadNotifications)}}
</span>
#endif
</a>
</li>
<li role="presentation">
<a href="{{ url('/approvals/vendorapproval') }}">
VENDOR
#if(Auth::user()->unreadNotifications->count()>0)
<span class="badge badge-light">
{{count(Auth::user()->unreadNotifications)}}
</span>
#endif
</a>
</li>
For each menu I need to show the number of messages received and if I read a message of particular inbox the unread notifications count of that particular inbox should be decremented by 1.
<!-- BEGIN HEADER MENU -->
<div class="nav-collapse collapse navbar-collapse navbar-responsive-collapse">
<ul class="nav navbar-nav">
<li class="dropdown dropdown-fw dropdown-fw-disabled active open selected">
<i class="icon-home"></i> Home
<ul class="dropdown-menu dropdown-menu-fw">
<li>
<i class="icon-bar-chart"></i> View Photo
</li>
<li class="active">
<i class="icon-bulb"></i> About
</li>
<li>
<i class="icon-graph"></i> Contact
</li>
</ul>
</li>
<li class="dropdown dropdown-fw dropdown-fw-disabled">
<i class="icon-home"></i> Upload
<ul class="dropdown-menu dropdown-menu-fw">
<li>
<i class="icon-bar-chart"></i> Upload Photo
</li>
<li>
<i class="icon-bulb"></i> View Photo List
</li>
</ul>
</li>
</ul>
</div>
I am still new to this but basically, I have 5 pages (View Photo, About, Contact, Upload Photo, View Photo List). Currently, I want to show this HTML in all 5 pages so that it will be standardized. If I change the "picture/about" in one page to "photograph/about" for example, the 5 pages will need to reflect this change. This gets more complex as the number of pages increases.
Is there any way or technique in Laravel to solve this issue? Thanks.
Create a template file like Laravel provides app.blade.php in resources/template/ directory, use extends, sections etc for designing, please read Laravel Documentation for Templates
You can use partials for this.
If your issue is adding the active class to the correct link then you can just use request()->is() to check the current url:
<li class="{{ request()->is('picture/externalphotoviewer') ? 'active' : '' }}">
<a href="{{ url('picture/externalphotoviewer') }}">
<i class="icon-bar-chart"></i> View Photo </a>
</li>
<li class="{{ request()->is('picture/about') ? 'active' : '' }}">
<a href="{{ url('picture/about') }}">
<i class="icon-bulb"></i> About </a>
</li>
<li class="{{ request()->is('picture/contact') ? 'active' : '' }}">
<a href="{{ url('picture/contact') }}">
<i class="icon-graph"></i> Contact </a>
</li>
Simply create a blade file inside your resources/views directory and then use #include e.g.
reasources/views/partials/header.blade.php:
<div class="nav-collapse collapse navbar-collapse navbar-responsive-collapse">
<ul class="nav navbar-nav">
<li class="dropdown dropdown-fw dropdown-fw-disabled active open selected">
<a href="javascript:;" class="text-uppercase">
<i class="icon-home"></i> Home </a>
<ul class="dropdown-menu dropdown-menu-fw">
<li class="{{ request()->is('picture/externalphotoviewer') ? 'active' : '' }}">
<a href="{{ url('picture/externalphotoviewer') }}">
<i class="icon-bar-chart"></i> View Photo </a>
</li>
<li class="{{ request()->is('picture/about') ? 'active' : '' }}">
<a href="{{ url('picture/about') }}">
<i class="icon-bulb"></i> About </a>
</li>
<li class="{{ request()->is('picture/contact') ? 'active' : '' }}">
<a href="{{ url('picture/contact') }}">
<i class="icon-graph"></i> Contact </a>
</li>
</ul>
</li>
<li class="dropdown dropdown-fw dropdown-fw-disabled">
<a href="javascript:;" class="text-uppercase">
<i class="icon-home"></i> Upload </a>
<ul class="dropdown-menu dropdown-menu-fw">
<li>
<a href="{{ url('photo/create') }}">
<i class="icon-bar-chart"></i> Upload Photo </a>
</li>
<li>
<a href="{{ url('photo') }}">
<i class="icon-bulb"></i> View Photo List </a>
</li>
</ul>
</li>
</ul>
</div>
Then replace the header code in your other blade files with:
#include('partials.header')
NB
If you change the location of the header you will need to update the #include's as well e.g.
e.g. resources/views/layouts/main/header.blade.php would be #include('layouts.main.header')
Hope this helps!
How to format Laravel Link with <li> and <span> tags, for an example:
Laravel Link
{{ link_to('home', 'Home') }}
Should have to set like this
<li>
<a href="home">
<i class="icon-text-width"></i>
<span class="menu-text"> Home </span>
</a>
</li>
can someone please help me to create Laravel base link with that html tags, thank you
As far as i know, you can not do that using {{ link_to('home', 'Home') }}. However, instead you can do something like the following:
<li>
<a href="{{ route('home') }}">
<i class="icon-text-width"></i>
<span class="menu-text"> Home </span>
</a>
</li>
or you can use url() helper function.
<li>
<a href="{{ url('/') }}">
<i class="icon-text-width"></i>
<span class="menu-text"> Home </span>
</a>
</li>