SEO en laravel

En este artículo os vamos presentar la librería SEOTools, una de nuestras librerías de SEO favoritas para laravel. Vamos a utilizar esta librería para añadirles a las vistas de nuestra página los meta tags necesarios para los buscadores y redes sociales.

Instalando y configurando SEOTools

Instalaremos mediante composer nuestra librería de seo para laravel:

composer require artesaos/seotools

Nos dirigimos al archivo config/app.php para añadir el provider y su facade

'providers' => [
        ...
        Artesaos\SEOTools\Providers\SEOToolsServiceProvider::class,
    ],
 'aliases' => [
        'SEO' => Artesaos\SEOTools\Facades\SEOTools::class,
    ],

Una vez hecho esto, hemos terminado con nuestro archivo config/app.php y ahora nos dirigimos a bootstrap/app.php y añadimos la siguiente linea antes del return $app:

$app->register(Artesaos\SEOTools\Providers\SEOToolsServiceProvider::class);

Ahora para terminar con la instalación básica de SEOTools, vamos a generar seotools.php, que nos permitirá ponerle valores por defectos a nuestras etiquetas. La generación de este archivo la haremos ejecutando este comando:

php artisan vendor:publish --provider="Artesaos\SEOTools\Providers\SEOToolsServiceProvider"

En este archivo, encontraremos los valores por defecto de las etiquetas OpenGraph, que será las que le indiquen a redes sociales como facebook o linkedin que deben mostrar cuando añades una enlace de tu aplicación en una de sus entradas. También, en el apartado meta se encuentran las etiquetas por defecto que mostrará el navegador, como el titulo y su descripción entre otras.

Por último, podemos encontrar en este archivo las tags de Twitter, que como podemos imaginar, representará los valores por defecto de ésta red social a la hora de compartir nuestra web en un twit.

Os recomendamos que echéis un vistazo a este artículo que habla sobre los meta tags de redes sociales

Añadiendo los «Meta Tags» a Laravel

Ahora que ya tenemos lista la librería de SEO para ser utilizada en nuestro proyecto, nos dirigimos al controlador que retorna la vista a la que queramos añadirle las etiquetas y escribimos lo siguiente:

<?php

...
use SEO;

class HomeController extends Controller
{
    ...
    ...

    public function index()
    {
        SEO::setTitle('Página SEO');
        SEO::setDescription('Ejemplo de descripción de la página');
        SEO::opengraph()->setUrl('https://www.nigmacode.com');
        SEO::setCanonical('https://www.nigmacode.com');
        SEO::opengraph()->addProperty('type', 'articles');
        SEO::twitter()->setSite('@Nigmacode');

        return view('home');
    }
}

Hacemos uso del facade «SEO» que añadimos en nuestro archivo config.php, le indicamos que queremos que muestre en cada tag. Podemos observar que no están todas las etiquetas que tenía el archivo seotools.php, por lo cual, utilizará los valores por defecto que escribimos en éste.

Ahora, solo quedaría añadir al head de nuestro vista (En mi caso home) el siguiente atributo:

<head>
    ...
    {!! SEO::generate() !!}
</head>

De ésta forma, ya tendríamos las etiquetas añadidas y nuestra página lista para ser compartida.

Si inspeccionamos la etiqueta <head> de nuestra vista, este sería el resultado: