 Bueno, buenas tardes. Buenas tardes. Aquí por el left. Ahora sí, ¿no? Bueno, pues... Hoy vamos a hablar un poquito de esquemas. Que básicamente lo que... vamos a conocerle un poquito de del código. No sé si esta interfaz es familiar para alguno. Por ahí, ¿no? Visualco, efectivamente. Bueno, el propósito que tengo yo para esta presentación es que perdáis un poquito miedo al código, ¿vale? Todo está hecho con código, ¿vale? Y más que todo para que no os formalizáis un poquito más porque realmente vaya a ver que más es lo que nos va a dar la diferencia de desartibilidad para hacer el esquema, ¿vale? Bueno, aquí por ejemplo el código de abajo mostraría una imagen en esta presentación, ¿vale? Bueno, yo soy David Pérez ya me han presentado tengo una agencia llevo sobre todo desarrollo y marketing y también tengo una página personal en davidpérezprocuar.com y otra fricada que me he inventado aquí, aquí por la tonidad pero luego en la página web veréis que soy yo el código. Bueno... Chabladica que se me ha inventado uno a última hora de la noche. Bueno, ¿qué son los esquemas? Los esquemas son realmente un fragmento de código que tú le añadas en la página web y que le da una semántica a la página web, ¿vale? para que los buscadores digamos que interpreten mejor nuestro contenido, ¿vale? Es un conjunto de etiquetas, ¿vale? Había tres conjuntos de etiquetas y la que se está imponiendo y la más fácil de implementar es la que voy a explicar yo, ¿vale? Y bueno, eso que ofrece semántica sobre todo porque dice de qué va ese contenido y las distintas variables que tú has utilizado y luego la districción de Google veremos que nos dice que cuanto más específicos seamos es decir, cuanto más variables demos, mejor, ¿vale? Hay una discusión que si le damos mucha información a Google hasta qué punto, ¿no? Estamos perdiendo tráfico solo se queda en el buscador, ¿bueno? Eso no nos vamos a discutir hoy sólo simplemente para implementar, ¿vale? Bueno ¿Qué son las esquemas? Por las esquemas, esos son los fragmentos y en la práctica lo podamos ver aquí en un resultado de búsqueda con una película tampoco demasiado buena pero bueno, vemos dos estrellas, tres estrellas de superlópez, ¿vale? Pues si os dais cuenta en los resultados de búsqueda los dos primeros fueron de Wikipedia, ¿vale? y el tercero y el cuarto eran de portales de portales de tema de de películas, ¿no? de valoraciones, de un catálogo de películas, ¿vale? Philanfinity y de Cartelera y en la última, aunque los dos tienen esquemas, ¿no? porque muchas veces os dais cuenta que cuando montamos un esquema en nuestras páginas web Google interpreta si mostrarlo o no ahí ya no lo controlamos, nosotros lo que intentamos es que entiendan mucho mejor y a partir de ahí alguna vez se nos vendrá mucho mejor con el tema del esquema por aquí, por ejemplo cogió la variable de 107 minutos, la distribuidora es la calificación, ¿vale? pues esto es un pequeño ejemplo que es más fácil y ahora veréis cuántas posibilidades hay ¿por qué hay que utilizar el código a la hora de hacer los esquemas? ¿por qué? bueno, mientras antes la forma de conocer si tenemos un esquema bien implementado en nuestra página web es con la herramienta de Google Chrome para observar esquemas, se llama Structure Data Destin Tool que básicamente lo que hacemos es que cuando lo instalamos en nuestro Chrome, en un iconito que nos aparece arriba a la derecha que es parecido a esto, ¿no? ahí tiene el linde de descarga podemos ver aquí veis el ejemplo de Film Infinity podéis ver todas las variables que ha definido esa página web con el esquema ¿vale? aparte de implementar esquemas muy buenos también, navegar otras páginas similar a la nuestra a ver cómo han implementado el esquema y aquí por ejemplo bueno, mucho más largo pero bueno, aquí veis que ha utilizado el tipo de esquema Movie nombre superlópez la imagen cuando se publicó, la duración el género, fijaros la cantidad de variables que le estamos dando a Google sobre esa película ¿vale? ¿qué podemos hacer? ¿qué necesitamos para para implementar esquemas en nuestra página web de WordPress? bueno, pues necesitamos dos cosas principalmente necesitamos los custom postage que quien no lo conozca es una forma de crear secciones de contenido yo siempre lo explico a los clientes de forma para que no entiendan secciones de contenido son secciones de contenido en tu página web aparte de lo que son las páginas y la entrada con este caso, en esta página web le creamos una página de productos fuera de lo que hay Google Comer ¿vale? porque no quería vender bueno, también podemos utilizar Google Comer para catálogo de productos, pero en este caso no nos hizo falta aquí hicimos un postage de clientes de profesionales, recetas, como veis podemos crear muchas secciones de contenido y darle mucho valor, mucho información a la página web y luego dentro pusimos custom fields que hay diferentes plugins yo utilizo metabox que directamente con un array va definiendo las varias personalizadas pero bueno, también utilizáis mucho el ACF ¿vale? cualquiera de ellas es suficiente entonces lo que hacemos es que definimos dentro de un postage esta una captura de la parte de abajo y por ejemplo, el ejemplo que estoy tratando es de una empresa de congelado pues aquí pusimos el formato del congelado, el tamaño el origen, etcétera una serie de información que hay importante para el cliente y que quiere mostrar en la página web de variables personalizadas pues nosotros digamos que podemos mostrar esa información bueno, pues ya tenemos el esquema, sabemos lo que es sabemos como implementarlo o por lo menos hacemos la idea y ahora vamos a entrar un poquito ¿cuánto esquema hay en esquema.rg? bueno, esquema.rg es un portal que crearon los distintos buscadores Google, Bing y que luego después son Yandere y todos estos buscadores y en definitiva han hecho como un estándar de esquema que que ahí vienen todas las propiedades dentro de cada esquema, vienen todas las propiedades que tiene cada esquema ¿vale? y luego también Google ha definido en este documento pues una serie de directrices de calidad que debemos respetar para que bueno no creemos porque ya también están haciendo algoritmos para desechar esquemas y penalizar páginas web que estén haciendo más uso del esquema ¿vale? pero básicamente la idea es que lo que tú representen el esquema esté representado también visiblemente en la página web ¿vale? y también te dan otras directrices que bueno, en la urre le tranquemente lo veis pero bueno, básicamente es la especificidad que decíamos que cuantas más propiedades demos mejor, ¿vale? mejor no interpretar bueno pues dentro del esquema.org hay una urre le que se llama full y ahí empezáis a ver los esquemas y bueno, yo me puse a contar una tarde y al final me voy a aburrir y esto es que no sale aquí ¿no? no más cambiado más cambiado la versión bueno pues ¿qué? no, no te preocupes en total yo lo puse a contar y son 1.022 esquemas a día de hoy y aparte están implementando más esquemas que en enero hace bueno 22 de enero crearon otras nuevas especificaciones y están implementando nuevas esquemas como vemos hay una cantidad de esquemas impresionantes y que en definitiva se agrupan en 9 mi chuletilla pero lo tenía en la prestación le agrupan en 9 grupos ¿vale? que me venía aquí los grupos son acción creative work que por ejemplo los esquemas más comunes son website article, portfolio curso, es decir, una serie de esquemas que hay definidas para cada uno entonces en esta urre le tranquilamente la podéis ver y salen una cantidad de esquemas impresionantes, lo que hay que buscar es la que más se parezca a nuestro contenido y a partir de ahí podamos definir ¿vale? un evento también podemos definir un objeto intangible productos médicos organización por ejemplo es muy interesante donde voy a dar un ejemplo de un esquema donde podemos mostrar la organización de la empresa y ahí damos pues hasta el liré de la organización el nombre, la gente que trabaja ¿vale? luego tenemos personas también podemos hacer un esquema de personas puede ser una página web que se dice que a dar información de una persona y podamos más dar más información también de sitios o de productos ¿vale? como veis ahí se agrupan estas 1.022 se agrupan en 9 grupos de categoría y realmente nosotros donde vamos a trabajar que sí siempre va a ser y en Creative Work y eventos también yo creo que son los 3 grupos más comunes porque tema de médicos o sea que tengamos un tema hasta ahí esquemas para especificar huesos y todo o sea que hay una digo hay 1.022 en total bueno ¿qué hacemos? nosotros cuando entramos en un esquema y ahora voy a explicar un poquito el paso como lo hemos hecho aquí explicaba los 3 grupos de etiqueta nosotros nos vamos a quedar con el json ld entonces en ese listado de 1.022 esquemas entramos al que nosotros vayamos que sea más parecido a nuestro tipo de contenido entonces entramos nos sale una cantidad de ejemplos este es el ejemplo 3 y nos da un código es un script tipo application ldjson bueno que no deis mucho miedo el código pero básicamente son propiedades propiedad de context esquema, tipo url por cada una de las propiedades vamos definiendo el valor y aquí por ejemplo podemos encontrarnos con un conjunto de valores que se van definiendo por ejemplo de organización como nosotros nos vamos a utilizar solo va a haber una organización normalmente en una página web pues así la podemos meter en la página de inicio y podemos meterlo con el texto directamente bueno como meter esa esquema podemos hacerlo de dos formas podemos hacerlo a través de bueno, yo recomiendo esto un poco a través de my plugins no se si conoce este directorio que hay en WordPress dentro de WP content nosotros podemos crear un su directorio que se llama my plugins y esto lo que hace es que este function siempre se va a cargar es un plugin que siempre se carga si o si yo lo utilizo por ejemplo para definir los post-times los custom post-times siempre lo definen my plugins porque nunca va a haber no se va a desactivar una sección sería una situación muy extraña que eso sería algo muy atípico pero lo normal es que nosotros en nuestro propio directorio tengamos nuestro function y aquí definamos un plugin aquí pone esta clavecer a todo este código lo podéis después descargar en la página web y podéis definir vuestro propio código para ser un poquito más ordenaditos que habíamos hablado mucho de ser organizados pues yo lo que hago es que lo pongo en un su directorio dentro de ese my plugins y aquí voy definiendo los distintos esquemas que voy a definir en la página web entonces hago un PHP por cada esquema que defino que a lo mejor el PHP tiene 20 o 30 líneas de igual no hace falta que sea muy largo pero al final así lo tienes a golpe de un vistazo el directorio va viendo todos los esquemas que va definiendo en otra dispositiva tenía un plugin que se llama Codes Nippets que debe de utilizar el código directamente nosotros le damos el snippet del código PHP y ese código PHP se carga igual que esto yo lo recomiendo hacerlo por un my plugins porque al final no estamos aguardando lo que es código en base de datos sino que directamente se ejecuta mucho más rápido y bueno son unos microsegundos que al final no son necesarios bueno dentro de este archivo organizarte un punto PHP vale añadimos un código os lo voy a explicar porque de verdad que es sencillo primero utilizamos una acción esta acción lo que está diciendo es la siguiente es el lugar el lugar se llama WPGAT que es en la cabecera del WordPress y la función esquema Organizating lo que decimos es que en WPGAT cargame esta función cargame esta función que se llama esquema Organizating yo le he puesto este nombre para disponer que vosotros queráis WPGAT si que es el nativo de WordPress que lo vamos a poner en la cabecera vale y luego utilizamos un condicional que aquí es lo que va a definir donde va a ir nuestro esquema vale porque esto se va a cargar siempre en todos los WordPress en todas las páginas pero el condicional va a ser que nos define donde se va a cargar porque nosotros vamos a después meter el código que habíamos visto antes de ldjson lo vamos a cargar solo en la página de inicio por ejemplo este sería el esquema de Organizating y todo esto vuelvo a insistir que es por rendimiento y por tema de versatibilidad por las 1022 esquemas hay plugins que dan esquemas ya he hecho, incluso se adapten a los custom fill pero el que más tienes tiene 15 esquemas fijaros de los 1020 a los 15 hay una variedad bastante importante entonces al final nos hemos forzado a utilizar códigos porque a no ser que tengamos esos 15 esquemas no os puede utilizarlos vale nosotros con estas tres líneas nos cuesta cuatro líneas ya podemos sacar el json los condicionales pues tenemos todos los condicionales de WordPress para utilizar si queremos que salga en una sección de contenido tipo recetas pues isingular y el nombre de la receta que hayamos puesto del slug y así cada una de las por ejemplo aquí no sé si se ve bien pero bueno básicamente este sería el código completo del snippet de la organización vuelvo a repetir adaption utilizamos la función utilizamos el condicional y aquí utilizamos todo el código como organización va a ser siempre el mismo es para una página lo normal es que no lo cambiemos con texto normal utilizo el type organizativo el adres se lo pongo y voy poniendo aquí las distintas propiedades que he ido cogiendo de los ejemplos que me daba la página web esquema.rg al final lo que he hecho es que con todas estas cuatro líneas he cogido y copiado y pegado el texto y lo he sacado y esto al final te sale dentro de la cabecera de WordPress que solo vamos a poderlo verlo con la herramienta que habíamos de WordPress y aquí lo he explicado por parte y al final esta es la parte que nosotros tenemos de de organización que pasa cuando tenemos variables personalizadas pues claro el código ya nos sirve para todas las páginas tendremos que personalizarlos aquí por ejemplo se nos complica un poquito más pero no mucho más lo único que se nos complica es y singular si os dais cuenta y singular lo que quiere decir es si la página que me está enseñando yo por ejemplo creé un postage que era formación este es una página web un extracto de una página web de curso entonces yo le llamé al postage formación como eso es libre pues cada uno le pone el que quiere yo puse por formación entonces cuando sea la página formación cargamente esto el código que el esquema claro ahí en el postage de curso luego el nombre el nombre por ejemplo le dije pues cógeme el título de la entrada la descripción pues cógeme el extracto y luego fui cogiendo más propiedades por ejemplo start date start date aquí coge la variable personalizada de start date aquí del inicio del curso y finish date end date sería aquí estaría lo que hacemos es que con variables personalizadas nosotros personalizamos el esquema para que funcione para todo el postage vale y entonces lo vamos personalizando aquí por ejemplo el ejemplo es de recetas y luego es que la empresa de congelado son recetas y entonces aquí el type recipe y luego he ido cogiendo propiedades y variables personalizadas del propio WordPress y al final me hace un código que yo lo voy a evaluar entonces yo creo que esta función me carga el esquema y ahora digo bueno me lo está haciendo bien a mí me ha pasado me ha faltado una coma y no te das cuenta porque eso realmente lo saca directamente y tú no lo ves entonces qué haces que realizas prueba el propio Google te da una herramienta de prueba de datos estructurado que te permite el código que tú la has puesto o sea el código que tú sacas ya de la página web la puedes pegar y le puedes dar a ejecutar prueba lo que te va diciendo es te has equivocado te has faltado una propiedad te has faltado otras entonces en definitiva aquí haciendo prueba metiendo la función ejecutando el código sacando ese texto lo vas pegando aquí y vas ejecutando prueba hasta que tú ya tienes un esquema que funciona para ti ¿no? y ya publicamos la página web publicamos el código o si ya lo teníamos de antes ya lo publicamos ¿qué pasa? que si nosotros tenemos Google search console que os lo recomiendo ahora es la herramienta que tiene Google para saber cómo posiciona tu página en Google ¿no? tiene una serie de herramientas y una de las herramientas que tiene es los esquemas si le ha dado la importancia a Google nos va a crear, fijaros aquí en mejoras esto es en su menú nos va a crear un menú por cada uno de los esquemas que tengamos definido en nuestra página web o sea fijaros ya la importancia que le está dando Google search console aquí doy ejemplo de un error que me generó que hice el post-igno el snippet de receta y me daba 42 problemas o sea algo estaba haciendo mal y te daba aquí un diagnóstico y era que no había definido la propiedad NAMI que NAMI es el título pues lo arreglé y al final al final me salieron 8 problemas que lo solucioné y al final lo que te da es la interfaz para que tú puedas ver como los esquemas que están detectando y si hay algún problema que te va a ir definiendo vale, entonces digamos que tenemos 3 herramientas definitivas para Google tenemos la de Google Chrome para ver como están definidas esquemas en otros sitios la de la herramienta de fragmentos test de fragmentos para ver que todo está bien y luego el Google Sankosor que sería el definitivo que ya se ve en las páginas y el que ya está funcionando y ya te dice problema o te da sugerencia y te dice más cosas definitiva pues bueno esto es un lo que yo quería es, primero que para eso 1.022 esquemas que nosotros podamos estar con las secciones de contenido debemos utilizar los códigos, sí o sí a no ser que no tengamos casi secciones de contenido y con las 15 que hemos visto en algún plugin nos valga que por eso el código te da más bestia actividad, es decir, nosotros realmente cogiendo ejemplos de esos esquemas los podamos implementar aunque haya dado un poquito o que el código se haga un poquito es fácil de implementar porque realmente cogemos el EDJson y lo pegamos y le damos un condicional y lo podamos mostrar cuando queramos que hay muchísimos ejemplos y que cuantas más propiedades esa actividad la utilicemos para decir que cuantas más propiedades definimos mejor y que bueno como recompensa podrás destacarse en el buscador, en las resultados de búsqueda podemos salir un poco más destacados y nuestro posicionamiento, que eso lo hice va a mejorar bastante más porque nuestro buscador Google va a conocer mejor nuestro contenido así que bueno eso es un poco todo lo que tenía preparado a vosotros