Has estado intentando crear una landing page con Genesis Framework pero el layout por defecto que trae tu child theme no te convence, no hace lo que tu quieres, Genesis Dambuster te lo permite.
¿ Quieres crear una página con tu maquetador visual favorito, sea el que sea (Visual Composer , Beaver Builder, Thrive Content Builder, Divi Builder, Elementor etc) pero Genesis Framework no se deja por más patadas que le pegues?
¿Pero qué le pasa a genesis Framework cuando quieres saltarte lo establecido? y si quieres crear un template de ancho completo ….
- …sólo con el cabecero de tu web pero no quieres que aparezca ningún menú.
- … y simplemente no quieres que aparezcan los widgets del footer.
- … y no quieres footer.
- … y quieres que tenga el ancho que tu decidas.
- … pero quieres cambiar el padding.
- … o quitar el título
- … etc.
No te preocupes que tengo la solución, a todos tus problemas de insubordinación frente al layout de tu child theme de Genesis Framework.
Creando landing page y páginas de ancho completo en Genesis Framework de forma fácil y sin complicaciones.
En este caso la solución nos viene en forma de plugin.
Para mi gusto es un plugin bastante versátil que te permite modificar el layout de la página que estés trabajando en Genesis framework a tu santo gusto.
Este plugin se llama Genesis Dambuster,
Ya sabemos que Genesis Framework es genial, pero también que cuesta a veces hacer algo que para nosotros es básico, hacerlo con genesis framework se convierte en un dolor.
Normalmente Genesis framework viene preparado para crear paginas de ancho completo, todos o casi todos los child themes de Genesis vienen preparados para crear landing pages .
Estas plantillas pueden reunir los requisitos que tu necesitas o no, en algunos casos vienen con un ancho predefinido que no es el que tu necesitas.
Suelen ser bastante estrechas, esto obedece a que hay por ahí algunos estudios que afirman que las páginas de venta funcionan mejor con anchos más estrechos.
Pero bueno esto no debería de ser motivo para que no puedas hacer un poquito lo que te de la real gana, y trabajar acorde a tus necesidades.
Pero ¿Qué hace Genesis Dambuster?
Según tengo entendido este plugin se creó para poder trabajar sin limitaciones con el maquetador visual Beaver Builder .
La realidad es que yo lo he probado (por aquello de experimentar) con varios maquetadores para wordpress, tales como el mismo Beaver Builder, Thrive Content Builder, Divi Builder y Visual Composer.
Funciona a la perfección con todos ellos, incluso es útil si no usas ningún maquetador visual y prefieres usar el editor visual de wordpress.
Basta con que quieras modificar de algún modo el layout de tu child theme de Genesis.
Te permite remover los siguientes elementos de una pagina o post de genesis de forma individual:
- Título del sitio y la zona derecha de widgets del cabecero (realmente el cabecero completo).
- Navegación primaria.
- Navegación Secundaria.
- Titulo del Post o Página.
- Imagen destacada.
- Post info
- Titulo del post
- Breadcrumbs (migas de pan)
- Caja de autor
- Post Meta
- Footer del post
- Comentarios
- Widget de después de la entrada
- Footer (pie de página).
- Fondo de la pagina, bien sea imagen o color de fondo.
Como ves no es poco
Por ponerte un ejemplo, cuando diseñe la web de autorrealizarte.com, para la que cree un tema hijo de genesis framework, me fue súper útil, ya que su autor, Álvaro lópez , me pedía especificaciones concretas para las diferentes páginas.
Para que me entiendas, el quería que en la home desaparecieran los menús, para hacer un poco como en el Ikea, de forma que el usuario que aterriza en la home tuviera que navegar un poco por ella y desde ahí derivarlo a donde a Álvaro le interesaba.
Aparte de esto Álvaro necesitaba crear algunas páginas de venta.
Usar Genesis Dambuster es tan fácil como marcar en un checkbox lo que no quieres.
Y tu dirás, pues podías haber creado diferentes layouts con código.
Sí la verdad podría, y no hubiera sido muy difícil, hubiera bastado con haber añadido un par de funciones al archivo functions.php del child theme, un poco de código CSS y un par de archivos php con las plantillas necesarias, pero esto lo veremos al final del artículo.
La realidad es que con esto hubiera solucionado un par de limitaciones,
Pero si instalaba este plugin dejaba de tener limitaciones tanto Álvaro como yo.
Para mi es importante que mis clientes tengan la libertad de hacer lo que quieran, ya que la web es para su uso, no para el mío, han de poder hacer modificaciones.
Ya sé que esto es un peligro, pero por algo existe el libre albedrío.
Aparte mis clientes no tienen porque saber PHP ni CSS, para eso ya me contrataron a mí.
En definitiva Genesis Dambuster, nos permite modificar cualquier página o post a nuestro antojo, en función de las necesidades del momento.
¿Con qué temas Funciona ?
Funciona con bastantes de los child themes de Genesis , especialmente con los originales de studiopress pero por desgracia no con todos, puedes ver la lista oficial en la propia página de genesis dambuster y actualizada desde este enlace aquí.
No te preocupes si tu tema no está aquí, estoy preparando otro artículo para que lo hagas tu mismo que pronto publicaré.
Genesis Dambuster.
Este plugin es gratuito y lo encuentras en el repositorio de wordpress.
Instalación.
Se instala como cualquier otro plugin.
- Te diriges a plugins en el menú de wordpress
- Haces click en añadir nuevo.
- Escribes Genesis Dambuster en el buscador
- Haces click en instalar.
- Una vez instalado haces click en activar plugin
Y ZAS toda la magia ya está en marcha.
¿Cómo funciona?
Pues te va a aparecer una nueva metabox al final de tu pagina o post como la que ves a continuación
Desde aquí vamos a ir explicando lo que hace en cada pestaña
Pestaña Enable (activar):
Para activarlo sólo tienes que hacer click en Enable Tweaks dentro de esta pestaña, una vez lo activas si no lo has cambiado la configuración general todos los tweaks aparecen marcados por defecto.
Pestaña Template Width:
Primer Tweak ancho de página, Este tweak hace que Genesis te muestre el layout a ancho completo.
Pestaña Header (cabecero):
Tiene tres checkboxes :
- Remove header: Quita el título del sitio y la zona derecha de widgets del cabecero (realmente el cabecero completo)
- Remove Prim. Nav: Quita la barra de navegación primaria, esté donde esté
- Remove Second. Nav: Elimina la barra de navegación secundaria, esté donde esté.
Above Content (Sobre el contenido):
Compuesto por 6 checkboxes:
- Remove Breadcrumbs: Elimina las migas de pan, estas forman la ruta desde la home hasta la pantalla actual, que suele aparecer en la parte superior bajo el cabecero y la navegación
- Remove Post Title: Marcar esta casilla, elimina el título de la entrada.
- Remove Post Image: Elimina la imagen destacada.
- Remove Entry Header: Elimina el cabecero de la entrada.
- Remove Post Info: Elimina la información post meta (autor, fecha, comentarios, …).
- Remove Edit Link: En caso de estar logueado elimina el link «editar post»
Below Content (Bajo el contenido):
Compuesto por 5 checkboxes:
- Remove Entry Footer: Elimina los tags html que engloban al post footer.
- Remove Post Meta: Elimina la información post meta (Categorías, tags, etc ).
- Remove Author box: Elimina la caja de autor.
- Remove Comments: Elimina los comentarios.
- Remove After Entry: Elimina el área de widgets que hay tras la entrada «After-Entry».
Footer (pie de página):
Compuesto por 2 checkboxes:
- Remove Footer: Elimina el footer o pie de pagina
- Remove widgets: Elimina el área de widgets del footer o pie de página
Background :
Desde esta pestaña podremos eliminar el fondo de página bien sea un color o una imagen.
Helper Classes:
Este tab sólo es necesario en el caso que no uses un constructor visual como pueda ser beaver builder, divi ,Visual composer, Thrive content builder.
En este tab nos encontramos con un checkbox y 2 input de texto supeditadas a si activamos el checkbox enable helpers.
- Checkbox Enable helpers: Nos da la opción de usar unas clases de ayuda añadidas por este plugin en caso de activar esta casilla
- Input Content Width: es caso de marcar el checkbox superior nos permite controlar la anchura del contenido
- Input Content Padding: Nos permite controlar el padding del contenido, siempre y cuando hayamos tildado el checkbox superior.
Configuración:
En realidad no tiene muchas opciones de configuración.
De hecho por un lado tiene las mismas que hemos visto, para que te las deje aplicadas en cada página o post pero por defecto.
Y por otro lado te permite usar Genesis dambuster en otros tipos de custom post types de tu instalación, sean cuales sean.
Video Tutorial sobre como usar Genesis Dambuster
Hasta aquí este post, espero que me cuentes en los comentarios cuál ha sido tu mayor complicación a la hora de trabajar con los layouts de Genesis Framework: Quitar el título de una página, quitar el footer, quitar áreas de widget, etc
Cuéntame si este plugin te soluciona la vida a la hora de hacer esos cambios.
Hola Óscar.
Te quería preguntar si éste plugin también funciona con Elementor Page Builder.
Un saludo y muchas gracias.
Muy buenas Tocayo,
El plugin funciona con Genesis, es decir te permite modificar los layouts de Genesis a tu gusto, en principio se creo para Beaver Builder, pero no creo que tengas ningún problema en usarlo con Elementor , yo no lo he probado con elementor, pero si con Divi builder, Thrive Content Builder y obviamente con Beaver Builder, pero no tengo ninguna duda de que funcionará perfectamente con elementor.
De cualquier forma, pruébalo y nos cuentas.
Un fuerte abrazo y gracias por comentar.
Muchas gracias.
Pues si puedo mañana mismo me meto en harina… Ya te cuento.
Saludos!!!!
Pues por aquí te esperamos para saber si Elementor se deja o no se deja.
Abrazote!!!
Hola Óscar, es mi primer comentario en tu blog, aunque te sigo bastante por Twitter. Espectacular artículo tio. No conocía este plugin y me va a venir muy bien para el blog q estoy creando. Enhorabuena por tu gran trabajo diario. Un saludo
Mil gracias Miguel Angel,
Esto sólo se consigue con gente detrás, como tú, que me apoyan leyendo mis artículos y comentando en ellos, así que muchísimas gracias por el feedback, me alegro de verás que te gusten los contenidos y te envío un fuerte abrazo!!!!
Ha dejado de funcionar este plugin, ¿no? Llevo unos días sin poder utilizarlo, porque han desaparecido todos los «checks», ya no se puede utilizar para nada. Simplemente me ha conservado las páginas que tenía anteriormente (y menos mal, porque me habría hecho un destrozo…).
¿Qué otras alternativas hay? ¿Se puede hacer eso mismo mediante código en vez de con un plugin?
Buenas Carlos,
Es posible que tengas algún tipo de problema de compatibilidad entre plugins, yo lo uso en este mismo blog, lo he comprobado y va perfecto.
Tienes dos opciones para solucionarlo:
1.- Desactivas todos los plugins excepto Genesis Dumbuster, y los vas activando uno a uno y probando hasta que des con el que te está causando el problema, para esto puedes instalar un plugin que hay en el repositorio de wordpress que se llama Health Check & Troubleshooting, este plugin tiene el modo trubleshooting para que tu web permanezca activa mientras tu desactivas temas y plugins y das con el culpable.
2.- Puedes usar una alternativa a Genesis Dumdbuster que quizás es más sencilla de usar que se llama Fullwidth Templates for Any Theme & Page Builder
Espero haberte ayudado a buscar una solución a tu problema.
Fuerte abrazo!!!
Muchísimas gracias, Óscar. Desde luego que me has ayudado. El problema era exactamente ese, incompatibilidad con otro plugin.
He encontrado cuál es el plugin incompatible y lo he quitado.
Mil gracias, porque no sabía cuál podría ser la solución.
¡¡Un abrazo!!
Me alegra mucho haberte ayudado.
Fuerte abrazo!!!