Cómo implementar datos estructurados JSON-LD en WordPress sin plugins

2. Iván bravo
Consultor SEO-SEM
www.linkedin.com/in/-ivan-bravo
@_ivanbravo_

3. ¿por dónde empezar?
DOCUMENTACIÓN OFICIAL GOOGLE
DEVELOPERS
En la documentación de Google,
se encontrará toda la
información referente a datos
estructurados, tipos, código, etc.
https://developers.google.com/sea
rch/docs/guides/
VALIDADOR DE DATOS
ESTRUCTURADOS GOOGLE
Servirá para validar nuestro
script, y comprobar que
efectivamente, el código no tiene
errores.
https://search.google.com/structure
d-data/testing-tool
Más información: https://json-ld.org/ y https://schema.org/docs/schemas.html

4. obtener el script del tipo de
dato que necesitamos
En el ejemplo, se utilizará el tipo ‘Product’
https://developers.google.com/search/docs/data-types/product
Clic en la opción> ‘Ver lenguaje de marcado’

5. Redirige a la pantalla del validador de datos
estructurados de Google

6. Al validar el script, comprobaremos que no contiene errores,
es por eso, que será nuestro script base, para modificarlo
después a nuestras necesidades

7. Antes de modificar el script, debes
saber
• JSON (JavaScript Object Notation - Notación de Objetos de JavaScript) es un formato ligero
de intercambio de datos. Leerlo y escribirlo es simple para humanos, mientras que para las
máquinas es simple interpretarlo y generarlo.
• Un documento JSON siempre debecomenzar y cerrar con llaves { } , de lo contrario
tendremos errores en el código.
• Un objeto JSON siempre es igual. Se puede leer fácilmente los parámetros CLAVE : VALOR.
Estos parámetros siempre van entre comillas dobles “ ”
• Los dos puntos ( : ) son obligatoriosy van justo despuésde las doblescomillas de la clave
Ejemplo:
{
"clave": "valor"
}
{
“nombre”: “Pepito”
}

8. • Si necesitamos que el objeto JSON contenga más de un valor, entonces
cada pieza CLAVE: VALOR, debe de ir separado por coma ( , ) En el
último parámetro no es necesario colocarla.
Ejemplo:
{
“clave 1”: “valor 1”,
“clave 2": “valor 2”,
“clave 3“: “valor 3”
}
{
“nombre": “Pepito”,
“direccion”: “calle Molona 3”,
“dni”: “45678904-H”
}

9. • Los parámetros que empiezan por @ NO se pueden modificar. Por
ejemplo, @context, @type son las claves que utiliza Google para
identificar los datos estructurados. Es por esto, que NO pueden/deben
modificarse.
• El script puede llegar a ser largo y complejo, por lo que, si al modificarlo
e intentar validarlo, aparecen errores, lo más probable es que sea
producido por una coma ( , ) o llave { } mal abierta o cerrada.

10. Modificando el script a nuestras necesidades
• Para el parámetro “image” indicaremos la ruta de la imagen que previamente hemos subido a
la biblioteca de medios de WordPress. Ejemplo: https://tudominio.com/wp-
content/uploads/2018/05/mi-imagen-molona.jpg
• En este caso particular, se ha prescindido de la parte en la que se pueden especificar ofertas y
precio, pero puedesutilizarlas si lo deseas.El resultado final del script quedaría así:

11. VALIDAR EL SCRIPT
Validar el script y comprobar que nuestro script no tiene errores

12. VALE, Y AHORA… ¿DÓNDE COLOCO EL <script> EN
MI WORDPRESS?
Dirigirse a la Página o Entrada donde se desee implementar los datos estructurados. En
la parte superior, se encontrará un desplegable que permite ver las ‘Opciones de pantalla’

13. Hacer scroll con el ratón, hasta encontrar en la página/entrada,una
nueva sección llamada ‘Campos personalizados’

14. Un poco más abajo, se encontrará la siguiente opción: ‘Añadir nuevo campo personalizado’
Columna NOMBRE, rellenar con el nombre de variable: schema. Es importante llamar a la
variable por este nombre y no otro. En la columna VALOR, pegar el script que se ha validado
anteriormente:

15. ¡espera! Todavía no hemos
acabado
Queda añadir un trozo de código en nuestro archivo de WordPress
header.php
¿Cómo accedo a este archivo?
• Puedes acceder a él y modificarlo vía FTP (Filezilla)
• Puedes acceder a él y modificarlo a través del menú WordPress:
Apariencia > Editor > header.php

16. Añadir el siguiente código PHP, justo
antes del cierre de la etiqueta </head>
<?php
$schema = get_post_meta(get_the_ID(),’schema’, true);
if(!empty($schema)) {
echo $schema;
}
?>
¡no olvidar guardar los cambios!
La variable quecontiene los microdatos se
llama“schema”

17. ¡¡Y ya está!!
Guarda los cambios y refresca la página/entrada. ¡¡Ya están
implementados los datos estructurados JSON-LD!!👍
Para comprobarlo, teclea Ctrl + U en el navegadorpara ver el
código fuente. Ahora, teclea Ctrl + F y escribe en el buscador la
palabra ld+json. Se debería ver justo antes del cierre de la
etiqueta </head>, todo el script que has implementado.

18. Iván bravo
Consultor SEO-SEM
www.linkedin.com/in/-ivan-bravo
@_ivanbravo_