Limitar el número de enlaces en la paginación con Laravel 6 y superior

En versiones anteriores a Laravel 6 teníamos el método onEachSide que nos permitía definir el número de enlaces a izquierda y derecha en la paginación de Laravel. En las nuevas versiones esto ha cambiado y ahora debemos hacerlo de otra forma, pero por suerte tenemos muchas opciones.

En esta ocasión me voy a centrar simplemente en modificar la template de paginación para TailwindCSS para que se muestren 2 enlaces a la izquierda y 2 enlaces a la derecha, verás que modificar este comportamiento es muy sencillo.

Para este ejemplo voy a utilizar el proyecto final del curso CRUD con Laravel 8, verás que con unos pequeños cambios podemos obtener el siguiente resultado:

Publicar los recursos de paginación de Laravel Lo primero que debemos hacer es publicar los recursos de paginación de Laravel para tener los archivos blade necesarios para modificar la plantilla de paginación utilizada por TailwindCSS.

php artisan vendor:publish --tag=laravel-pagination

Una vez hemos publicado los recursos, abre el archivo resources/views/vendor/pagination/tailwind.blade.php y modificar el condicional donde se representan los enlaces de la paginación por el siguiente código:

{{-- Array Of Links --}}
@if (is_array($element))
    @foreach ($element as $page => $url)
        @if ($page >= $paginator->currentPage() - 2 && $page <= $paginator->currentPage() + 2)
            @if ($page == $paginator->currentPage())
                <span aria-current="page">
                    <span class="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5">{{ $page }}</span>
                </span>
            @else
                <a href="{{ $url }}" class="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 hover:text-gray-500 focus:z-10 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150" aria-label="{{ __('Go to page :page', ['page' => $page]) }}">
                    {{ $page }}
                </a>
            @endif
        @endif
    @endforeach
@endif

La línea 4 de nuestro código es el cambio que debemos aplicar, simplemente queremos 2 enlaces a la izquierda y 2 enlaces a la derecha, de ahí en adelante cualquier cambio adicional que desees realizar lo podrás llevar a cabo desde este archivo de forma rápida y sencilla.