107 | Es Genesis sólo para los que saben código?
2 May 2018 · 16 min
Episode 107 (Gonzalo Navarro) answers whether the Genesis WordPress framework is only for people who know code. Gonzalo explains Genesis's hook system (action and filter hooks), argues Genesis is developer-friendly but usable without coding via plugins and tools, and highlights Genesis Extender as a powerful visual/assistant plugin that permits CSS/PHP changes, conditional widget areas, and visual CSS building without hand-coding. The episode also mentions a Zona Código video (video 58), a new Genesis Extender course, the plugin Variation Swatches for WooCommerce, and links to related episodes and courses in the show notes.
Chapters
En el episodio 107 de WordPress semanal respondo a la pregunta tan común de si hay que saber código para poder usar Genesis. Y además lo hago dándote soluciones muy prácticas. Vamos allá. Hola, hola. Soy Gonzalo, de GonzaloNavarro es y bienvenidos a WordPress Semanal, el podcast en el que aprendes WordPress de principio a fin. Porque ya lo sabes, no hay mayor satisfacción ni mejor inversión que la de crear y gestionar tu propia página web con WordPress. Y yo estoy aquí con este podcast y con todos los contenidos de mi web para ayudarte a conseguirlo. Y hoy os quiero hablar a los que tengáis dudas sobre si Genesis se puede usar aunque no sepas código, obteniendo buenos resultados sin que estés limitado, porque la gracia de utilizar un theme en concreto es que no estés limitado y puedas hacer lo que necesitas, ¿Vale? Vamos a responder a a esa pregunta con explicaciones de cómo funciona Genesis, con cómo puedes usar Genesis en función de tu nivel, y por supuesto, de extensiones muy potentes que te pueden ayudar a hacer cosas increíbles, ¿Vale? Vamos a hablar de todo eso en este episodio, pero antes vamos a comentar las novedades que hay en Gonzalo Navarro. Es esta semana, que son dos. A final de mes siempre hay dos novedades. Una, el nuevo vídeo de la Zona Código en el que te enseño a poner un enlace para que te escriban directamente al WhatsApp o desde tu web con WordPress. Suena tal y como es, ¿Vale? Si una persona está en su móvil navegando por tu web y ve que abajo o donde sea, tienes un enlace en el que pones, por ejemplo, escríbeme por WhatsApp, esa persona hace clic en el enlace y automáticamente se le abre una conversación contigo por WhatsApp, ¿Vale? Pero también te enseño a que si no está en un dispositivo móvil, pues que no vea ese enlace, o si prefieres, te enseño a que te pueda contactar por la aplicación de WhatsApp para ordenadores. Y. Y si no, porque mucha gente no tiene la aplicación de WhatsApp para ordenadores, también te enseño cómo hacer que te puedan contactar por web WhatsApp, ¿Sí? ¿Así que te enseño todas las posibilidades, te explico un poco qué haría yo, como gestionaría esto, y por supuesto, te dejo el código para que lo copies y lo pegues y tengas esto funcionando en tu web, que eso es lo que me gusta hacer en la zona Código, darte lo que necesitas, enseñarte cómo hacerlo, que copies, pegues y lo tengas, sí? Este es el vídeo 58 de la zona Código, ya sabéis que es parte del área para suscriptores, así que si eres suscriptor lo tienes y si no pues te puedes suscribir. Si quieres ver todos los vídeos de la zona Código, de qué van y un poquito un resumen de ellos, puedes ir a GonzaloNabarro es códigos y para suscribirte a GonzaloNabarro es cursos. Y hablando de cursos, hay un nuevo curso esta semana también en Gonzalo Navarro, es que es el curso de Genesis Extender, me lo pedisteis mucho cuando hice el curso sobre Genesis, porque dediqué, creo que las últimas tres clases se la dediqué a Genesis Extender, visteis todas las posibilidades que tenía, que realmente es una pasada, que para los que no lo conozcáis es un plugin para Genesis que te permite gestionar todo lo que tenga que ver con el uso del código, ya sea CSS, ya sea php, ya sea JavaScript, de una forma súper sencilla con constructores especiales que te ayudan a poner todo ese código sin tener que escribirlo, además de que te permite crear de forma sencilla widget, áreas, páginas de plantilla y páginas estructurales de WordPress, que esto vemos de qué se trata en el curso Hooks, que vamos a hablar de ello hoy en esta clase os voy a adentrar en ese término y explicar cómo funciona, que os va a encantar. Bueno, básicamente lo que hace es poner todo el potencial de Génesis a tu alcance sin que sepas código, que es de lo que vamos a hablar en este episodio. Y con esto ya se os estoy adaptando, adelantando un poquito la respuesta a la pregunta con la que comienzo el episodio, que es si, es Genesis, solo para los que saben código, pero no quiero adelantarme más, así que saltamos ahora al plugin de la semana, que es para mostrar variaciones de producto en WooCommerce y que no sean horribles. ¿Qué quiero decir con esto? Bueno, te hablo del plugin Variation Swatches for WooCommerce que te permite mostrar variaciones de producto de forma más visual, deshaciéndote del típico desplegable que te sale. Por ejemplo, si tienes un producto que vendes en varios colores, eso es una variación, tienes el producto, un bolso por ejemplo, en negro, en marrón y en rosa palo. Te digo estos colores porque estoy haciendo justo ahora una tienda online, uno de los productos es un bolso en esos tres colores, ¿Vale? Pues lo normal en WooCommerce es que cuando tú pones esa variación de producto, después en la página de producto donde tú ves las especificaciones de producto, ves el precio y le das a comprar ahí si tienes distintos colores pues te sale un desplegable, te pone color, tú pinchas y te salen pues todos los colores y ya lo eliges ¿Vale? Esto no queda muy visual, no queda muy bonito, está bien pero no queda del todo bonito. Entonces hay varios plugins, yo el que uso es este, pero hay varios plugins para hacer eso más bonito, por ejemplo si son colores pues que te salgan los colores y el cliente, el posible comprador pueda simplemente para elegir qué color quiere de bolso, marcar el color, es decir, estar viendo los colores y marcarlo, pero si tienes variaciones por ejemplo pues de talla, pues también puedes hacer que salga pues la talla s, la talla m y la talla l en lugar de tener que elegirlo de un desplegable o si no sé la variación del producto es que lo puedes comprar en packs o algo así, pues puedes poner una imagen pequeñita que defina muy bien la variación de cada producto. Así que básicamente puedes elegir entre tres cosas con este plugin, entre color, imagen o etiqueta y con esto tienes todo a tu disposición, porque color, bueno es color, imagen te permite subir cualquier imagen que tú quieras. Esto cuando estás creando los atributos, que si no estáis muy familiarizados os recomiendo el curso de WooCommerce que vemos todo en detalle, además es un curso diferente al resto que tengo porque son todos vídeos más cortitos y en lugar de 10 vídeos o 10 clases que es lo que suelo tener, son 19 clases con vídeos más cortitos porque pienso que es mejor, más fácil de seguir y si tengo que actualizar algo, como WooCommerce se va actualizando, pues voy actualizando cada parte en concreto, ¿Vale? Pero bueno, no me quiero liar, como digo, cuando estás definiendo los atributos de un producto le puedes ya dar ahí pues o texto o un color o una imagen, con lo cual puedes hacer lo que quieras. Sí, como digo hay muchos plugins que hacen cosas similares, pero yo personalmente este es el que suelo utilizar, no quiero decir que no haya otros mejores, pero siempre he usado este, o sea que es el que sigo usando de nuevo Variation Swatches for woocommerce, te lo dejo en las notas del programa. Y ahora ya sí, vamos con el tema central. Deberías y puedes usar Genesis si no te gusta lidiar con código. Bien, primero, ¿Por qué publico este episodio? Vale, porque hay mucha gente, o hay por ahí una corriente que dice que Genesis es ideal si eres desarrollador o si te dedicas a hacer páginas web. Bien, ¿Por qué se dice esto? ¿Por qué se dice que Genesis es para los que saben código? Bueno, porque es cierto que si eres desarrollador tienes muchas opciones. Si llegas a dominar estas peculiaridades que tiene Génesis, que ahora voy a hablar de ellas, puedes hacer grandes cambios de forma sencilla y además te puede ahorrar mucho tiempo a la hora de crear tus páginas web. Pero ¿Por qué? ¿Qué es eso que hace especial a Genesis para los desarrolladores? Bueno, pues básicamente su particular forma de trabajar con hooks, que ahora te voy a explicar qué son y que esto te da muchísima versatilidad, ¿Vale? Y los hooks tenemos dos tipos, tenemos los Action Hooks y los Filter Hooks. ¿Yo lo suelo explicar en mis cursos y en los episodios del podcast sobre los que he hablado de Génesis, yo los explico como espacios que tienes en tu web y que básicamente puedes hacer dos cosas con ocupar ese espacio con algo o dos modificar si hay algo en ese espacio, vale? Modificar puede ser cambiarlo por otra cosa, alterarlo un poquito, eliminarlo. Y por espacios me refiero por ejemplo al header, la parte superior de tu web, donde tienes el logo, el menú principal y demás. Eso puede ser un espacio, pero otro espacio puede ser por encima del header, que normalmente eso no está ocupado, pues tú podrías ocuparlo si quieres con un action hook también debajo del header, también dentro de un post, por ejemplo, antes del título, debajo del título, el título en sí, en el contenido, debajo del contenido, en la zona de comentarios, debajo de la zona de comentarios, en la sidebar, encima de la sidebar, debajo de la sidebar. Todo eso son espacios que si te lo estás imaginando en tu cabeza, son sitios de tu web donde tú podrías poner cosas si quieres, o donde si ya hay algo, puedes alterarlo. Básicamente los action hooks sería cuando ponemos algo en un espacio cuando lo estamos ocupando, y los filter hooks sería cuando modificamos algo de un espacio, ¿Vale? Así es como yo lo suelo explicar. ¿Otra forma un poquito más literal y que también viene muy bien para entenderlo es utilizar el significado de la propia palabra, hook es gancho en inglés, entonces también te puedes imaginar que tienes ganchos por toda tu web y que con los action hooks lo que haces es colgar en esos ganchos algo que tú quieras, pues un poco de texto, una widget área, un call to action, un menú, vale? Lo cuelgas en esos ganchos que están por toda tu web. Y los filter hooks, pues siguiendo con esta analogía, sería descolgar algo que ya hay y colgar otra cosa, ¿Vale? ¿No sé qué ejemplo te gusta más y si lo entiendes con estos ejemplos, sino de todas formas te dejo varios enlaces en las notas del programa, entre ellos al curso de Génesis, ahí explico muy bien el uso de los hooks, también tengo un episodio, el 50 y a ver que lo mire, el 55, que hablo de por qué yo uso Genesis, vale? Ese episodio 55 del podcast, ahí también hablo de esto, pero básicamente con los hooks podemos poner lo que queramos, donde queramos. Ahora, todo esto es muy técnico, te estoy hablando de hooks, que esto pues suena mucho a código y demás. ¿Esto quiere decir que Genesis no es para todos? ¿No, vale? Es como cualquier otro Thing, si tú usas un Thing que no tiene estas cosas extra como Genesis, estas cosas especiales, si quieres hacer algún tipo de modificación que se sale de las opciones del Thing, también vas a necesitar usar código, y si no sabes código, pues tendrás que buscar una alternativa, como por ejemplo utilizar un Page Builder. Pero es que eso también lo puedes hacer con Genesis, o sea, el hecho de que sea bueno para desarrolladores, porque trae unas características muy especiales, no hace que deje de ser bueno para el resto de usuarios, porque además Genesis, ya lo he comentado en varias ocasiones, es un framework de una calidad muy grande, entonces es un muy buen tema o un muy buen framework. Estoy hablando de Genesis sin haber explicado qué es Genesis, porque ya tengo mucho contenido al respecto, por ejemplo en el episodio que te comento de por qué uso Genesis, explico muy bien qué es Genesis. Luego tengo un tutorial que es una guía de frameworks para WordPress, que ahí hablo de Genesis y de otros frameworks. Todo esto los dejo en los enlaces. Este es el episodio 107, como no quiero volver a repetir que es Genesis y todo lo demás, os dejo el enlace a ese episodio y si tenéis interés y no sabéis, estáis aquí en este episodio sin saber muy bien qué es Genesis, os lo dejo, ¿Vale? Entonces, como digo, Genesis es muy bueno para desarrolladores, pero eso no quiere decir que todos los desarrolladores tengan que utilizarlo, ni que el que no sea desarrollador pueda utilizarlo y sacarle mucho partido. Ahora, ¿Cómo sacamos partido de esas opciones especiales que realmente están pensadas para desarrolladores? Si tú no sabes código, ¿Puedes hacerlo? ¿Puedes sacarle partido? Sí, y hay muchos plugins para ello. Dedica un episodio entero, plugins de Genesis muy buenos, creo que recomiendo 12 plugins y el episodio es el 71 del podcast, también os lo dejo en las notas del programa. Pues hay muchos plugins que te permiten hacer uso de todo esto que yo te he comentado, de los hooks y de otras cosas también potentes que tampoco te he llegado a comentar aún sin saber código. Además, la gracia es que mientras lo haces vas aprendiendo, porque te vas familiarizando con todo esto de los hooks, vas viendo el código que el propio plugin te genera, con lo cual también lo vas entendiendo poco a poco. Y bueno, si eres suscriptor, todo esto lo tienes en el curso de Genesis. Ahí vemos los principales plugins y cómo hacer todo esto sin usar código. Y luego tenemos el plugin de plugins que es Genesis Extender, que este es que te permite hacer absolutamente todo, ¿Vale? Y es precisamente el curso que acabo de sacar. Es un curso de Genesis Extender, en el que ahí cogemos una web en blanco desde cero, el Genesis Sample Theme, que es el que te viene con Genesis, que no tiene nada de estilos, o bueno, lo mínimo para que tampoco sea horrible. Y vamos viendo todas las funcionalidades de Genesis Extender, te voy explicando una a una todas, combinando una cosa con otra. Es bastante avanzado en eso, pero lo hacemos de forma práctica, convirtiendo la web plana que teníamos en una web mucho más chula, más visual, sobre todo con funcionalidades más avanzadas. ¿Y concretamente ¿Qué te permite hacer? ¿Qué puedes hacer con Genesis Extender? Bueno, primero, punto número uno, puedes usar CSS y PHP sin saber CSS ni PHP. Y además tienes un constructor visual de CSS en el que tú estando en tu web, viendo tu web tal como la verían tus usuarios, puedes ir pues clicando en una cosa, modificando su aspecto con CSS, que no lo escribes, sino que lo vas eligiendo de un panel, y después, si estás contento, pues aplicas los cambios. También tienes un asistente de PHP donde vas seleccionando opciones, con lo cual imagínate lo que esto te ayuda, que no tengas que estar escribiendo el código, sino que lo va seleccionando. Puedes crear widget áreas personalizadas y mostrarla donde quieras y como quieras, porque con los hooks las puedes poner donde tú quieras, que además esto no lo haces escribiendo código, sino que lo haces usando Genesis Extender. Y luego como vemos que tiene un constructor visual de CSS, puedes darle el aspecto que quieras una vez pongas la widget área donde sea. Luego puedes mostrar contenidos de forma condicional, por ejemplo puedes mostrar, que esto lo vemos en el curso, una sidebar con unos widgets cuando la gente esté en un post del blog y con otros widgets cuando estén en una página concreta. Por ejemplo en los post del blog pues mostrarle las entradas recientes, un widget de buscar y en las páginas más corporativas pues mostrarle un formulario de contacto, un call to action o Otra forma de hacer esto también condicional es con etiquetas. Esto te permite que por ejemplo, imagínate que tú tienes tres CTA distintos en tu web, uno para que la gente se apunte a algo gratuito, otro para que la gente te compre una cosa muy básica y otro para que la gente te compre ya algo más caro, un producto más avanzado. Pues por ejemplo en las páginas de tu web que dediques, digamos a empezar a hacer que la gente te conozca, a promocionar ese contenido que tú tienes gratuito al que la gente se puede apuntar, pues ahí cuando tú estés creando contenidos enfocados a eso, simplemente en el área de edición de la página o del post que estés creando, vas a tener unas opciones abajo y tú marcas, pones por ejemplo CTA para que se apunten al contenido gratuito, lo marcas y en esa página, sólo en esa página se va a mostrar que después que estás creando otra página donde te interesa mostrar un CTA para que la gente te compre algo, marcas una casillita para que se muestre ese CTA. Pues todo esto, toda esta versatilidad, todas estas opciones puedes hacerla de forma súper sencilla con Genesis Extender y lo vemos en el curso, por supuesto. Así que en definitiva vas a poder aprovechar todos esos ganchos de los que te he hablado al principio, todos esos hooks para modificar tu web pero sin escribir código, además de otro montón de cosas como editar CSS sin escribirlo, crear widget áreas, que incluso vemos cómo crear una home en base a widget áreas, pero las que tú has creado, tus propias widgetarias, con lo cual puedes darle el aspecto que tú quieras a tu página de inicio y después ir rellenándola con widgets. Esto lo vemos con un truquito bastante avanzado, lo hacemos con Genesis Extender, en fin, muchísimas cosas. Podéis ir a la página del curso si queréis más información y ahí lo veis todo, ¿Vale? También os dejo un montón de enlaces en las notas del programa sobre todo lo que he ido hablando y todo, cuando os he dicho que hay un episodio relacionado, un tutorial o lo que sea, lo tenéis todo ahí si algo de lo que he comentado os interesa para ampliar información, ¿Vale? Y nada, para cerrar, desde mi punto de vista, Genesis no es sólo para los que saben código. Está claro que si tu intención es usar un thing que ya venga con un constructor visual como puede ser DIVI, o como puede ser muchos themes de Thin Forest, la mayoría, pues entonces Genesis no es para ti, pero tampoco lo sería casi ningún theme. Así que si te gusta porque Genesis está bien desarrollado en términos de calidad de código, en términos de seguridad, en términos de SEO, o si te atrae mucho la posibilidad que ofrecen sus hooks, sus widget áreas y demás, entonces que no te pare el hecho de que no sepas código, porque como lo que he querido transmitir a lo largo de este episodio es que tienes grandes soluciones para conseguir aquello que puedes hacer por código sin tener que saber código. Y ya lo sabes, para seguir aprendiendo a gestionar tu negocio o proyecto con WordPress, puedes probar el área para suscriptores durante 15 días sin compromiso, le puedes echar un vistazo a los cursos de Génesis, a los cursos de e commerce, a los cursos más enfocados al marketing como Facebook Ads, email marketing, SEO, seguridad, velocidad en WordPress, en fin, ya sabéis todo lo que hay, podéis ir a GonzaloNavarro es cursos, ahí tenéis todos los cursos y como digo, me encanta que lo probéis, porque si os interesa seguís, si no me contactáis Gonzalo, no quiero seguir, te devuelvo los 10 euros y listo. Y nada más, si te ha gustado el episodio de hoy, ¿Quieres ayudarme a que siga creciendo, a que siga creando episodios como este? Ya sabes que la forma en la que puedes aportar tu granito de arena es dejándome una valoración en iTunes y os lo agradezco muchísimo. No tardáis nada, son unos segundos, vais a vuestra aplicación de podcast, buscáis WordPress semanal y dejáis la reseña que consideréis. Sé que lo hacéis, ¿Vale? Muchos me contactáis, me escribís por email y me decís que habéis dejado la reseña, que queréis ayudarme a que el podcast tenga más visibilidad, que aparezca más en iTunes. Así que de verdad, muchas, muchas gracias. Los que no estáis en iTunes, que sois un montonazo también muchísimas gracias porque me dais me gusta, me comentáis y si no, da igual porque me estáis escuchando, ¿Vale? Así que nada más por este episodio, nos seguimos escuchando. Adiós.
More from Gonzalo
518 | Redes sociales, precios personalizados, audios desde Drive y temas de bloques (Q&A)
513 | Por qué sigo usando estos plugins después de tantos años (y cuáles he abandonado)