 La CONOSCA es una diseñadora de negocio digital amante de la tipografía y WordPress era de Pro. Organiza la mitad de WordPress de Torrelojones y es una auténtica crack, así que nos va a contar cómo elegir un tema para Google Comerces, pero para que lo haga necesita un fuerte aplauso. Muchas gracias, Santi. Bueno, muchas gracias a la organización por confiar en mí y muchas gracias a vosotros por haber elegido esta charla y no es las que están ahora dando simultáneamente en la otra sala y en los talleres. Afortunadamente tenemos WordPress TV y tanto vosotros como yo pues lo podremos ver desde caso. ¿Cómo elegir un tema para Google Comerces? Es un título súper básico, ¿no? En cualquier curso que hiciéramos sobre Google Comerces siempre entraría este tema, ¿no? ¿Cómo elegir un tema para Google Comerces? La charla es también muy básica y después hay un turno de preguntas para si alguien se ha perdido por el camino aclarar todas las dudas que tengáis. Quiero que todos los que estemos aquí, todas las que estamos aquí, nos vayamos de esta sala sabiendo cómo elegir un tema para Google Comerces y que tenemos que tener en cuenta. Soy Ana Cirujano, soy diseñadora de negocio digital, me dedico a hacer proyectos web. No trabajo sola, suelo colaborar con desarrolladores, desarrolladoras, expertos en marketing online en analítica digital, SEOS y hacemos proyectos cada vez más interesantes. Como ha dicho Santi, organizo la mitad de WordPress Torreledones y en marzo de 2023 tendremos la Workup de Torreledones. Espero que vayáis todos, estamos a media hora y lo sé porque he venido en coche, o sea que en 35 minutos os plantáis en Torreledones espero que nos veamos todos allí. Soy embajadora, muy orgullosa, embajadora de marca de Piensas Solutions que es un hosting y dominios especializado en WordPress, alguien me tiene un plan gratuito de hosting para WordPress, os invito a que lo probéis. Ahí tengo un podcast con Pablo Moratinos, que se llama Vieta Chataruga y tenemos también una academia online que se llama Tercio Media School y que me sigáis en Twitter, si queréis, para más consejos sobre diseño. Bueno, lo primero, siempre que vamos a explicar algo, vamos a las bases, a sentar conceptos y cómo he elegido un tema, primero vamos a saber lo que es un tema para que tengamos todos claro de lo que estamos hablando. Parece muy fácil pero no lo es tanto porque justo ahora llevamos un año con un cambio de paradigma en WordPress y los temas cada vez van siendo menos importantes, siguen siendo muy importantes pero ya no tanto como antes. Cuando instalamos WordPress, ahora mismo, hacemos una instalación de WordPress, nos vienen tres temas por defecto, los famosos 21 que van con el año, este año, bueno, ahora, el 1 de noviembre salió la última versión de WordPress con el 2023, que ya es el tema por defecto para el año que viene, pero nos viene también con el 2021 y el 2022. Los temas, lo que hacen es dar la apariencia del sitio, igual que los plugins nos aportan funcionalidad, los temas nos permiten dotar nuestro contenido de ciertos estilos, tipografía, colores, disposiciones a dos columnas, a tres columnas, es el diseño del sitio, digamos. Pero, como decía, ha habido un cambio de paradigma y ahora mismo lo que tenemos son los temas de bloques, ¿no? Realmente un tema que es, un tema es esto, es una carpeta con otras carpetas y con archivos, lo instalamos en nuestro WordPress, estas son concretamente las carpetas que vienen en el tema 2023 el que digo que es el último que viene de manera predeterminada con WordPress y me ha hecho permitir que entendamos bien qué son estas carpetas, ¿no? qué vienen, qué vienen con el tema, ¿no? para que luego veamos las posibilidades que tenemos. Los assets son archivos, nuevamente multimedia, que vamos a utilizar con nuestro tema, ¿no? A veces pueden venir algunas imágenes predeterminadas o de contenido demo en el caso de 2023, 2023, voy a decir 2023, que es también como se conoce, lo más rápido, vienen las fuentes, ¿no? vienen fuentes variables que también son muy interesantes para poder aprovechar las performance y mejorar la experiencia de usuario, vienen cuatro fuentes para que las podemos elegir y ahora veremos qué vienen cuatro fuentes distintas en un único tema, ¿no? vienen también plantillas, las templates, las plantillas son para cada tipo de página distintas diagramaciones de la página, distintas composiciones de diseño de la página que podemos usar en las distintas páginas de nuestro sitio web, ¿no? En WordPress esos archivos se reflejarían así, ¿no? Estas serían las plantillas de página que vienen predeterminadas, plantilla para una página normal, plantilla para una página de archivo que son los listados de páginas o de post, la plantilla para la página 404, la gracia es que ahora con el nuevo editor del sitio de WordPress podemos editar estas plantillas sin necesidad de acceder a los archivos de una manera visual, ¿no? a golpe de clic, como decía el jueves en la mitad de Torreónes y Buenas Codillas. Después tenemos partes de plantilla, son secciones que podemos incorporar en las distintas plantillas del sitio web, no son plantillas para páginas, no son plantillas completas de página como veíamos antes, sino que son secciones como la cabecera o el pie de página que incorporamos a las distintas plantillas si se pueden utilizar en distintas plantillas, no en una única plantilla, ¿no? En el editor del sitio, como veis, pues también podemos acceder y de manera visual editar estas partes de plantilla. Mira, se funciona el vídeo. Como veis, podemos editar los metadatos de la template part de metadatos y directamente modificarlo como queramos, ¿no? No solo podemos modificar cosas sino también podríamos eliminar o añadir, ¿no? que antes, para poder quitar el autor de una entrada, por ejemplo, pues tendríamos que acceder al archivo y editar el código. Ahora se puede hacer de manera visual, ¿no? Los patrones de bloques, bueno, vienen distintos patrones con el TT3, pues una llamada de la acción, pide página por defectos, con dercomentarios, vienen distintas opciones. Visualmente, esto sería un patrón de bloques, ¿no? Un patrón de bloques es una composición, pues en imágenes, texto, botones, que ya está prediseñada y que nosotros podemos simplemente arrastrar y soltar y utilizar en nuestra web, ¿no? Y esto es algo muy novedoso. Hasta ahora las plantillas, las partes de plantilla, todo esto ya venía con WordPress. Incluso nos podíamos descargar un tema clásico antiguo que ya venía con su cabecera, su pie de página, su plantilla para las páginas, su plantilla para las entradas, pero esto de los estilos, las variaciones de estilo, es una novedad que no hemos tenido hasta el día 1 de noviembre cuando salió la última versión de WordPress. Ahora lo que podemos hacer con los temas es tener distintas variaciones de estilo. Y ahora, si funciona el vídeo... Ah, este es el vídeo que no tenemos permiso. Vale, cuando lo voy a intentar describir, cuando tenemos un diseño de una plantilla, hay seleccionada... Hay distintas, ¿no? 1, 2, 3, 4, 5, 6, 7, 8... Vamos a ver si que son 10, porque igual tampoco puse todas. Tenemos 10 variaciones diferentes de qué, ¿no? Variaciones de estilo, ¿vale? ¿Pero en qué consiste en los estilos? Bueno, pues tenemos una tipografía, que antes en assets teníamos hasta 4 tipografías diferentes. Claro, en cada estilo nos utilizan las 4 tipografías. Hay estilos que utilizan la misma tipografía, hasta 4 diferentes, ¿no? Tenemos distintas tipografías, distintas paletas de colores, distintos espaciados. En un mismo tema, cambiando la variación de estilo, nos cambia el aspecto del sitio completamente. Es decir, antes para cambiar el estilo de un tema, o sea, perdón, de una web, cambiamos el tema. Ahora lo que hacemos es seleccionar una variación de estilo. Incluso en estilos globales, lo después, partiendo de estas definiciones, nosotros podemos cambiar la paleta de colores, la tipografía, los espaciados y una serie de estilos, sin tener que acceder al código del tema. Había un vídeo en el que se ve como vas simplemente con un click, a golpe de click, se cambiaba toda la temática. Lo podéis ver en la página en WordPress.org, instalando cualquier WordPress hoy en día. Ya tenéis estas variaciones, activando el tema TT3, vais a estilos globales y vais a poder cambiar y ver cómo se comporta. El vídeo no funciona porque no tengo permiso en la presentación. Ya sabemos lo que es un tema actual de los que vienen ahora con WordPress, los que desarrollamos temas a medida o los que encargamos desarrollos a medida, sabemos que podemos utilizar todas estas funcionalidades, las podemos tener en cuenta. Yo como diseñadora o cualquiera de vosotros como usuario o como cliente, podemos utilizar todas estas ventajas. Ahora vamos a ver una checklist de requisitos de un tema para bucomers hoy en día, que no tienen por qué ser todos los requisitos que voy a decir, no tienen que ser para todos los temas, pero sí son cosas que podemos tener en cuenta a la hora de elegir un tema. Lo primero sería que el tema esté preparado para bucomers. ¿Podemos tener una web con bucomers sin instalar un tema específico para bucomers? Sí, de hecho bucomers ya viene con sus plantillas, con su diagramación, sus disposiciones, pero lo que no tendríamos sería, si no está preparado el tema para bucomers, no tendríamos estilos aplicados a esas plantillas, pero se podría perfectamente con un tema que no esté preparado para bucomers vender producto. Lo que pasa es que el diseño no estaría aprovechando todas las ventajas de bucomers, pero las cosas funcionarían correctamente, lo que pasa es que no tendría la apariencia adecuada. Que sea compatible para que no de errores, cuando instalamos un tema siempre tenemos que comprobar que no de errores con los plugins que ya tenemos instalados, ya no solo que sea compatible con bucomers, sino con el resto de plugins. Que sea accesible, esto hoy en día es básico, pero no significa que sea accesible, que cumpla con los estándares de código que exige el consorcio W3C para que todos podamos acceder al sitio, personas que tienen poca visibilidad o ninguna visibilidad que puedan leer el tema. Claro, sobre todo por la jerarquía de encabezados, por ejemplo, que esté bien etiquetado. No quiere decir, realmente no está bien expresado, porque el tema no es que sea accesible, sino que esté preparado para accesibilidad, porque luego nosotros al editar el contenido podríamos estropearlo y que dejará de ser accesible. Pero que por lo menos esté preparado para accesibilidad, que tenga una buena jerarquía, etc. Que se pueda traducir, esto es un tema técnico, que la persona que lo ha desarrollado haya preparado las cadenas para que sean traducibles. Cuando instalamos un plugin, por ejemplo, como loco translate, para hacer las traducciones, pues que todas las cadenas de texto se puedan traducir. Que podamos confiar en el equipo de desarrollo. Aquí me refiero cuando estemos en el repositorio de temas, eligiendo un tema o en algún otro marketplace, nos tenemos que fijar en esos datos. ¿Cuándo fue la última vez que se hizo una actualización? ¿Por qué? Porque ya sabéis que WordPress software libre, WordPress lo hace la comunidad, lo hacemos las personas, y vamos aprovechando las mejoras. El código PHP se va actualizando. Todas las funciones que estén en PHP tienen que ir aprovechando las nuevas, actualizando, en cambio, unas variables por otras. Algunas se quedan osoletas, hay que utilizar unas nuevas, que son más rápidas y más seguras. Con lo cual el código hay que actualizarlo. Habría que mirar cuando ha sido la última vez que se ha actualizado para ver, que hace poco tiempo. Sabemos que ahora ha salido una versión nueva de WordPress, hace poco pues que sea compatible con la última versión de WordPress. Que el equipo de desarrollo de buen soporte. Entramos en el foro de soporte de asistencia al cliente y vemos si están contestadas todas las preguntas. Que tengan unas buenas reseñas, unas buenas valoraciones. Y que tengan una buena documentación. Que si encargamos alguna modificación a un desarrollador, desarrolladora, que pueda ver bien cómo está hecho para poder hacer los cambios. Esta recomendación es para un tema de terceros que instalemos en nuestra web, también valen para cuando encargamos un tema a medida. Que podamos confiar en el equipo de desarrollo y que esté actualizado. Sabemos que si muchas veces pensamos, bueno, pues yo encargo un proyecto web, encargo una web, me cuesta X y ya la tengo. Hay que actualizarla. Nos queda muy claro, entendemos muy bien. Que hay que mirar que el tema que instalamos de terceros esté actualizado, pues cuando contratamos un desarrollo a medida, pues también hay que ir actualizándolo de la misma manera. O cuando somos nosotros los desarrolladores, pues también. Que podamos probarlo, esto es muy deseable. Que podamos probar cómo es el tema y podamos ver cómo se comporta y si da fallos o si sea de cua, a lo que nosotros necesitamos antes de tener que comprarlo. La mayoría de los temas de terceros nos permiten ver una demo, incluso pues con contenido de prueba para ver un poco cómo se va a ver nuestra tienda online con el tema instalado. Que nos deje importar datos ficticios para ver todas las posibilidades. E incluso que podamos medir la velocidad de carga para comprobar que es un tema que vaya rápido. Muchas veces se habla de cuánto pesa un tema, de los megabytes que ocupa la carpeta. Eso realmente no es tan importante. Lo importante es que haga pocas peticiones al servidor y que vaya rápido. Y eso solo lo podemos probar, pues efectivamente instalando en una web de pruebas y hacer una medición. Que tenga patrones de bloques, ya sabemos lo que son. Esas secciones que están prediseñadas. Y en una tienda online es fundamental para poder cumplir con los requisitos de una tienda. Primero llamadas a la acción para que el usuario pueda encontrar el botón de compra o de seguir navegando fácilmente. Para eso necesitamos tener patrones que nos permitan de una manera visual poder hacer estos mensajes. Patrones para testimonios, para poder dar credibilidad. La tienda online es fundamental que el usuario tenga seguridad y confianza. Confianza para que sepa que la tienda online no es un fraude, sino que cuando haga la compra efectivamente le llegará el paquete a casa o podrá acceder al curso online que esté comprando o el producto que sea. Y también seguridad de que es efectivamente lo que quiere comprar, que no se está equivocando. Todo esto lo vamos a conseguir usando toda esta información gracias a los patrones de bloques. Que tenga patrones para poder incorporar redes sociales para compartir en redes sociales las distintas formas de pago que venga con iconos que podamos incorporar iconos de las distintas formas de pago que ofrecemos, Apple Pay o lo que sea. Galerías de imágenes muy importantes para la página de producto que podamos poner buenas imágenes de producto, migas de pan si es necesario. No en todas las tiendas online hace falta poner migas de pan si no hay una navegación compleja, no la necesitamos. Menos es más y sobre todo en una tienda online. No podemos hacer que el usuario se pierda con muchas opciones. Y luego cosas tan evidentes como el sobre nosotros y el contacto, que estos patrones de bloques nos permitan hacer unas buenas configuraciones. Que sea compatible con el editor del sitio quiere decir que tenga las plantillas, las partes de plantilla, todo lo que hemos visto antes. Que hoy en día es fundamental que sea compatible con esto, que es el futuro. Que se adapte bien a dispositivos móviles. Hoy en día ya no vale con que sea responsivo y menos si hablamos de una tienda online. Lo que esperamos de una tienda online es que el comportamiento móviles sea diferente al de escritorio. Por ejemplo, que el botón de compra que en escritorio lo tenemos arriba a la derecha, por ejemplo, pues que en móvil lo tengamos abajo y sticky. Que se quede siempre fijo. Y que tengamos una experiencia mucho más agradable en móviles. No que se vea bien, que estén todos los elementos dentro de la pantalla y que ninguno se vaya. Eso es básico hoy en día. Para un buen tema, para una tienda online lo que esperamos es que tenga esas ventajas de usabilidad. Y esto cuando instalamos la demo del tema, pues tenemos que comprobar. A ver si tenemos una mejor experiencia en móviles con respecto a escritorio. Que en nuestro sobrecargado hay muchos temas que tienen muchísimas opciones, estos temas multipropósito, que van a hacer muchas peticiones al servidor, que van a ralentizar la web y que nosotros no las vamos a utilizar. Aquí cuanto más afine el tema mejor. Y que no tenga funcionalidades. La funcionalidad la tienen que incorporar los plugins. ¿Qué significa funcionalidad en un tema de una tienda online? Pues, por ejemplo, reservas, calendario para concertar citas. Todo eso no lo tienen que incorporar el tema, sino que lo tenemos que incorporar con plugins. Esto es importante porque hay algunos temas de T-ceros que incluyen ya esas funcionalidades y pensamos que es un 2x1, que ya me solucionan en la papeleta, y luego tenemos problema cuando necesitemos cambiar el diseño. Que el estilo exprese tu marca. Las tiendas online tienen que expresar la marca del producto o servicio. Pero, claro, esto, fíjate que antes era mucho más importante cuando el tema implicaba una tipografía, unos colores, una diagramación concreta, una maquetación concreta, una retícula concreta. Pero ahora, como en los estilos globales, podemos modificarlo, realmente no sería tan importante que el tema tenga esos estilos, porque después se pueden modificar sin necesidad de tocar código. Pero sí, cuanto antes nos solucionen el problema, o sea, cuanto más se parezca lo que nosotros queremos conseguir, pues menos camino tendremos que andar. Así que vamos a intentar que lo que exprese el tema a través de tipografía, colores, espaciados, pues que se parezca cuanto más mejor, y así no tendremos que modificar. Sobre todo, a la hora de elegir un tema, y ya que estamos en un evento de comunidad WordPress, yo te diría, pide recomendación. Ya sabemos más o menos en qué hay que fijarse, pero esto que mejor te lo va a decir es una persona que conozca el código PHP, que te veas y que sepa decirte si está recargado, si no, si te vale para tu funcionalidad, si no, una persona experta en comercio electrónico, pide recomendación. Aquí estamos, personas que hacemos webs, tiendas online para clientes, que te podemos ayudar a elegir el tema. Así que pide recomendación, una vez al mes en las Meetups, y una vez al año en las Workups. Era por decir, sí, bueno, vale, pero ya tengo estáche glís, de cosas en las que me puedo fijar, pero realmente ¿dónde consigue un tema? Vamos a ver, ayúdanos realmente a elegir. Pues caso práctico, vamos a elegir un tema para bucomers en el repositorio. Hay unos filtros en los que podemos elegir, que esté preparado para comercio electrónico, que esté listo para accesibilidad, que tenga patrones del editor de bloques y que esté preparado para full site editing, vale, de 5.000 y pico, bajo a 1.900, lo bajo a 182, 15, que sean compatibles con el editor del sitio, hay accesibilidad, ya solo hay una, y encima no es un tema, es un framework preparado, no hay. ¿Dónde lo podemos conseguir? Pues de momento, no en el repositorio oficial, pero sí en temas de terceros, de pago, he seleccionado unos cuantos, los dos primeros son estudios de diseño independientes y los demás son grandes conocidos históricos de la comunidad Workups, incluso patrocinadores de esta Workup. ¿Y esto es todo? ¿Alguna pregunta? Que sea fácil, por favor. Es fácil, te tenía que haber conocido hace un año. Por ejemplo... Gracias. Me estuve pegando medio año con el Stormfront. Sí. Entonces, ahí he pasado al Astra. Sí. Y ahora que veo el 23 este, me aconsejas cambiar de Astra a 25. Astra es un temazo, yo creo que no deberías cambiar de momento. ¿Tienes algún problema concreto con la apariencia de la tienda? No me deja desarrollar, cuando estoy en ello, pero es demasiado... Es demasiado... Hay que saber desarrollar, hay que saber código para poder aprovechar todas las ventajas. No te responde. Podemos hablar luego, después, si te explico un poco algunas cosas, pero yo te diría que no hace falta que cambies de tema. De hecho, el 2023, yo lo he contado muy bonito, que te permite lo otro, pero todavía estamos en primeras fases de desarrollo. O sea, que si tienes una tienda funcionando, como dicen los desarrolladores, si funcionan no lo toques. Y yo te diría que utilices el directorio de patrones de bloques para poder arrastrar y soltar. Pero el Astra lo tiene? Sí, porque eso es WordPress. Independientemente del tema, hay un directorio de patrones de bloques que tú puedes aprovechar. Y luego también puedes, en Astra, puedes editar los estilos. Si luego, si quieres, tengo el ordenador. Lo vemos. Gracias. Muchas gracias, Ana. No estoy dentro, ¿no?