 Pues buenas tardes y bienvenido al último taller de la tarde ya. Hoy tenemos aquí a Ivón Ascoidia, que es un chico nuevo de la comunidad de WordPress. Parece que ha empezado en este mes y viene a contarnos algo. Así que no me voy a enrollar y os dejo con él, ¿vale? Bueno, bueno, bueno. Lo primero, hola a mi familia para que vean que estoy vivo, pero como no les hablo casi, ¿dónde estás de chaval? Vale, vamos a intentar que sea un taller dinámico, que podéis hablar, que podéis preguntar, que el micro esté moviendo de un lado para otro, ¿de acuerdo? No me gustaría que sea esto una charla de la cable yo solo y solo miráis, porque para eso hacemos un vídeo, os lo pongo y otra cosa, ¿vale? Entonces, vamos a intentar hacer cosas un poquito más avanzadas con WordPress, quien de aquí no sabe desarrollar, levantar la mano sin problemas, no pasa nada, ¿vale? Quien de aquí sabe un poquito, ya toca un poco del código de WordPress y demás, y el resto entiendo que ya sabéis un poquito más y está más avanzado. Entonces, la idea es que podéis ver cómo cogiendo WordPress básico, he cogido este tema que es antiguo de WordPress, porque es el que mejor se estructura en plan sencillo, ¿vale? Una barra lateral y el contenido en el centro. Entonces, quiero que veáis cómo podemos hacer que un WordPress normal se convierta, por ejemplo, en una biblioteca. En este caso va a ser una biblioteca, en cualquier otro caso podría ser lo que queráis, ¿vale? Y a partir de ahí, en la mitad para adelante, vamos a intentar que la biblioteca sea interactuable por los usuarios, que un usuario pueda marcar el libro como leído, ¿vale? Esto sirve por cualquier cosa, podcast escuchado, vídeo visto, película vista, cualquier cosa que queréis hacer, ¿vale? Las nociones son las mismas. Entonces, vamos a ir muy poco a poco al principio. Por lo tanto, tenemos aquí el tema y aquí tenemos los dos temas. Creo que hay gente que ha estado en la charla de antes de Kike, igual habéis visto los vídeos en orden y ha dicho, no sé qué es un tema hijo ni para qué sirve. Venga, pues lo explico yo, ya que es código. Este sería el tema padre, ¿de acuerdo? Y este sería el tema hijo. El tema hijo lo que hace es coger todas las funcionalidades del tema padre. Pero si el tema padre se actualiza, no pierdes tu código porque está en el tema hijo. ¿Vale? Esos agrantes rasgos la recomendación de por qué utilizar un tema hijo. ¿De acuerdo? Entonces, en este caso, para este ejemplo no haría falta, porque es un ejemplo de usar y tirar, pero ya que me gusta hacer las cosas bien, por lo hacemos así. Me gusta hacer las cosas bien, pero tampoco tan bien como para perder tiempo. Por lo tanto, el código que vamos a utilizar lo vamos a poner en el tema hijo y no en un plugin. Todo lo que sea código útil del proyecto tendría que ir en un plugin. Así en un futuro, si quieres cambiar de tema, no pierdes ese código. ¿Vale? Todo lo que tenga que ver con el código del tema iría en el tema. ¿Qué quiere decir eso? Si nosotros queremos aquí la opción de poner libros, lo que quiero es que eso se mantenga o que en cambio de tema. ¿De acuerdo? Por eso es importante a trabajar de esa forma. Entonces, en este caso queremos que aquí aparezca los libros. No sé si queréis que empieces del inicio o no. Supongo que sí. Entonces, voy a desactivar este plugin. ¿Vale? Y os voy a explicar. Como veis, de repente libros ha desaparecido. Entonces, dentro de WordPress tenemos la opción de crear plugins. ¿Vale? De instalar plugins y los plugins nos dan funcionalidades. Y dentro de WordPress tenemos entradas y páginas. Estos son tipos de contenido. Tipo de contenido de entradas, ¿vale? Y tipo de contenidos páginas. Si os deis cuenta, cuando clic en páginas, arriba pone post type igual page. ¿Vale? Pero es un post type, es un tipo de post. Entonces, si estos son los post, aunque en castilla no lo traducimos como entradas, si estos son los post y estos son los post type, si existe uno de tipo página, ¿por qué no iba a existir uno de tipo book, libro, película, coche, caravana, lo que sea? ¿Vale? Entonces podríamos ir creando nuevos tipos de contenido. Cursos, podcast, gu comers, también es productos. Todos son tipos de contenidos. ¿Vale? Para hacer tipos de contenidos, tenemos dos opciones. Utilizar código, utilizar un plugin. Es seguramente más opciones, pero así sería lo más sencillo. En cuanto a plugins, hay muchos. ¿Vale? Pero en este caso, vamos a ir un pasito más allá y aparte de hacer un custom post type de tipo libro, vamos a hacer que tenga campus personalizados. ¿Qué quiere decir eso? El título, el contenido del post y demás son campus, que tiene WordPress per se. Un campus personalizado sería añadir un nuevo tipo de campo. Por ejemplo, el autor, el año en que se escribió el libro. ¿De acuerdo? Serían campus personalizados. ¿Qué podemos personalizar? Entonces tenemos dos cosas a hacer en este caso. Quedar un tipo de contenido, que serán libros. Ya los libros, crearles unos campus personalizados. ¿Por qué? Simplemente para enseñaros cómo se hace. ¿Vale? A partir de ahí os podéis complicar la vida al infinito y si hay el tiempo luego que lo habrá, porque siempre dejo tiempo de sobra para preguntas y más, podemos ver ejemplos más avanzados de proyectos míos donde se utilizan código más avanzado. Entonces nuestro objetivo ahora mismo es que aquí aparezcan libros. La opción de código sería ir a generate UWP y aquí tenemos una opción que es post type generator. Se hace click, nos dice, mira, vete rellenando esto de aquí, te voy a generar un código, lo pegas en tu functions o en el plugin si queréis hacerlo perfecto y entonces ya tendréis un tipo de contenido. Por ejemplo, function name, podríamos poner aquí cpt libros. ¿Vale? En este caso podríamos decirle que soporta un tema hijo y demás, pero no hace falta y aquí le podemos decir UWC o, mira, bibliotecamos. Esto nos va a servir para hacer las traducciones, ¿de acuerdo? En este caso no vamos a hacer traducciones, pero nos va a venir bien y aquí es donde empezamos a poner el código, ¿de acuerdo? Entonces si aquí le vamos a update code, veremos que ya nos empieza a cambiar, a ver si aquí ya nos pone cpt libros. Entonces es una forma muy sencillita de ir rellenando un formulario y esto nos va a generar un código. Este lo copiamos, lo pegamos en el functions y ya está. Una vez que has hecho muchos de estas, seguramente esto ya lo tienes en un atajo de teclado y listo. Atajo de teclado sería mi parte de productividad, así es como lo podríais hacer o podéis instalar un plugin. ¿Por qué os enseño esto? Para que se veis aquí estos campos, esto es que aquí ponga libros, aquí puede poner también libros, aquí puede ser añadir nuevo libro, nuevo libro, ¿vale? Todo esto lo que hace es que cuando tú estás trabajando en WordPress esas palabras estén adaptadas a ese tipo de contenido. Generalmente también quizás es interesante que esto esté en inglés y luego lo traduzcas al castillano pero tu código esté en inglés, ¿vale? ¿Por qué? Pues igual en un futuro entra más gente a colaborar, quizás haces ese código que sea público entonces la persona que va a traducir eso a su idioma es mejor que esté en inglés que en castillano porque más gente lo va a entender, ¿de acuerdo? Entonces por norma general se recomienda que esté en inglés pero no pasa nada si lo ponéis en castillano. Si venimos aquí y vamos a plugins, en este caso vamos a añadir uno nuevo y aquí tenemos uno que es CPT UI, ¿vale? CPT sería custom post type, aquí tenemos post type generator, todo tiene que ver con el post type, ¿vale? Entonces aquí si instalamos este lo que nos va a permitir es seguir el mismo patrón de rellenar el formulario, solo lo mismo, ¿de acuerdo? Solo que en este caso se instaló un plugin. Por norma general en este tipo de plugins el problema es que desactivas el plugin y desaparece tu tipo de contenido, ¿vale? Y utilizar un plugin de estos para generar tipos de contenido y tener que mantenerlo activo, solo para que se mantengan pues es un poco faena, ¿vale? Por eso es interesante que aprendáis un poquito de cómo va esto y que veréis ahora que hayis copiar, pegar y funcionan. Entonces en este caso vamos a utilizar Advanced Custom Fills con la versión gratuita. Este nos va a permitir crear los campos personalizados pero hace unas versiones, han añadido la opción también de crear los custom post type. Entonces ya con un mismo plugin pues podemos hacer las dos cosas y dado que este teóricamente va a estar siempre activo para los campos personalizados pues mira, pues ya tenemos solo uno y listo. Entonces vamos a dar aquí activar y vamos a venir aquí a ACF y tenemos aquí tipos de contenido. Entonces veis aquí tengo libros porque soy un tipo que hace pruebas y luego no lo borra, le vamos a borrarlo y lo hacemos de cero, ¿vale? Entonces aquí en tipos de contenido le podemos añadir nuevo y esto que tenemos aquí es lo mismo que tenemos aquí. ¿Vale? Estos campos plural, singular, singular, plural es lo mismo, ¿vale? Entonces aquí tenemos Rina. Aquí ponen películas por la que pondría libros. Libro, tipo de contenido, vamos a poner libro. Y taxonomía sería poder asociarle por ejemplo categorías o etiquetas. Lo mismo, si nosotros tenemos entradas y tenemos categorías y etiquetas, estas dos de aquí si veis pone taxonomy igual category y si veis etiquetas pone taxonomy igual post tag. ¿Qué quiere decir eso? Que podríamos crear taxonomías personalizadas por ejemplo categorías, etiquetas y autores o géneros. Entonces podríamos asociar esos libros a esos géneros. ¿Vale? No tendríamos que utilizar categorías como tal. Podemos crear nuestra taxonomía, ¿vale? No vamos a hacer ese ejemplo, pero podríamos hacer. Entonces esto lo que haría es que lo mismo que en entradas tenemos estas dos podríamos asociarla aquí en las diferentes taxonomías que tenemos y en ACF veis que también podemos crear taxonomías desde aquí de forma sencilla. Esto te va a permitir una estructura de contenido pues de mayor calidad. Y si le dieramos aquí a configuración avanzada veríamos el resto de campos que tenemos aquí. Entonces en este caso podéis no darle a avanzada y no importaría ello este género de base colocado supuesto aquí. Queremos que sea público y en este caso la diferencia entre jerárquico y no jerárquico es las entradas por norma general, no son jerárquicas, escribe zona, otra, otra mientras que las páginas son jerárquicas por meter una página debajo de otra página. Depende del contenido que vayas a hacer te interesa que sea jerárquico o no. Entonces si vamos aquí a guardar cambios ya tenemos aquí libros. Y tenemos añadir nuevo libro. Entonces si veis automáticamente le ha puesto esta palabra aquí, ¿vale? Pero lo podremos configurar nosotros en configuración avanzada. Entonces si venimos aquí a tipo de contenido que tenemos libros, le podemos dar a editar y decir no, el libro os quiero gestionar la categoría. Ya el libro podemos asociar las categorías. Y el libro es como si fuera un pos más. De hecho vamos a borrar este también y vamos a dejarlo limpio. Entonces esto así lo tenemos perfecto. Entonces ¿qué ocurre? Que nosotros podemos darle añadir nuevo libro, hago un libro que si os ocurra es por si queréis decir uno. ¿Eh? Canción de hielo y fuego. ¿Canción? ¿Es libro o...? Perfecto. Es que igual es una canción y no un libro. Entonces problemas que tenemos otra vez. Que esto está aquí. Entonces nosotros tenemos aquí los libros, ¿vale? Vamos aquí a publicar y vamos a recargar. Entonces aquí en libros tenemos título, contenido, categorías y la imagen destacada porque en este caso la configuración que se ha puesto de forma automática te asocia la imagen destacada. Esto lo podéis quitar cuando habéis generado el post, ¿de acuerdo? Aquí en post tenemos diferentes opciones, título, contenido y luego podemos ir poniendo por el autor, podemos ir poniendo la imagen destacada o no. Si tú activas o desactivas estas cosas de aquí en este campo de aquí ves más o menos cosas. Entonces tenemos canción de hielo y fuego y aquí tenemos un texto. Perfecto. Entonces, ahora venimos aquí a nuestra web y vemos el libro. Lo vemos sin ningún problema. ¿Por qué? Porque dentro de la jerarquía de WordPress está utilizando la plantillita para mostrar artículos. Lo básico, ¿de acuerdo? Esto es como hay título y como hay texto pues lo muestras sin ningún problema. El problema que tenemos aquí es que queremos crear campos personalizados asociar información a este libro. Entonces, en este caso tenemos que hacer uso de ACF u otras herramientas, pero en este caso tenemos ACF y tenemos la opción de grupos de campo. Entonces podemos añadir un grupo de campo y en este caso podríamos decirle que sea de tipo texto y decirle que es el autor. Nombre de campo, sí que es importante ponerlo bien porque es el código que determina cómo se llama este campo de aquí para luego hacer la programación y demás como si fuera la ID. Entonces a mí me gusta mucho poner por delante que es un CPT y en este caso me gusta poner libro, que sería el CPT libro y le estoy asociando el campo de autor. Si autor vais a poner más cosas tipo nombre, edad, URL a su Twitter y cosas así podrías ponerle más apellidos por aquí detrás para que quede mejor. Pero luego cuando estás programando es muy visual y es CPT, libro, autor, nombre. Entonces esto es una recomendación. Aquí tenemos muchas más opciones pero ahora mismo no es el caso para verlo. Entonces aquí tenemos autor y podríamos poner otro que fuera de otro tipo por ejemplo podrías poner que fuera tipo correo electrónico contra señas, asociar una imagen y demás, ¿de acuerdo? Pero como no es lo que vamos a mirar hoy pues vamos a poner aquí año y listo, y aquí lo mismo. CPT, libro, year, y aquí pondría autor mejor ponerlo en inglés y aquí hubiera puesto book pero bueno, libro está bien. Vale, entonces una vez tenemos esto le ponemos un nombre CPT, libros y lo guardamos. Hasta aquí todo bien. Vale, entonces ahora si vamos al libro y recargamos aparecerán aquí los campos personalizados para poner el año y el autor. Alguien ha mirado con cara extraña, otros han dicho que nombre, ¿cómo va a funcionar? ¿Quién sabía que no iba a funcionar? Dos, solo dos. Jue. Público más difícil. La magia va a ser muy sencilla con vosotros. La cosa es que dentro de la CF tenemos la opción de decidir y definir cuándo se van a mostrar estos campos. No hace falta que se muestren en los artículos o en las páginas o en otros tipos de contenido. Entonces aquí en tipo de contenido en CPT es igual a libro. Vamos a guardar cambios recargamos y aparecerán o no. Ahora sí. Entonces aquí ya tenemos autor y año. Entonces ahora podemos ir asociando la opción a este libro. Que en este caso es el lide 17. Entonces, ¿en autor? ¿Quién es el autor? George, R.R. No sé si os estoy escribiendo bien, pero... No. Ah, vale. Este no es el de... Ah, sí, vale. Y el año... Venga, vamos a decir 1963. ¿Taba vivo hace años? Sí, no. Tan precondo puede ser. 79. Muy bien. Entonces, le podemos estar aquí a actualizar y ya tenemos estos datos. Entonces, antes cuando hemos creado el artículo nos ha aparecido el título y nos ha aparecido el texto. Eso quiere decir que si la recargamos aparecen los campos que acabamos de poner porque están dentro de nuestro post. ¿Sí? No más... No más dos ni dos segundos para que se lo fíense. No van a aparecer. Pero sí, así es. Entonces, ¿qué ocurre que esos campos están ahí? Pero no son los básicos de Wordpress. Por lo tanto, salvo que desarrolles o si utilizas Elementor y ese tipo de herramientas tengas la opción de dinámicamente decir escojo que este campo de Elementor sea con ACF exactamente este campo que he creado, pues no va a aparecer. Y es aquí donde entra la partesa de código, ¿vale? Entonces, por ahora, recapitulando, hemos creado un custom post type de tipo libro y un par de campos para ese custom post type. Aquí se pueden hacer muchas más cosas, se pueden hacer condicionales de todo acuerdo. Si queréis ver ejemplos más avanzados luego, los miramos, pero ahora hacemos lo básico. Muy bien, pues ya tenemos esa información. ¿Por qué es importante crear estos campos? Porque en vez de poner aquí autor igual y luego no puede utilizar este dato, porque no lo puedes utilizar ni filtrar por autores, ni agruparlos, ni nada, esto lo que te va a permitir dentro Wordpress es luego filtrar. Oye, creo que me muestran los libros de este señor. O los libros de este año o de esta categoría o lo que sea que estés poniendo. Toca a código. ¿Tenéis ganas? Así más o mejor, ¿no? Vale, aquí tengo el código terminado en mi iPad porque en código vivo ya sabéis que se pueden pasar cosas. Entonces, de serie, para hacer un tema hijo necesitas un style.cs que ponga el nombre que va a tener y cuál es el tema padre. ¿De acuerdo? Entonces, si venimos aquí y vamos a apariencia pone biblioteca y se llama detalles del tema te dice que es un tema hijo de 2015 que es este de aquí. Aquí podéis poner más información de autor y demás. Lo mismo que si miramos en este, pues tiene más información. Y después estamos en Functions. No es obligatorio pero con el Function lo que podemos hacer es cargar los estilos del tema padre para que todo se mantenga igual y en este caso le he puesto también los estilos de Tailwind. ¿Quién de aquí sabe lo que es Tailwind? ¿Quién de aquí sabe lo que es Bootstrap? Bueno, pues Tailwind es como Bootstrap pero mejor más o menos, ¿vale? No quiero quedar la troya pero ya que muchos sabíais lo que era Bootstrap pues ahora ya más o menos os hacéis una idea. ¿Sabéis que normalmente se dice si puedes decir que se parece a Netflix o es el no se quede tal la gente entiende de qué estás hablando es en plan el Netflix de los documentales? Pues esto es el Bootstrap, bueno. Simplemente lo he puesto para que luego a la hora de hacer un poco de código pues los estilos sean mucho más rápido y no tengamos que meternos con CSS y demás. Simplemente lo estamos cargando esto es lo único que estamos haciendo aquí. Lo primero que tenemos que hacer ahora es intentar que esos campos personalizados que están dentro de ese dato están en la base de datos intentar que aparezcan aquí, ¿de acuerdo? Entonces, lo primero que tenemos que hacer es dentro de nuestro tema que es este de aquí este punto de idea no lo hagáis caso es del editor, ¿vale? Tenemos que crear un archivo y en este caso WordPress tiene un archivo que es single.php ¿Sabes la jerarquía de WordPress cómo funciona? Vale, uno sí y el resto no WordPress FIM y hierarchy Vale, esto es importante y algunos van a decir ¿What? ¿Cómo? ¿La calidad no es la mejor? ¿Hay alguna imagen con mejor calidad? Bueno, ésta se ve bien seguramente porque ésta está con el Resist 6 vale, y ésta está bien digamos que cuando WordPress empieza a cargar y tiene que mostrar una página pues intenta saber qué archivo está gestionando en ese momento esa página para saber qué mostrar entonces tú cuando estás en un blog está utilizando un archivo que quizás tenga una barra lateral izquierda en el centro tiene el contenido pero en nuestro contenido son trocitos de los artículos vale, entonces todo eso lo tiene que gestionar de alguna forma Entonces, la básica sería el index y a partir de ahí si veis cubre todo el index lo que vayas a usar Archive sería por ejemplo para las categorías y taxonomías y después tendríamos el single que realmente es para los custom post type este single funciona para lo que son los post realmente y el singular para lo que son los custom post type ¿Por qué? pues lo decieron así vale, entonces hay una función que es single para saber si es un post o no mientras que si es un custom post type saber si es o no, pero esto es exactamente lo mismo entonces page es lo mismo que single pero para las páginas entonces si veis estos dos están a la misma altura que este y después tenemos la home que sería la página principal donde están los artículos porque aparte de aquí también está el front page por alguna parte de aquí que sería para hacer una home pero sin artículos, que no sería el blog el home sería como si fuera el blog ¿Qué quiere decir eso? que nosotros tenemos aquí el single que está funcionando para los artículos entonces ahora mismo aquí está utilizando el single.php del padre si foramos ese archivo y lo editamos que no sé si aquí lo puedo editar mira aquí y vamos aquí al tema padre esto no toques nunca en vuestro WordPress que lo rompeis pero si venimos aquí single, entrar individual y aquí tenemos código y aquí hacemos un eco hola ahora es cuando se rompe todo por venirte arriba bueno aquí está el hola entonces ahora mismo el tema hijo no tiene ese archivo pero el tema padre si como lo está utilizando el tema padre pues lo aprovecha y esto lo quitamos entonces ¿qué ocurre? que nosotros lo que queremos es utilizar un single pero para los libros los blogs están muy bien no queremos tocarlos queremos para los libros entonces aquí podemos ir utilizando aquí tenemos single, guión, post type slug single, post type luego también podremos hacer por ejemplo aquí veis page por slug o por id entonces empezamos a poner este tipo de nombres en los archivos empezamos a subir hacia arriba y pisar lo que hay aquí debajo por lo tanto si aquí queramos un single libro lo que escribamos aquí debería de funcionar porque libro porque si venimos aquí a libros el custom post type lo hemos llamado libro si fuera libros tendré que ser single, guión, libros dale dale todo lo que podáis aportar adelante que de hecho si ahora recargas cuéntanos lo tenía lo iba a decir que eso si recarga ahora la página se va a mostrar ningún contenido porque tiene el archivo vacío quien cree que tiene razón teniendo en cuenta que yo soy el ponente y él no nadie levanta la mano a uno dos nada lo que él dice es que si ahora recargo deja de funcionar no se fía de mi código pues tenía razón por qué, por qué ahora mismo está intentando utilizar este archivo porque este archivo no tiene nada entonces si nosotros pusimos aquí un get header que es de WordPress y la abrimos con PHP esto es una función de WordPress y recargamos de repente empiezan a aparecer cosas entonces eso es importante si tú empiezas un archivo desde cero es desde cero entonces qué es lo que puedes hacer puedes ir al tema padre copiar el single pegarlo y luego empezar a modificar todo aquello que no quieres entonces yo tengo aquí un single ya limpio y voy a copiar este tiene cosas ya hechas vamos a copiar el single de aquí y lo hacemos desde cero tenemos el editor lo tenemos aquí y este single de aquí lo copiamos, lo pegamos guardamos y recargamos como veis funciona sin ningún problema es como si no hubiera pasado nada entonces qué ocurre que quizás aquí hay cosas que no queremos vamos a suponer que el site varía más si que lo queremos no vamos a cambiar todo pero vamos a suponer que que aquella cosa es que no queremos que nos sobra por ejemplo navegación entre post, entre libros pues mira en este diseño no queremos ir al siguiente libro o ir al libro anterior porque no tiene lógica dentro de la biblioteca no, aquí no comenta nadie porque luego insultan al autor no tiene nada que ver con nosotros así creo que queremos vamos a quitar los comentarios aquí lo que está haciendo es coger un archivo que se llama content y en este caso le está poniendo libro por detrás que veis que pone que post format entonces está buscando un archivo que es content libro pero no existe por lo tanto lo único que hace es coger content que sí que existe que os mostraré ahora entonces si recargamos no cambia nada porque realmente lo que hemos quitado no se veía anteriormente pero si venimos aquí al editor de temas vemos que tenemos content link content nonnet, content page, content search y content la jerarquía es la misma en este caso como no he encontrado nada aquí está cogiendo el content este que es ponerle la imagen destacada poner la cabecera si es single le está poniendo el título y si no le está poniendo un h2 con el título por hacer una forma y demás esto que quiere decir seguramente esto es para el blog por eso le mete un h2 y le mete el enlace al permalink que es el post es el enlace del post y aquí como estás en el post es un h1 y no necesita un enlace entonces lo que te permite es que sea reusable el código lo que está usando ahora mismo es eso que ocurre que nosotros no queremos eso queremos hacerlo por nuestra cuenta entonces lo que podemos hacer es aquí cerrar el PHP voy a dejar esto un poco más así y el end while se lo ponemos así y esto se lo quitamos ¿qué va a pasar ahora? funciona, no funciona en blanco no hay nada, todo está funcionando el post aquí lo que está diciendo es mientras haya post o sea que exista ese post me traes el post pero como ya no hay any title ni hay nada pues no muestran nada entonces lo que tendríamos que hacer aquí es nuestro código que podemos poner lo que nosotros queramos entonces en este caso vamos a poner el header lo voy a copiar y pegar para ser un poco más rápidos y aquí lo que le he dicho es vale empiezo el artículo le vamos a poner el post id que es este y las clases del post un header con su title y aquí le hacemos eco title nadie pone cara rara a ver si me deja como grande algo que decir se va a romper entonces se va a romper así se va a romper y si ponemos get así sí pero bueno este es una función de WordPress que lo que hace es eco y mostrarnos el title que se usaría cuando queremos coger ese dato ponerno por ejemplo una variable no queremos que lo imprimas simplemente que lo coja porque esto es importante que lo digo porque luego vamos a crear funciones propias entonces quiero que entendáis que esto viene de algún lado y lo mismo que esto viene de algún lado vosotros podéis crear vuestras propias funciones para hacer luego cosas que vienen de algún lado entonces en este caso si recargamos nuestro post ya tenemos aquí el título pero si ponemos este pues no funciona porque he puesto este pero como he copiado el terminado pues luego hay avances vale así que en este caso tenemos ya esto y lo que queremos por ejemplo es poner el contenido y podemos ponerle un div entry content y aquí creo que me lo cargo para que no moleste entonces si recargamos no hay nada está cogiendo las clases que tiene el tema los estilos con esta clase de aquí pero no está mostrando nada entonces ahora lo que queremos es mostrar nuestro código nuestros campos esto que lo ha hecho de que año es toda esa información entonces lo que vamos a hacer aquí es para que quede todo bien como se rompa todo es dentro de este grupo de aquí porque nos viene bien a nivel diseño vamos a decirle que queremos una lista esto de aquí es Bustrap pero mejor, Tailwind vale y aquí le decimos lista y queremos simplemente un autor y el año vale como sacamos aquí el dato vamos a hacer una cosa vamos a hacer que la gente que sabe por lo menos tarde 5 segundos 5 seguntitos vale, entonces aquí lo que haríamos es utilizar ACF ACF tiene sus funciones mágicas que hacen que podemos traer información entonces para traer esa información lo ideal y más limpio es estoy contando 5, vale, ¿quién se anima? lo ideal y más limpio es y, sí, que el Fils está bien para asociarlos a una variable porque acá es más limpio el código entonces tú en la parte de arriba puedes empezar con title vale y entonces aquí se deja el de title, vale el código empieza a estar más limpio empieza a haber menos cosas por ahí funciones que empiezan a llamar a cosas que realmente está llamando una string a un código de texto que es solo el título y en plan no hace falta lo podemos poner así y listo y a partir de aquí podremos poner Outdoor y si veis estoy utilizando Copilot y dice ¿qué file? Outdoor, vale intenta ya ayudarme no, en este caso está en el editor vale, pero como lee todo el WordPress toda la instalación del WordPress, detecta que está ACF y aprende y es muy listo y ya hace, vale entonces si venimos aquí y hacemos un ves que pone eco-outdoor en este caso no es un post no está listo Copilot vale, simplemente así entonces ahora veremos el autor pues no ahora los que sabían de repente no si venimos aquí no vemos el autor ¿por qué? porque Copilot es listo pero no tanto como os he dicho antes aquí poníamos CPT, Libro Outdoor porque esto luego se irá añadiendo porque si de repente estáis mezclando Libro con no sé qué con no sé cuánto si estáis utándole la misma plantilla como se lo ponga Outdoor Outdoor pues veis a volver loquísimos vale, entonces es una recomendación podríais poner aquí buca-outdoor y tal pero bueno en este caso no, pero si yo tengo aquí también películas y he hecho un campo dentro de películas que se llama Outdoor no le he puesto el nombre por delante cuando luego tú estás trabajando con ello no sabes a quién estás llamando o sea, a la hora de leer es más fácil saber vale, estoy hablando un CPT que es el CPT Libro y estoy con el Outdoor y si en el Outdoor hubiéramos puesto más campos iríamos con Outdoor Name Outdoor Name, Outdoor URL o lo que sea entonces al inicio es un poco aburrido tener que poner todo eso pero cuando luego donde estás desarrollando es en plan no me estás salvando la vida, es todo aquí saber a qué me estoy refiriendo lo mismo de aquí pues igual podríais poner buco-libro-outdoor o lo que sea en este caso es un ejemplo tan sencillo no hace falta, entonces aquí podríamos poner year y year entonces aquí y si recargamos, toma funciona entonces a nivel código podemos hacerlo así, si esto fuera Elementor aquí estaríamos poniendo un campo tendría una opción de seleccionar dinámicamente te mostraría todos los campos de CF seleccirías el Outdoor y ya está y Elementor sería el que muestre este dato os digo esto porque hay gente que igual no quiere código pues si os páis que con Elementor o Bricks y demás se puede hacer también muy bien, pues allá empezamos a tener datos de acuerdo, entonces en este caso lo que queríamos era en este taller quería mostrar como podemos hacer que estas cosas sean cosas interactivas para el usuario entonces me había ocurrido que sería interesante que el usuario pueda marcar el libro como leído, entonces como lo haríais y mientras tanto voy a hacer una cosa, alguien se anima alguien que no lo tenga super claro se anima a intentarlo a decir como lo haríais si, porque al final si el usuario no está loqueado no podemos guardar ese dato podrías ponerlo a cookie y demás pero está feo mientras estoy aquí borrando la cosa alguien quiere animarse, nada cero no sabríais ni por dónde tirar tipo pondría un botón bueno, joder, me refiero que es un inicio vale, tenemos un botón, y ahora qué hacemos con ese botón, espera el micro y qué es el Ajax si quieres explicarlo para quien no sepa yo pondría un botón conectado a un Ajax que Ajax es una función de JavaScript que hace la sincronización entre PHP y HCBL donde puedes enviar un parámetro sin cambiar de página, donde salía eso y enviaría ese dato con el usuario que se ha registrado lo que haría es guardarlo en la base de datos y asociaría el libro con el usuario vale, perfecto es lo que vamos a hacer vale, entonces vuelvo a hacer lo mismo, va a ser un ejemplo pero luego la imaginación al poder podéis hacer lo que queráis entonces en este caso, necesitamos ahora mismo un botón creo que podemos hacer un botón vale, entonces voy a coger este código de aquí y lo voy a pegar tal cual vale, que es un div que tiene esto de aquí que son clases, como buscas pero mejor y que ponen no leído entonces si venimos a la página aparece una etiqueta que ponen no leído pero todavía eso no es un botón vale, entonces ¿qué ocurre? que para Ajax lo que necesitamos es un botón entonces voy a coger el botón y voy a copiar las clases vale, entonces vamos a venir aquí y debajo de esto vamos a poner un botón con una clase copio clase entero de acuerdo y le vamos a meter este de aquí que son un par de clases más que van a determinar como se ve ese botón vale, aquí empezáis a ver blanco el fondo cuando se pone encima se pone gris y luego tiene el borde y el texto es gris y aquí le vamos a poner no leído ya tenemos nuestro botón entonces ahora lo que tenemos que hacer es que esto se pueda clicar y que mágicamente cuando des clic de repente esto se pone leído este pues se pone como marcar como no leído o sea la palabra ajustar al otro contrario y que se pueda interactuar vale, entonces aquí donde entraría el Ajax vale, para que no tengamos que pinchar, que se recarga la página y haya como que para el usuario sea algo lento de acuerdo, entonces en este caso si queremos utilizar esto de esta forma tenemos que crear un formulario entonces el formulario nos va a permitir guardar ese dato la base de datos y ahora empieza a complicarse un poquito la cosa pues ya tenemos que meter con Ajax y todo lo que tiene entonces no puedo ponerme a explicar Ajax exactamente como funciona vale, pero vamos a ver un poco del código si vamos al Funtions la tenemos aquí nuestros estilos y el script de Tailwind podemos bajar aquí y empezar a encolar otro archivo cual lo vamos a poner en este caso no va a ser jQuery querido Copilot sino que le vamos a llamar o DLC Zaragoza Box este simplemente es el nombre para que sepa a WordPress de que hablamos esto es lo mismo que si venimos aquí y damos a ver Código Fuente y damos aquí a Theme, veis aquí que tenemos Part Style, 2015 Genericons y si pues quedamos Tailwind aquí aparece con su nombre y demás entonces ¿de dónde saca eso? de aquí simplemente esto es para saber qué script nos estamos refiriendo y a partir de aquí lo que queremos decirles es que lo pone todo queremos que vaya a la carpeta de nuestro tema a la carpeta JavaScript y que coja un JavaScript que es Box necesitamos JavaScript con Ajax para que funcione la magia y después le podemos decir que lo queremos después de jQuery que primero cargue jQuery y después vaya a nuestro código porque vamos a utilizar jQuery si lo carga antes pues nos va a dar error y luego le podemos poner una versión porque somos gente guay y como se recomienda poner una versión pues lo ponemos entonces aquí ya estamos generando un archivo que se va a cargar ahora en todas las páginas y que se llama Box lo suyo sería poner un condicional y decirle if is singular si es singular si es singular si es singular no hace falta que me lo pongas en todos lados que esto es aquí cuando tú instalas un plugin lo suyo sería que mires ese plugin que estilos y que JavaScript te pone le hagas un dequeue que es quitarlo en vez de un enqueue quitarlos todos y donde si que te hace falta encolarlos porque los plugins te meten todo en todos lados y como no saben dónde vas a poner sus cosas pues te lo meten en todos lados entonces si quieres hacerlo bien los suyo sería quitarlos todos y decir no en este single sí pero en el resto no hace falta pero bueno se debe entrar muy fino entonces aquí necesitamos ese archivo js, box y ellos entonces aquí pasarán cosas de hecho para hacerlo bien lo que vamos a hacer es un directorio aquí arriba y vamos a llamar assets y vamos a meter el JavaScript dentro de assets y así parece más profesional y todo está más ordenado correcto si venimos aquí ahora en nuestro código y recargamos y ponemos los libros o books tenemos aquí work on Zaragoza books y luego el JJ un apellido que le pone WordPress de forma automática entonces aquí ya veis que está cargando, ¿qué hay? nada pero está funcionando, ya lo tenemos ahí perfecto, entonces si venimos a nuestro JavaScript lo que queremos es que ese JavaScript con el IJAX recoja la información del formulario y se lo envía a WordPress y en este caso WordPress pues se va a enviar de una forma muy concreta y IJAX es lo peor del mundo y haremos lo mejor que podamos entonces, necesitamos un formulario necesitamos algo que le diga a WordPress hoy estoy mandando esta información Haz algo con ello lo mismo que tú aquí estás utilizando un formulario aunque así no parezca un formulario es un formulario entonces necesitamos ese formulario vamos a crearlo vuelvo a decir lo mismo, si hay alguna pregunta acelda, aunque no sea directamente siempre tenéis prioridad los que estáis aquí quien no está aquí forma la suerte vamos a crear el formulario por encima del botón tenemos un form en este caso necesitamos un action pero si necesitamos un ID que va a ser form ridd por ejemplo y le vamos a poner métod post porque vamos a añadir información metemos esto aquí necesitamos un formulario si recargamos ya tenemos un formulario se ve el formulario porque el usuario le da igual no hace falta que meta datos pero necesitamos datos necesitamos campos me voy a poner más aquí porque si no no me veis se va a dejar el cuello fer no he movido por si quieres mover la cámara entonces necesitamos un formulario necesitamos meter los datos aquí en los típicos formularios tendríamos un input de tipo texto guardamos recargamos y hasta aquí nuestro input entonces aquí generalmente el usuario metería el dato qué dato metería en la base de datos antes has dicho hay que meter hay que relacionar entonces aquí tendría que poner pero bueno, igual poner el ID del usuario nos ayudaría más en código o el ID del libro pero el usuario no sabe cómo va su ID ni tampoco le tenemos que exigir eso entonces lo que podemos hacer es dentro de este dentro de lo que es el input le vamos a poner uno el ID quiero que sea BucayD que es como luego yo voy a trabajar ese input y voy a saber a quién me refiero no te caso es BucayD tipo texto ya tenemos y después le tenemos que emocionar el value el value va a ser la ID ¿Qué ID queremos en este caso? podemos poner get de ID lo que está cogiendo es la ID del post en este caso es un post type de tipo libro por lo tanto está cogiendo la ID del libro eso es lo que está haciendo esto le ponemos el eco porque tenemos un get aquí u otra opción sería voy a coger esto me la voy a llevar aquí arriba porque somos gente de bien voy a poner BucayD y ya te lo rellen a copilot y aquí simplemente voy a poner BucayD y no tener funciones por aquí en medio vale, entonces ahora si venimos aquí y regargamos ya tenemos la ID del libro pero no queremos que se vea así que le ponemos una clase con el bustrap bueno que va a ser hidden que ya nos lo da copilot porque es muy listo y ya está entonces como le hemos puesto hidden como ya no se ve pero si enviamos este formulario ese dato está ahí por lo tanto podemos asociar ya el libro muy bien que haríamos lo siguiente por lo mismo con el user ID y que vamos a hacer copiar y pegar este copiar y pegar es muy sencillo vais a stack overflow y copies lo que es ponga en stack overflow y lo pegáis primero hacéis un unpack up por acaso se rompe todo pero bueno esto es una función de WordPress del usuario como veis estamos utilizando funciones que no sabemos de donde vienen y luego creemos nuestras propias funciones para hacer estas cosas chulas entonces si venimos aquí no lo vemos, inspeccionamos y tenemos aquí dos input que tenemos el book ID y el user ID vale 17 y vale 1 que veis aquí mal con este user ID 1 esperados que sabéis mucho que no es seguro que es un user ID 1 porque los hackers van a ir a por ese 1 que seguramente es administrador entonces siempre que hace un usuario creáis otro, borráis el anterior y ya está o vais a la base de datos y cambiais el ID simplemente de seguridad vale los hackers van a ir a la tabla de usuarios y van a ir al ID 1 porque saben que es el administrador porque es el primer usuario creado que es un administrador entonces es a pares si estabais atentos pero os han hackeado a todos avisados estabais vale pues ya tenemos esto listo de acuerdo, todo lo que necesitamos cambiar una cosa más es el botón que le falta el botón antes que todos ahora tenemos un formulario por lo tanto tiene que ser submit son los típicos detalles que no te das cuenta y luego dices por qué no funciona por eso tengo el código bueno aquí por lo que luego se me olvida y estaríamos aquí media hora por qué no funciona entonces digamos que la base por ahora la tenemos, tenemos un formulario vamos y punto y ya lo único que habría que hacer es hacer click en ese formulario y ya funciona, si veis está recarando el formulario como tal funciona, no hace nada pero funciona, entonces lo que tenemos que hacer ahora es capturar esos datos y enviarlos a la base de datos donde lo que vamos a hacer es ir a nuestro JavaScript y no lo vamos a escribir, lo voy a coper y pegar entonces, espérate, tengo que quitar una cosa de aquí porque si no os va a dar pistas y no quiero y ahora lo voy a poner aquí que si no lo aliamos vale, de realmente aquí lo que está haciendo es coger la ID del formulario cuando se envíe tú recuérdame todo lo que si no se me olvida haces muy bien entonces lo que está haciendo simplemente es con jQuery por eso hemos cargado después nuestro archivo porque queremos usar jQuery está mirando este formulario de aquí que es este de aquí está esperando a que se envíe porque ahora tenemos un botón que funciona como submit porque somos muy inteligentes y después lo que hace es prevenir el default que en esto en JavaScript es que no se recargue que coja el dato pero que se quede así entonces ahora queremos coger los datos de ese formulario y está cogiendo el dato del input de la ID y el de la ID porque hacemos las cosas bien y les ponemos una ID lo guardamos unas variables todo esto no hace falta que os acordéis de memoria esto simplemente buscáis información y listo después vamos a obviar esto de aquí lo voy a dejar porque si no lo vos se nos olvida le mandamos las cabeceras al servidor y aquí lo que hace es oye buscame esto que ahora os explicaré con el método post que sería este de aquí y me pones estos como si fueran una string el user ID, el buco ID y luego en la consola me dices si ha quedado bien esto es más o menos lo que hace pero todavía no estamos teniendo la lógica de guardar en la base de datos ahora simplemente le estamos diciendo se ha enviado este formulario no hagas nada, coge los datos y me los mandas aquí que los enseñaremos ahora la información de aquí pregunta, y hay gente que igual lo sabe esto de aquí está url de aquí esta información a dónde se está enviando que lo sepa que no lo diga que lo sepa muy claro estos datos que hemos creado aquí y hemos dicho este es el cuerpo de los datos que hemos hecho con estos datos te los envío a esta url dónde los están viendo ahora los que saben a una función no, lo está mandando a la jacks claro pero al final lo recoge lo está mandando a la restapi vamos a utilizar la restapi para que hojas esta información entonces esta url va a ser una url en el título ponía la restapi os había avisado esta va a ser una url de la restapi que va a estar ahí esperando y de repente le va a llegar un dato y con este dato va a hacer una función y va a hacer cosas en php que es guardar cosas en la base de datos que así suena muy bonito pero hacer todo esto cuando no sabes es en plan madre mía porque no funciona por ahora tenemos ya hago clic y teóricamente si hago clic no debe recargar pues no recarga antes recargaba ahora ya no recarga porque está funcionando nuestro JavaScript y esto está funcionando no hagas nada lo que pasa es que esa información no la está enviando a ningún lado aquí dice esto no se encuentra que lo acabamos a ver ahora así que por ahora estamos contentos vamos a venir aquí al single libro lo que pasa es que ha ocurrido algo raro habéis visto lo que ha ocurrido que no se ve el autor y el año y me voy a decir ¿por qué no se vive o ni os voy a decir no lo sé porque antes se vio pero bueno luego lo revisamos vamos a ir con lo importante que es este botón entonces una vez que tenemos esto tenemos que crear nuestro Ajax ese tan amado Ajax por suerte nos preocupéis lo que hemos escrito y va a ser fácil entonces dentro de las funciones aquí donde estamos cargando estilos y demás tenemos el script este tenemos este que hemos creado y ahora vamos a crear nuestro Ajax entonces aquí tenemos un localize script y dentro de aquí es que te lo da todo hecho esto no puede ser no te digas nada copilot que te chivas vamos a dejar ese entonces tenemos aquí el nombre vale por supuesto todo entonces en este caso nosotros le ponemos aquí Ajax ¿por qué? porque ese nombre es el objeto y así sabemos a qué nos referimos por acaso hay más cosas y más programación y más cosas a medida pues por lo menos sabemos que esto es el Ajax y a partir de aquí lo que nos pone es la URL en este caso en vez de Ajax URL en el ejemplo he puesto sólo URL pero en este caso no vamos a utilizar admin URL admin Ajax ¿qué es lo que vamos a usar? la restapi, muy bien y para eso hacemos rest URL y aquí ponemos la URL ¿cuál? pues todavía no lo sabemos ¿por qué? porque no hemos llegado y luego aquí le tenemos que poner un 11 que ya te lo da Copilot vale y alguna razón de por qué este está vale por este entonces el 11 realmente lo que es es una clave de seguridad para evitar que gente que no está logueada o gente que no tiene permisos y más utilice estas funciones y nos metan cosas dentro de la base A2 entonces Warpers tiene una función que es queriendo 11 y este es el nombre que le hemos puesto pero luego la restapi va a decir ¿el más pasado este 11 que está aquí? sí, por adelante no pues no pasas en Laravel es CRFS o CFRS bueno en Laravel por ejemplo se llama de esa forma y en otros códigos se llama de otra muy bien pues eso lo tenemos es un token que crea Warpers entonces como veis lo bueno utilizar Warpers cuando dicen que Warpers solo es para blogs si quieres programar ya te dan muchas funciones ya hechas y te salva mucho la vida y luego puedes utilizar filtros y editarlos entonces ¿qué es lo que vamos a hacer ahora? entonces venimos aquí, un nuevo archivo y aquí empieza la fiesta vale, pues vamos a hacer la restapi ¿cómo se hace la restapi? no hay idea pues yo tampoco así que lo voy a copiar de aquí lo malo que tiene la restapi en estos momentos es que la documentación no está super avanzada están intentando trabajar en ello pero hay mucha información que falta y sobre todo si eres programador como yo pero no soy programador puro y duro y estás aprendiendo y dices pero esto porque está así o esto porque es así entonces primero tenemos que añadir una función y voy a copiar, pegarlo y explicarla para que mi sombra no se ponga nerviosa está lo suyo que si no me sacan los tiempos y se me enfadan entonces lo que estamos haciendo es utilizar una función de Warpers register routes aquí estamos registrando una ruta aquí podremos ir poniendo más rutas ¿vale? el name space en este caso es Warpers version 1, esto lo que va a permitir perfecto sombra, ayúdame ¿da servisto bueno? fenómeno ahí se ve bien entonces esto lo que hace es que todo esto esté metido aquí dentro, entonces si en un futuro cambiamos la api y hacemos la versión 2 pues lo encapsularíamos en la versión 2 y la 1 podría seguir funcionando haciendo así y aquí tenemos la ruta ¿vale? en este caso le he puesto books y luego una ruta que es updatebook read status simplemente un nombre que se entienda actualizar el libro y el status ha leído entonces ¿de dónde viene esto? pues si venimos aquí a Warpers y algunos de vosotros vais a ir a casa y vais a empezar a mirar esto como locos y pensando me van a robar los datos ¿vale? entonces si venimos aquí y ponemos wp que ha nacido Warpers, JSON tenemos esta información de aquí y aquí si ponemos wp version 2 me falta el v2 ¿por qué? falta algo más en la url vale, que falta el JSON si ponemos esto en la url aquí empezamos a ver datos muchos datos y si vamos a vuestras webs y no tenéis capada la api pues vemos datos y alguno va a decir hay tantos mis artículos, todos mis post ahí está toda mi información pues está si vamos a post post o post solo no, es post ah vale, que en este ejemplo no hay en este no hay ¿vale? no hay post en este Warpers pero ahí se verían los post y podrías ir a un post en concreto entonces esto lo que hace es que tú podrías crear con Warpers todo el contenido y luego con programación encima del Warpers crear con vue, con react o lo que queráis la información ¿por qué? porque vais a esta api, coges los datos y haces lo que queráis entonces en este caso lo que estamos haciendo es hacer nuestra propia URL si quieres que los feeds, readers y demás lo cojan y demás sea el post si es público no hace falta cerrarlo, no hay información salvo que hayas creado un custom post type de usuarios donde ahí puedan ellos meter su información y de repente lo haces público pues entonces igual ya no les hace gracia o si porque es una página de redes sociales y quieren que sus datos sean públicos por ejemplo cuando habéis comprado la entrada para esta workham hay un checkbox donde quieres aparecer en la lista de asistentes entonces si la marcas lo que hacen es que apares la api y que tú nos salgas si no pues sales pero bueno simplemente que sepáis eso entonces aquí lo que haces los métodos que aceptas es post y el callback llama esta función entonces en este caso es post porque queremos poner algo en la base datos esto es la documentación, lo tenéis todo escrito y entonces lo que necesitamos para que esto funcione es una función muy utilizada en WordPress que es azaction en este caso el gancho el hook a los que queremos enganchar es restapinit y llamamos a esta función que es esta función aquí aquí pues lo suyo sería igual poner así para por si acaso que no se pise con otras funciones del mismo nombre y tal y cual este y este, esto lo que está haciendo es cuando WordPress está cargando en este momento llama esta función y hace esto y lo registra para que exista entonces aquí en este de aquí si venimos ahora aquí alguna idea por qué no funciona puede hacer código más grande no dice que no se encuentra no existe la que hemos la de nuestro work cancer a goza versión 1 la sabes, dale no ha creado la función la url pero no tiene el controlado la función no pero aquí dice que no existe no que de error enseña el código otra vez no lo vais a adivinar así hay que no no he visto la url lo que pasa es que no he llamado al archivo esto es la típica cuando la gente... yo había confiado en ti, pensaba que esto estaba ya hecho yo no confío en mí por eso tengo esto aquí digo por qué no va, ah vale que no hemos llamado a la función ahora sí que tenemos aquí los datos no hay nada pero tenemos aquí los datos entonces aquí ya empezáis a ver que el books update books updated status esta url existe pero ¿qué ocurre si llevamos a ella? nadie se arriesga realmente no pasa nada porque pone post inoget entonces en este caso esta dirección lo único que pide es dame, realmente el problema no es este es que el método de solicitud no es el correcto porque aquí no está cogen información queremos poner entonces vamos que vemos que las cosas van avanzando empezamos a tener nuestra restapi la url empieza a funcionar, empiezan a pasar cosas nos ponemos contentos y entonces lo que vamos a hacer ahora es coger, esto lo vamos a escribir vamos a coger esta función que es el callback cuando llegues a esta url y esto este correcto llama esta función para hacer cositas entonces llamamos a esa función copilot ahora no te quiero aquí entonces ¿qué es lo que queremos hacer aquí? lo primero coger el request que es la info que llega recordáis que habíamos hecho el paquetito y lo estamos enviando a algún lado y debería pasar algo pues queremos esa info y ahora aquí queremos que ocurran cosas primero voy a copiar este de aquí y vamos a coger el user ID entonces de los parámetros que vienen en el request está cogiendo el user ID de hecho los parámetros es mejor ponerle esto aquí si no no va a ir lo que está haciendo es coger el request y crear un JSON coger los parámetros del JSON meterlos en esta variable buscar en esa array este dato y ya tenemos este user ID en esta variable y ahora vamos a seguir un poquito rápido que si no sombras enfadas y entonces lo que hace es chequear que ese user ID es el usuario actual para que no venga alguien haga un inspeccional elemento, cambia el ID del usuario y se lo mete a otro vale pues al menos vamos a hacer esto y decir aquí podemos pasar errores y cosas así y luego coger la alerta y decirle que haces cosas así pero bueno lo hacemos en plan sencillo vale lo que voy a añadir es este aquí el book ID porque como lo vamos a mandar un paquetito pues que es este de aquí user ID y book ID son estos dos datos pues así ya lo tenemos entonces si veis aquí ya en vez de haber cosas que es el Ajax, Zaragoza, Tata, Starbucks 11 que habíamos creado antes pues ya lo está cogiendo entonces te habíamos creado el URL y el 11 aquí lo está chequeando cuando envía los datos y aquí lo que está haciendo es enviárselos y aquí le pasa las cosas teniéndose en cuenta lo que queremos ahora es que ocurran cosas entonces qué es lo que queremos que se guarde el dato en nuestra base de datos porque aquí tenemos nuestra base de datos tenemos los posts el post ID y el post meta y estamos en el post meta aquí no se ve ahora pero nosotros tenemos los posts y el post meta es la información asociada a los posts entonces en el post está el libro porque es un tipo de post pero el usuario está en user entonces el post meta nos va a servir para juntar los dos y decir este usuario con este libro y quien dice libro puede ser cualquier cosa quien dice usuario pues puede ser cualquier cosa entonces para eso lo que tenemos que hacer es este código de aquí que voy a copiar y pegar todo lo primero que haces es chequear si está leído pero claro no tenemos este dato no tenemos que coger entonces vamos a ir hacia atrás quiero chequear si está leído para marcarlo como leído o no leído entonces tengo que ir hacia atrás coger un parámetro que es read it pero ese parámetro no lo tenemos porque si venimos aquí no lo ha cogido pero ahora sí que lo ha cogido y no hay aquí arriba lo ha cogido pero ahora queremos que lo envíe entonces aquí le manda el dato entonces este está cogiendo los datos del formulario y se lo está mandando a la url que está esperando aquí y lo está recogiendo que ocurre que tenemos que ir un poquito más atrás porque aquí qué es lo que nos falta nos falta un input que le pase true or false no sé si está leído o no está leído entonces necesitamos como aquí tenemos una variable necesitamos una función que rellene esa variable que es user has read it the book y es bocady ahora qué pasa, esa función no está creada pero la podemos crear porque va a ser igual que estas estas funciones están creadas en algún lado entonces nosotros podemos crear una función perdón que vaya en esto un poco más rápido aquí abajo en un plugin y ya muy bien y todo eso una función que es user has read it the book con el bocady porque si luego cambias de tema esta función legal la quieres en tu WordPress entonces copiarías otra vez el mismo código para pasar la nueva tema si lo tienes un plugin si no lo vas a activar siga entonces tenemos user has read it the book con el bocady y bien aquí dice readers get book readers necesitamos otra función haría falta esa función queremos ponerla, si, por qué por casi podemos reutilizarla vale, entonces en vez de poner esto de aquí directamente aquí hacemos una función y lo podemos reutilizar luego entonces esto lo que está haciendo es getPostMeta como getPost pues en este caso meta irá a la tabla de postMeta que hemos visto iba a buscar por la ID del libro iba a buscar este postMeta diréis pero igual no existe lo que estamos haciendo es ir hacia atrás ahora entonces aquí va a coger el postMeta de los lectores si no está vacío lo que va a hacer es meter el usuario actual dentro de esos lectores en ese array entonces si existe porque igual no es que está vacío es que no existe todavía nos ha creado si existe hace un retoon true retoon true es que esta función está diciendo true si y si no, no entonces está diciendo alido este libro si o no entonces este de aquí dirá alido este libro dirá este ridid del parámetro viene del single dirá alido este libro no, entonces en el input le pondrá no, entonces a este de aquí le llegará no entonces llegará aquí que no es 0 irá al ridid 0 vale, entonces no puede pasar por aquí, pasará por aquí y lo marcará como leído toda esa función la tenemos aquí que es marcar como leído si veis estas funciones luego es que es muy sencillito coge los lectores esta función ya la hemos creado antes, la estamos reaprovechando y vuelvo a hacer lo mismo chequea daría igual, es que luego depende como quieras sacar la información si quieres sacar la información relacionada a los libros o relacionada a los usuarios entonces si el actor principal es el libro es mejor sacar luego todos los datos del libro pero al final como lo unas daría igual, vale, pero si tú quieres que el actor principal sea el libro y todas las funciones que hagas a futuro en este caso es marcar libro como leído o no pero puede ser descargado o no, puede ser tal todo al final es guardar los datos o crear una tabla nueva de relación y hacerlo desde afuera entonces aquí por lo mismo, chequeas el usuario está perdón que no me metas muy a saco está grabado, tenéis aquí el texto lo podéis leer y esto encima lo hice en directo en Twitch y creo que está en Youtube prepare esta charla en directo también lo tenéis ahí entonces lo que vamos a hacer es copiar y pegar todo luego vais a rezar si funciona o no funciona porque ya no sé ni qué copiado qué pegado, qué hecho y qué no hecho vale entonces aquí en la restapi nos falta algún esto realmente es lo que os digo si venimos aquí y recargamos miramos este no leído vale tenemos que el ridid no tiene dato vale entonces si hacemos aquí no leído no ha hecho nada no te preocupes todo está solucionado veis esta biblioteca la pasamos al escritorio veis esta biblioteca lo pasamos a temas ya es cuando tampoco funciona la vida fue así entonces entonces ahora sí que funciona el código es el mismo que hemos visto pero seguramente alguna línea se ha pasado pero si venimos aquí inspeccionamos tenemos value 0 entonces está no leído aquí veo que tampoco lo ha cogido incluso cambiando el tema pone que no está leído entonces simplemente en el código lo que le hemos dicho en el single recordáis aquí en el button había puesto este de aquí pero ahora tenemos un oye si está leído ponle estos estilos y si no está leído le pones esto y en el texto le pones desmarcar o marcar y por aquí arriba creo que es extra si está leído le pones leído si no está leído le pones no leído aparte de aquí puedes hacer todo lo que queréis realmente eso es lo único que cambia aquí veis que es lo mismo esto es terrible porque ya tenemos ese dato de aquí por resumir cuando el usuario viene aquí dice cogemos los datos bucaid y userid y chequeamos oye lo ha leído, entonces va este bucaid que lo tiene en el functions userhardreadbook le mete la id coge los que lo ha leído y cogería el posmeta que ocurre que aquí ahora mismo tendríamos que tener ese posmeta que está aquí, entonces ya está asociando el libro el libro con el usuario no, está asociando el posmeta con el libro que es el 17 el posmeta ID 50 lo asocia con el libro 17 bueno, el post para ellos es un post post 17 si venimos aquí y le damos a marcar como leído ya tenemos un value de 1 lo que ha hecho ha sido un refresh interno que sería este en vez de hacer un refresh de la página lo que haces interno y entonces ahora si recargamos nuestra base de datos tenemos el dato que es el 1 este tipo string el valor 0, tipo string 1 y si le volvemos a dar ese botón pues lo que haces es desmarcarlo entonces vamos a preguntas y resumimos esto lo primero es crear nuestro JavaScript que, bueno, lo primero lo que tenemos en el function es crear nuestro JavaScript para gestionar el formulario en nuestro single tenemos que tener nuestro formulario con los datos que queremos pasar hay veces que serán datos dinámicos si, puedes poner todo lo que quieras eso, si más que se puede poner un input de tipo giren en vez de usar la clase puedes poner lo que quieras en ese momento cosas que se aparecen o no dependiendo de lo que hay en la base de datos te dejó la última pregunta y te aprovecho es que es también una duda que tú por ejemplo como decidirías imagínate que el diseño de la single es igual que el de las entradas excepción de esos dos pequeños cambios diseñarías un template de la single de libro o harías una condicional dentro del propio template no es creando tu propio tema me refiero, no hubo igual un child o harías simplemente una condición no sé dónde está el punto de optimización de hago una parte condicional para que simplemente es la single normal con los campos de autor o me hago una single aunque cambie poco tampoco soy programar de pro yo te diría que puedes hacer un template part con un condicional solo de esa zona el template part lo que haría es que tú esto lo metes en otro archivo y le llamas o no le llamas es que template part es una función que te da WordPress para incluir los archivos de esa forma también podrás hacer un incluye digamos que te da esa opción para poder pasarle datos puedes hacer eso o podrías hacer como tiene el tema este que lo que haces utilizar content diferentes dependiendo del tipo de contenido entonces tú le podrías poner aquí uno que fuera content guión y el que tú eres usas este content base para todos y que luego dinámicamente escoja uno u otro lo puedes hacer así o puedes hacer un hook un hook sería imaginaros que aquí está la cabecera el header podría tener por aquí un gancho antes del logo y otro gancho después del logo entiendo que te molan la idea de no crear plantillas nuevas pero es nuevo si puedes si puedes aprovecharlo no mereces nada pero es que luego también depende porque hacerlo tampoco importa crear otro single no afecta la carga pero quizás es mejor a la hora de gestionar el código si van a tener el mismo diseño los singles está bien como dice el que hace el get content si cada post type o sea si el custom post type y las entradas van a ser completamente diferentes es mejor quitar y hacerlo de cero por eso digo que ahí igual para código te viene mejor hacer eso pero ahora os voy a mostrar una cosa y es que en este caso hemos visto como podemos hacer desmarcar y desmarcar como leído como veis es un poco lioso que si el ayas, que si tal, que si cual pero una vez que tenéis la base el código lo puedes utilizar entre proyectos y habéis visto como podemos llegar a cuando hacemos click que pase algo y ese click que hemos hecho que pase algo que lo tenemos en este de restapi es esta función de aquí solo que quiere decir que vosotros podréis coger todos estos datos metérlos en otra función y aquí hacer una cadena de funciones y que ocurre con una cadena de funciones que podríais por ejemplo, alguien de aquí utiliza make, nadie, Zapier que ocurre que tú podrías coger y aquí hacer un envío de datos que te ofrece una función Wordpress muy sencillita, los datos ya los tienes y dices mándame estos datos a esta URL en este caso no sería nuestra URL de la API, sería la de make, un webhook y a partir de aquí podéis automatizar todo lo que queráis quiero que publiques un tweet diciendo que no sé que usuario ha leído este libro, quiero que incluso podréis tener una función que coja el twitter handle del usuario de su user meta dentro de ese PHP entonces ya puedes empezar a automatizar 100.000 cosas ya sea a nivel manual aquí por eso de una forma con código o decir no, mira, yo hago todo esto pero porque no hay una integración dentro de Wordpress con el plugin o justo lo que yo quiero me engancho a su hook a su gancho, seguramente en plugins avanzados sabréis que cuando se vaya a crear un nuevo producto entonces se dispara un hook pues me engancho ahí y como ya sé cómo hacer las cosas pues se la envío a este webhook y aquí automatizo no code sin código incluso podéis hacer aquí como hago ya aquí que cuando crea el registro un article se vaya a Wordpress y le meta la id de article en el Wordpress pero esto podría hacer que de aquí mande un webhook, una información a una URL de mi restapi y guardarlo yo en la base de datos que lo que haríais que teníais una restapi y la URL sería users y aquí update the users entonces si estéis viendo las dos formas podéis utilizar código a medida para vosotros o podéis utilizar no code entonces era lo que quería enseñaros que las cosas no acaban aquí marca como leído no leído puedes ir un pasito más allá puedes hacer que le dé puntos puedes hacer que la verdad que haga un mensaje o que le llegue un email de email marketing al de dos semanas preguntando qué tal el libro lo que sé vamos bien perfecto hay preguntas de cualquier cosa podéis aprovechar cualquier cosa entre comillas que no lo sé todo yo podría, por ejemplo, llamar de una fí externa y usted cada información traerlo y luego intentan mezclarlo para poder hacer la opción si lo has visto si, ten en cuenta que puedes hacerlo que te dé la gana que es lo bueno que tiene WordPress entonces si vamos a este tema que yo tengo en este tema una página principal hará algo más grande los contenidos a ver donde puedo tener ese page voy a intentar buscaros la página front page creo que puede estar Featured igual si hago youtube stats view composers youtube stats entonces aquí lo que estoy haciendo es una llamada externa voy a hacer el código más grande me ha adelantado es hacer un código una llamada remote de get si quieres enviar datos esto lo que usarías para enviar los datos a make o a otro WordPress donde quieras entonces en tu casa harías un get yo en este caso cojo los datos de youtube y una vez tengo esos datos para que me quiera con ello entonces aquí ahora podría coger y mandar esos datos a la API de WordPress para cada cosa ya estoy aquí con PHP y ya lo puedo hacer si quiero en este caso no guardo nada en la base de datos en este caso no estoy guardando nada en la base de datos entonces en este caso lo que está haciendo es en la página principal en el archivo de la página principal lo que está haciendo es llamar a youtube stats que es un código que es como el get template party que tiene esa función en este caso está un poco más avanzado porque estamos utilizando osaje y utiliza cosas de Laravel y demás pero bueno la base es que dentro de esa single que hemos hecho antes tendríamos esta función de aquí y haría esa llamada cosa de tener en cuenta que cada vez que alguien visite ese single está haciendo la llamada entonces habría que ver si está bien o mal o hay que cambiarlo o no cambiarlo pero por ejemplo antes en trincha WordPress lo que hace es que si tú visites la página de trinchera de trinchera WordPress lo que hace es lo que hace es ir a Twitch y ver si la cuenta de trinchera está en directo entonces si está en directo lo que hace es ponerte aquí un banner que pone estamos en directo dentro lo que puedes hacer es decir trinchera no tiene muchas visitas pero si tiene muchas visitas es cada hora chequea el gatillo no sea una visita sería un crón cada hora chequea si estamos en Twitch y si estamos en Twitch lo guardas en la base de datos y que sea WordPress quien vaya a hablar ese dato si busca un 0 o un 1 un true or false ten en cuenta que generalmente hay las que te van a echar la bronca son los otros es decir estás llamando mucho a mi API por eso por eso pero lo que harías es un crón por ejemplo que harías un crón que es simplemente un robotito que está esperando y diría me toca hacer la llamada, coger los datos y con una función haces lo que quieras con ellos y el crón iría saltando lo que tú le pongas cada minuto, cada hora, cada día lo que tú decidas entonces ahora no te puedo enseñar la de youtube pero simplemente lo que haces coger los datos y luego lo pinta entonces le pasa los datos a la vista y aquí te pone las visualizaciones que esto lo trae de youtube y los suscriptores en horas todavía creo que no te da youtube ese dato entonces por lo que es una forma de que está actualizado automáticamente pero que puedes llamar a donde tú quieras y coger la información simplemente que sepas que tienes del remote get y del remote post que es lo mejor del mundo para no tener que hacerlo tu a mano por eso WordPress te ahorra mucho tiempo o ahí me pilles vale, que un minuto ¿no? 0 aquí dicen 1 y ahí 0 yo creo que están llamando desde abajo diciendo que va a empezar así que si no hay preguntas muy bien perfecto