How to create pagination using Laravel 6? - php

Question

i am starting to create an ads site, i display 36 products in a blade index with success, my problem is that 36 of the products display, the leftovers do not display, and i don't know how to display the 2nd page and 3rd and so on depending on the number of pages to display the other products.
AnnoncesController.php
public function index()
{
$categories = Category::all();
$annonces = Annonce::paginate(36);
return view('annonces.index')->with([
'categories' => $categories,
'annonces' => $annonces,
]);
}
index.blade.php
<div class="row mix-grid thumbnails">
#foreach($annonces as $annonce)
<div class="col-md-3 col-xs-3 mix {{ $annonce->category->slug }} cat_all">
<a class="thumbnail-item">
<img src="{{ asset('storage/'.$annonce->image) }}" alt="category" />
</a>
<div class="thumbnail-data">
<h5>{{ $annonce->titre }}</h5>
<p>{{ substr($annonce->description, 0, 34) }}...</p>
<div class="thumbnail-info" align="center">
<button class="btn btn-primary"><span class="fa fa-edit"></span></button>
<button class="btn btn-primary"><span class="fa fa-trash-alt"></span></button>
<button class="btn btn-primary"><span class="fa fa-eye"></span></button>
</div>
</div>
</div>
#endforeach
</div>
<ul class="pagination pagination-sm pull-right">
<li class="disabled">«</li>
<li class="active">1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>»</li>
</ul>

Answer 1

You can do like this
#if($annonces->hasPages())
{{ $annonces->links() }}
#endif
If you want custom pagination, save the following as a new blade file and add name to ->links() method as a parameter.
#if ($paginator->lastPage() > 1)
<ul class="pagination">
#if(($paginator->currentPage() > 1))
<li class="{{ ($paginator->currentPage() == 1) ? '' : '' }}">
<<
</li>
#endif
#for ($i = 1; $i <= $paginator->lastPage(); $i++)
<li class="{{ ($paginator->currentPage() == $i) ? 'current' : '' }}">
{{ $i }}
</li>
#endfor
#if(($paginator->currentPage() != $paginator->lastPage()))
<li class="{{ ($paginator->currentPage() == 1) ? '' : '' }}">
>>
</li>
#endif
</ul>
#endif