Si estás tiempo dentro del mundo WordPress o en busca de un cambio de diseño en tu blog, me atrevo que has escuchado Genesis Framework en alguna ocasión. Este es uno de los diseños para WordPress que más está dando que hablar últimamente.
Y, efectivamente, es el framework que empleo en este blog.
Después de más de un año con Genesis Framework he pasado por todas las etapas: desde simplemente realizar las configuraciones básicas hasta ser capaz de desarrollar mi propio child theme basado en Genesis Framework.
Por ello, creo que ya era hora de sintetizar todo lo que he aprendido durante este tiempo en una única guía para todos aquellos que os queréis iniciar en el mundo Genesis.
¿Tienes en mente pasarte a Genesis Framework de Studiopress o mejorar tus conocimientos sobre el mismo?
Esta es tu guía. ¡Vamos allá!
¿Qué es Genesis Framework?
Llegados a este punto, casi todo el mundo sabe de la existencia de Genesis Framework. Durante los últimos meses se ha popularizado y se ha extendido a un ritmo imparable. Pero, ¿qué es exactamente?
Básicamente se trata de un theme para WordPress desarrollado por la empresa Studiopress, que a su vez se encuentra detrás de conocidos blogs como el de Copyblogger.
Este framework está siendo cada día más utilizado por miles y miles de bloggers. Por algo será, ¿no?
A día de hoy, raro es no encontrar 1 de cada 10 blogs en España de marketing digital que no tengan instalado Genesis Framework. Entre ellos el mío, y he de decirte que hasta el momento es el theme que mejores resultados ha dado en mi blog.
Y es que Genesis Framework tiene una estructura y aporta una serie de ventajas que te ofrecen muy pocos temas a día de hoy.
¿Por qué cambiar a Genesis de Studiopress?
Seguramente por la web encuentres miles de razones por las que pasarte a Genesis. No creo que aporte nada nuevo en este sentido, y de hecho los propios chicos de Studiopress ya elaboraron en su día una gran cantidad de información sobre ello.
No obstante, quiero darte mi visión personal. No quiero hablarte tanto de las razones por las que me cambié a Genesis Framework, sino de aquellos motivos que me han convencido definitivamente a quedarme y no pensar en el cambio a otro diseño.
- Genesis Framework sólo me supone una inversión inicial: el coste del framework es de 60 dólares, lo que en un principio está un poco por encima de cualquier theme de pago en WordPress. A eso, si quieres, puedes sumarle un child theme. No obstante, la compra es válida para todos los sitios que tengas por lo que, a diferencia de la gran mayoría de themes, puedes instalar Genesis la veces que te apetezca.
- Los resultados en tiempos de carga se notan: anteriormente utilizaba un tema de pago de un desarrollador independiente. Aunque tenía un aspecto muy bonito, tanto detalle y complemento se notaban de forma muy negativa en los tiempos de carga. La combinación de Genesis Framework con el hosting de Webempresa me está dando unos resultados muy buenos.
- Es muy fácil de configurar, y el cambio de child theme no genera incompatibilidades: la configuración del tema se realiza en muy pocos pasos, como podrás ver más adelante. Además, esta se realiza sobre el tema padre, por lo que cualquier cambio en el child theme no afectará a las propiedades generales. Por si fuera poco, el cambio de un child theme a otro no genera incompatibilidades como sucedería en el caso de utilizar temas de diferentes autores.
- No soy diseñador gráfico, pero este blog es 100% personalizado por mí: la comunidad de desarrolladores y blogs de Genesis es inmensa. La cantidad de información es tal que, sin saber de código web, he podido diseñar mi propio tema en Genesis. Esto ha sido gracias a todos los tutoriales que están diseñados específicamente para este framework.
La estructura de Genesis Framework
En alguna ocasión a lo largo de este post te he hablado de dos palabras clave para comprender la estructuración de Genesis Framework: tema padre y tema hijo.
En este apartado vamos a ver qué son, qué diferencias existen entre ambos y por qué son tan útiles a la hora de diseñar tu blog.
El framework o tema padre sobre el que construir tu blog
El framework es la versión oculta de tu diseño. Esto no quiere decir que no sea un tema para tu blog. De hecho, el diseño base que incluye Genesis también puedes instalarlo en tu blog y seguro que luce muy bien.
No obstante, esa no es su función principal. El tema padre dispone de todos los archivos necesarios para asegurarnos de que el diseño de WordPress funcione a la perfección.
Es, por así decirlo, la parte oculta que hace que todo sea posible. En él se incluyen todas las configuraciones, idiomas y otra clase de contenidos. Pero el estilo, por defecto, suele ser muy básico pues no es la función que se persigue con un tema padre o framework.
El child theme o el diseño personalizado de tu blog con Genesis Framework
Una vez tengas instalado el tema padre en tu blog WordPress, es necesario personalizarlo. Y, para ello, puedes recurrir a un tema hijo. De esta forma puedes tener un diseño sin tener la necesidad de trastear el código directamente del framework.
Por ello, el tema hijo sólo se ocupa de la parte de personalización. De hecho, si miras cualquier tema hijo de Genesis, sólo incluye un par de archivos, algunas plantillas de páginas y un par de imágenes de logos.
Esto te será más que suficiente para poder personalizar por completo tu blog, pues sólo tendrás que modificar el código de los archivos functions.php (para añadir nuevas opciones a tu child theme) y style.css (para establecer patrones diseños y apariencia).
La ventaja de utilizar un child theme es que, hagas el cambio que hagas, las configuraciones del tema padre no se verán afectadas. De esta forma siempre puedes tener la estructuración de tu sitio alejada de posibles errores en el código que generes si te da por trastear el child theme.
Comenzando con Genesis Framework
El primer paso, como es obvio, es hacerse con Genesis Framework. Y esto me gusta comentarlo a todas las personas que quieren pasarse a este framework, pues existen distintas posibilidades a la hora de contratarlo.
Por ello, quiero hacer un repaso de las opciones que tienes a la hora de instalar Genesis en tu blog.
- Adquirir el framework con un child theme: esta es la opción más usada por la gran mayoría de personas que no tienen demasiados conocimientos de diseño web. Adquieren un child theme con un diseño que les guste para sólo tener que hacer unos ajustes básicos sobre él. Consulta aquí los diferentes child themes de Genesis.
- Adquirir el framework con todos los child themes: la opción más adecuada si eres diseñador web y quieres tener una buena cantidad de themes para enseñar a tus clientes. La compra conjunta de todos, junto con el tema padre, suele venir con un gran descuento de la mano.
- Comprar sólo el framework: la opción más económica y, si tienes tiempo y unos ligeros conocimientos de diseño web, la que más te recomiendo. De esta forma podrás ahorrarte el dinero en un child theme, y los resultados que consigues creando el tuyo propio suelen adaptarse más a tus necesidades. En este enlace puedes comprar el framework.
Una vez lo tengas decidido, es hora de ir hacia la web de Studiopress y comprar tu framework (más child theme si lo crees necesario).
Para ello, una vez estés dentro de la sección Shop for Themes de la web de Studiopress, el paso imprescindible es que adquieras Genesis Framework, pues el tema padre es lo único realmente imprescindible para poder tener Genesis en tu blog.
A partir de ahí, ya es decisión tuya explorar los distintos child themes para examinar si encuentras alguno que se adapte a tus necesidades.
Una vez hayas pasado por el carrito de la compra y tengas descargados en tu ordenador todos los ficheros .zip que hayas comprado, es el momento de hacer la típica instalación de un theme en WordPress.
Para ello, dentro del panel de administración de tu blog WordPress, acude como siempre a Apariencia > Temas > Añadir nuevo > Subir Tema. Sube e instala primero el tema padre. Una vez lo tengas instalado y activado, debes hacer el mismo procedimiento con el child theme que has comprado o desarrollado.
Cómo configurar Genesis una vez instalado en tu blog WordPress
Llegados a este punto no sólo tenemos comprado Genesis Framework, sino que también lo tenemos instalado en nuestro blog WordPress.
Ahora ha llegado el momento de poner nuestro diseño a punto. Y esto, en otras palabras, significa configurar todos los parámetros de este framework para adaptarlo a nuestra medida.
Como te he comentado antes, una de las ventajas que tiene trabajar con un framework es que puedas cambiar cualquier ajuste del tema padre y, pase lo que pase, estos se verán aplicados sobre cualquier tema hijo que instales en tu blog.
Por ello, quiero hacer un repaso por las tres principales opciones de configuración que encuentras en Genesis: Theme Settings, SEO Settings e Import/Export.
Theme Setting: cómo poner a punto tu blog en unos sencillos pasos
Este primer bloque de opciones está enfocado, en exclusiva, a modificar algunas líneas genéricas del diseño de tu blog. Por tanto, es importante no saltarse estas configuraciones al mismo instalar Genesis, pues afectarán al conjunto del diseño sea cual sea el child theme que decidas instalar.
Por ello, vamos a repasar paso por paso todas las opciones que incluye.
Información de Genesis
Comenzamos por lo más básicos. Las actualizaciones de Genesis y, más en concreto, del tema padre. Mediante esta sección podrás determinar si quieres tener actualizaciones automáticas del framework y, además, si quieres mantenerte informado de las mismas.
Feeds personalizados
Si en tu caso utilizas un feed RSS diferente o personalizado, mediante estos dos campos puedes definir uno para los posts y otro para los comentarios. Tan sólo deberás introducir la URL y seleccionar si quieres redireccionar la URL del feed antigua a la tuya personalizada.
Plantilla por defecto
La apariencia general de tu blog y la presencia o no de sidebars es algo que influye de manera muy notable en el diseño de tu blog. De hecho, también tiene una influencia muy notable en las estadísticas de tu sitio, pues en función de unos diseños u otros pueden aumentar o disminuir porcentajes de rebote y tiempos de permanencia.
En esta sección puedes determinarla la apariencia general de la gran mayoría de página de tu blog, mediante la inserción o no de un sidebar (o dos) en tu sitio.
No te preocupes si para una determinada página quieres otra configuración, pues en el editor de posts de WordPress también podrás editar la apariencia del mismo de forma individualizada.
Header
Muy sencillo. Si quieres tener un título en tu blog o, en su lugar un logo, lo puedes modificar mediante esta opción. De elegir un título en formato texto aparecerá aquel que tienes definido en los ajustes generales de WordPress.
Si optas por un lugar, éste podrás modificarlo a través de la pestaña Apariencia que se encuentra en el panel de administración de WordPress.
Migas de pan
Breadcrumbs o migas de pan son aquellas líneas que aparecen antes del título de un artículo y que te muestran la ubicación del blog en la que te encuentras (por ejemplo, la categoría). Es, por así decirlo, una forma de estructurar en qué secciones de tu blog se encuentra el post o la página que están visualizando los lectores.
A través de esta ventana podrás activar las migas de pan, además de seleccionar en qué lugares de tu blog quieres que aparezcan con sólo activar cada una de las casillas.
Comentarios y trackbacks
Tanto los comentarios que los lectores dejan en tu blog como los trackbacks (notificaciones de enlaces) son elementos que indican la actividad externa que las personas dejan en tu sitio.
No obstante, podemos prescindir de ellos o seleccionar en qué zonas queremos que aparezcan. En mi caso, por ejemplo, me gusta que los lectores comenten en mi blog pero no en las páginas de aterrizaje donde trato de captar suscriptores.
Mediante estas casillas puedes seleccionar si quieres o no comentarios y trackbacks en posts y páginas.
Archivos de contenido
Con página de contenidos Genesis se refiere a la típica página de todo blog en la que se muestran las últimas entradas (en formato de lista) de tu sitio. Vamos, la página de Blog de toda la vida que encuentras en cualquier sitio web.
Esto también es fácilmente modificable desde Genesis Framework. Entre las múltiples opciones puedes elegir lo siguiente:
- Mostrar parte del contenido limitado a los caracteres que tu quieras o un resumen.
- Insertar una imagen destacada junto con el título y la descripción, además de especificar las dimensiones de las mismas.
- Seleccionar si quieres que los lectores acceden a entradas más antiguas mediante números o botones de anterior/siguiente.
Plantilla del blog
Desde este panel puedes modificar las opciones de visualización de los posts de tu blog en las páginas de contenidos. De este modo puedes modificar qué posts quieres que se muestren en función de su categoría, así como el número de posts que saldrán por página.
Scripts en el header y footer
En ocasiones tienes que insertar ciertos códigos en tu blog. Estos pueden ser los clásicos comandos para habilitar Google Analytics en tu blog, píxeles de conversión de Facebook o cualquier otro código script.
Desde estos cuadros de texto puedes insertar, ya sea en el head o en el footer, este tipo de códigos que te comento.
SEO Setting: una buena alternativa para controlar los ajustes SEO de Genesis
Antes de nada tengo que comentarte que no utilizo estas opciones de SEO que ofrece el propio Genesis Framework. En su lugar, siempre soy partidario de utilizar plugins SEO para WordPress con un mayor número de configuraciones como son Yoast SEO y All In One SEO Pack.
De hecho, cuando instalas alguno de estos plugins junto con Genesis las opciones de SEO de este theme desaparecen para dar prioridad a las configuraciones del plugin.
Aun así, como toda opción que viene incluida en Genesis Framework, quiero explicarte cómo funciona para que tú mismo decidas cual es el método que más te conviene.
Ajustes de todo el sitio
Estas opciones se aplican para todas las páginas del blog y, casi siempre, están relacionadas con los formatos de títulos. La primera opción que nos encontramos es la de utilizar HTML5 para nuestros títulos, lo cual es algo que no te recomiendo ya que la posibilidad de tener varios títulos H1 tiene efectos negativos. Mejor dejar sólo el H1 para el título del post.
Visto esto, la siguiente opción está enfocada a incluir el título de tu blog al final de cada etiqueta de título. Por ejemplo, cuando un lector busca un post tuyo en Google puede encontrarse con una estructura de título con sólo el nombre o con “Nombre del post – Título del blog”.
Seleccionando esta opción puedes determinar si quieres que aparezca el título de tu blog en cada título. Recuerda que esto se aplicará para la visualización en buscadores y no en el propio contenido. Las dos siguientes opciones son relacionadas con esta, pues puedes decidir si quieres que el título del blog aparezca a la izquierda o la derecha y que separador puedes utilizar.
Ajustes de la homepage
La utilización de un título correcto en la homepage es un factor de SEO On Page a tener en cuenta, pues jugar con las palabras clave repercutirá en tu posicionamiento.
En la primera configuración podrás decidir qué elemento (de entre los 3 que se muestran) aparezca como título H1 del blog. Personalmente, mi consejo es que emplees el propio título del sitio. Junto con ello, otro elemento que debes utilizar para mejorar el CTR es la Home Meta Description, la cual la debes rellenar con la información de tu blog sin exceder de los 155 caracteres.
Las Home Meta Keywords, desde hace unos años, dejaron de tener influencia en SEO. Aun así, si sigues queriendo asociar tu homepage a palabras clave, siempre puedes incluir las principales aquí.
Y, por último, Genesis Framework también te da la posibilidad de no indexar la homepage mediante las etiquetas noindex, nofollow o noarchive. Una vez más, mi consejo es que dejes estas casillas en blanco pues todo el mundo está interesado en que la página principal de su blog aparezca en los resultados de búsqueda.
Ajustes del head
En ocasiones puedes utilizar algún software como Windows Live Writer para escribir las entradas de tu blog. Esto, junto con otra serie de acciones que no quiero pararme a detallar, genera etiquetas que se insertan en el head de tu blog.
Lo más recomendado es que no hagas uso de ellas y, por ello, mi consejo es que no actives ninguna de estas tres casillas.
Ajustes de las meta etiquetas
Por último toca hablar de las meta etiquetas. Y, en concreto, de aquellas que permiten indexar o no determinadas partes de nuestro sitio, pues desde esta sección las podemos configurar.
Mi consejo es que no indexes archivos de autor y de fechas si en tu blog sólo escribes tú. Además, también te recomiendo que actives las casillas de nooodp y noydir, para que Google no utilice las descripciones de tu blog que aparecen en directorios externos.
Import/Export: una buena utilidad para migrar configuraciones en el diseño
Tanto si quieres importar tus configuraciones a otro blog, como si necesitas los ajustes de otro sitio en tu WordPress, desde estos dos comandos puedes importar y exportar todas las opciones que has definido en Genesis.
Plugins de Genesis Framework: qué funcionalidades puedes añadir a tu blog
No conozco usuario de WordPress que no tenga ni una ligera adicción a los plugins. Lo cierto es que estos complementos nos simplifican en gran medida muchas de las acciones que requieren de unos ciertos conocimientos técnicos.
Desde plugins de SEO hasta mejorar de la velocidad de tu sitio, puedes encontrar plugins WordPress para casi todo lo que te imagines.
Y, teniendo a Genesis como uno de los referentes en los diseños de WordPress, no es de extrañar que también existan una serie de complementos específicos para este framework de Studiopress.
En efecto, si realizas una simple búsqueda por Internet podrás encontrar una gran cantidad de plugins para potenciar las funcionalidades de Genesis Framework. Una buena parte son creados por los chicos y chicas de Studiopress, pero también puedes encontrar un repositorio creado por desarrolladores independientes.
Yo no quiero marearte con decenas de plugins que, casi con total seguridad, no manejarás salvo en ocasiones puntuales. Por ello sólo quiero hablarte de los que, con mayor o menor frecuencia, suelo instalar en los blogs que creo o diseño bajo Genesis Framework.
– Genesis eNews Extended: actualmente utilizo plugins de pago para gestionar la captación de suscriptores por motivos de análisis y tests A/B, pero durante mucho tiempo atrás he utilizado la opción de Studiopress. Genesis eNews Extended es un plugin que puedes instalar seas usuario o no de Genesis, y para mí es el plugin para captar suscriptores más sencillo y personalizable que conozco. Es cierto que sólo permite insertar el código y definir los parámetros que quieres que tus lectores introduzcan en el formulario, pero con un poco de conocimientos de CSS puedes dejar diseños muy personalizados.
– Simple Social Icons: muy sencillo, al igual que el plugin anterior, pero con unas funciones muy bien definidas y totalmente personalizable con algo de código CSS. Simple Social Icons te permite insertar, a modo de widget, iconos para que tus lectores sigan tus perfiles de redes sociales.
– Genesis Simple Edits: si no te manejas muy bien con el código web, este plugin puede darte una pequeña ayuda para modificar determinadas secciones e información en tu blog. Más en concreto, Genesis Simple Edits añade una pestaña en la configuración del theme para modificar la información de un post, los metadatos y la información que aparece en el footer de tu sitio.
– Genesis Responsive Slider: nunca he sido demasiado defensor de los sliders en un blog. En su lugar siempre he sido partidario de poner una zona de suscripción. No obstante, puede ser que en tu caso si quieras disponer de uno. Para eso existe Genesis Responsive Slider que, siguiendo la tónica de los anteriores, te ofrece unas opciones muy sencillas de configurar para poder poner a punto tu slider.
– Genesis Connect for WooCommerce: no hace más de dos meses que tuve que crear un sitio con WooCommerce para vender productos a través de WordPress. Cuando quise instalar Genesis me di cuenta de que había un error de compatibilidad con Genesis, y es que los archivos de páginas y otros elementos optimizados para tienda online no están preparados para Genesis. Genesis Connect for WooCommerce añade los elementos necesarios para tener la combinación de Genesis + WooCommerce en tu blog.
Conclusiones
En este tutorial te he enseñado los conceptos principales que engloban a Genesis Framework, uno de los framework y themes de WordPress que más están dando que hablar a día de hoy.
Hemos ido de menos a más, hasta tal punto de finalizar esta guía enseñándote unos cuántos consejos de diseño y plugins muy útiles para sacar el máximo partido a tu blog.
Ahora, como siempre, quiero conocer tu opinión:
¿Has utilizado en alguna ocasión Genesis Framework? ¿Cuáles son las ventajas y desventajas que lo encuentras con respecto a cualquier otro theme o framework de WordPress?
¡Espero tus comentarios!
Genesis Framework: la guía para revolucionar el diseño de tu blog WordPress ha sido publicado originalmente en el blog de Alejandro Caballero. Puedes conectar conmigo a través de Twitter, Facebook y Google+.