generatepress

GeneratePress. Tutorial completo de un tema 5 estrellas.

generatepress

GeneratePress es el tema que puedes ver en mi página Web y mi tema favorito a día de hoy. Además es el tema que incluyo en mi servicio Haz tu propia Web

GeneratePress es un tema con multitud de posibilidades, tanto si sabes tocar código como si no sabes. Veras mas adelante una por una las opciones que tiene y como configurarlas. Te va a sorprender la de maravillas que puedes hacer muy fácilmente con GeneratePress.

 

Por qué GeneratePress es un tema 5 estrellas?

Es un tema muy limpio y muy fácil de usar. El soporte es rápido y eficiente.

El único problema que le encuentro es la compatibilidad, solo en el caso de que uses las secciones creando tus páginas, con los maquetadores visuales como Visual Composer o Trhive Builder. Lo bueno, es que se puede solucionar con Thrive Leads utilizando shortcodes.

Las siguientes características, lo convierten, en mi humilde opinión, en un tema 5 estrellas.

Código limpio

Los mismos desarrolladores de WordPress han revisado el código de GeneratePress, garantizando que es un codigo limpio y eficiente.

El resultado de esto es un tema sin problemas de incompatibilidades, sin bugs, rápido a la hora de cargar la página, y con un código amigable para los motores de búsqueda.

Responsive 100%

GeneratePress se adapta perfectamente a todo tipo de resoluciones de pantalla y dispositivos. Los temas que salen en la actualidad, prácticamente son todos responsive, pero probablemente ninguno tan bien preparado como este. Podéis comprobarlo perfectamente navegando por esta página Web.

Esta es una característica muy importante de GeneratePress. Porque a parte de que un elevado porcentaje de tus visitas se van a hacer desde dispositivos móviles, a Google y a los motores de búsqueda también le gusta y lo tienen en cuenta de cara al posicionamiento en los buscadores.

Compatibilidad con plugins y navegadores

GeneratePress es compatible con los plugins más importantes de WordPress como son entre otros:

  • WPML (para crear sitios multilingües)
  • WooComerce (para comercios electrónicos)
  • bbPress (para crear foros)

Además GeneratePress es compatible con todos los principales navegadores (Safari, Chrome, IExplorer, Firefox, etc.)

Flexible y fácil de utilizar

GeneratePress es el tema más fácil de configurar y personalizar que he encontrado hasta el momento. Tanto para personas que no tienen conocimientos ni de código, como para usuarios más avanzados que encontrarán si cabe, más opciones de maquetación y desarrollo.

También te sorprenderá la flexibilidad que tiene en el diseño. Un poco más abajo, en el tutorial, podrás comprobar todo esto que te estoy contando.

Ligero y rápido

GeneratePress es un tema que viene absolutamente pelado y sin opciones adicionales en su versión gratuita (de eso hablaremos un poco más abajo). Eres tu quien decide que opciones extras de configuración y personalización quieres añadir mediante sus addons. De esta manera no tienes elementos instalados que no vayas a utilizar y ralenticen el tiempo de carga de tu pagina.


Es un tema 5 estrellas. Pero….¿es gratis?

Si y no. Te lo explico.

Generatepress es gratis, y obtendrás un tema muy ligero y muy rápido. La puedes descargar aquí.

Sin embargo, lo que lo hace un tema muy potente son sus Addons, y estos, aunque a un precio mucho más que asequible, hay que pagarlos. Su precio son 39,95$, y los puedes descargar aquí.

Teniendo en cuenta que un tema en Themeforest te cuesta entre 49$ y 59$ más iva de media, el precio no es tan solo razonable, sino que es muy barato por lo que estás comprando y te diré por qué.

Comprando los addons de GeneratePress, a parte de tener un tema con todas las ventajas que he descrito anteriormente, tienes derecho a:

  1. Soporte ilimitado. Esto quiere decir que siempre tendrás soporte, y además un soporte de calidad.
  2. Actualizaciones ilimitadas. Cada vez que GeneratePress actualice sus addons o su theme y hagan mejoras, tu tendrás la opción de actualizar en tu página y disfrutar de esas mejoras o correcciones.
  3. Instalaciones ilimitadas. Podrás instalar el tema en todas las páginas Web que tu quieras.

Qué pasa que si compras otro tema no tienes derecho a todas estas cosas? Pues no suele ser así. En los mercados de temas online, te suelen ofrecer:

  1. Soporte para 6 meses. Si quieres soporte después lo tienes que pagar y no es barato. Además la calidad del soporte en algunas ocasiones es bueno, pero en otras puede ser terrible. Depende del desarrollador y de su equipo de soporte.
  2. La licencia del tema te permite una sola instalación
  3. Si que sueles disponer de actualizaciones ilimitadas.
  4. Y todo esto, a un precio más elevado y por un tema menos flexible.

Con todo esto que te he contado, ya debes imaginar que mi recomendación es comprar los addons del tema. Cuando los veas a continuación en el tutorial despejarás tus dudas.


Tutorial paso a paso

Vamos a ver paso a paso cada una de las posibilidades que te ofrece este tema. Te pongo los vídeos que ha creado GeneratePress porque creo que han hecho un trabajo estupendo y yo no te lo podría ofrecer con mayor claridad.

Colores

Para utilizar el addon de colores primero debes tenerlo instalado y activado. Como deberás hacer con el resto de addons. A continuación debes ir a “Apariencia” -> “Personalizar”, y seleccionar la opción de “colores. Vamos a dejarnos de rodeos y a ver como se hace en el vídeo.

Tipografías

Elige la fuente que quieras entre todas las que hay en Google Fonts. El ancho de la fuente, el tamaño, si la quieres en negrita o cursiva, etc. Todo esto para cada uno de los elementos de la Web.

Generar secciones

Puedes dividir la página en secciones y hacer que ocupen todo el ancho de página o un ancho fijo. Trabajar con secciones resulta muy cómodo, es como si trabajases con pequeñas página individuales dentro de una misma página.

Deshabilitar elementos

Esta opción te permite deshabilitar elementos en determinadas páginas, como por ejemplo la cabecera de la página, el menú de navegación, o el footer.

Crear el blog

Puedes configurar el blog con una flexibilidad asombrosa:

El contenido del blog, la fecha el autor, la etiqueta leer más, las categorías, tags, comentarios, etc.

También puedes poner el blog en formato Masonry. Elegir el ancho de los post, y en contenido dentro de cada uno de ellos.

La imagen destacada también tiene múltiples opciones de configuración.

Vamos a ver en 1 minuto como hacerlo.

Configurar espacios entre elementos

En la mayoría de temas para editar los espacios entre elementos, tenías que entrar en el código de la hoja de estilos “css”, y modificar el “padding” en los elementos uno por uno. Aquí puedes hacerlo de una manera asombrosamente sencilla.

Editar el Copyright

Puedes editar el Copyright que aparece en el Footer de la página.

Editar copyright

Diseñar la cabecera de la página.

La flexibilidad en el diseño de la cabecera o header es alucinante. Ahí vienen 2 vídeos para que veas la cantidad de posibilidades que tienes.

Trabajar con Menu Plus

Este es otra de las partes del diseño con una flexibilidad brutal. Puedes configurar el menú de tu página Web, tanto para visualizar en dispositivos móviles como para pantallas más grandes con un detalle alucinante.

Entre otras cosas puedes añadir tu logo en el menú, crear elementos desplegables, hacer que tu menú se quede anclado en la parte superior de la página, y muchas cosas más.

Menú de navegación secundario

Puedes añadir un menú de navegación secundario. Habrás visto que algunas páginas tienen 2 barras de navegación diferentes, y así tienen la posibilidad de separar los apartados de la web en 2 menús. Por ejemplo podrías poner en un menú los servicios de tu empresa, y en el otro menú el resto de las cosas como inicio, quienes somos, contacto, etc.

Imágenes de fondo o Backgrounds

Puedes subir imágenes de fondo o backgrounds en prácticamente todas las áreas de la página, y asignarles características como el ancho, la posición, o si quieres repetir la imagen.

Puedes añadir imágenes a las siguientes áreas:

  • Body o cuerpo de la página
  • Header o cabecera
  • Barra de navegación
  • Barra de navegación secundaria
  • Contenido de la página
  • Sidebar o barra lateral
  • Footer o pié de página.

Importar y exportar configuraciones

Si te gusta como te ha quedado la configuración de tu página Web, puedes exportarla e importarla en una nueva página Web. Para un desarrollador que tiene pensado utilizar esta plantilla en varias páginas puede ser una herramienta muy valiosa.

Si no, también te puede servir, ya que lo puedes utilizar como punto de restauración. Te gusta como tienes la página pero quieres probar cosas nuevas? expórtala, trastea todo lo que quieras con la página, y si no te gusta lo que estás haciendo, recupera la versión anterior.

Generar Hooks

Esta opción es para usuarios avanzados, y si la utilizas bien también es una herramienta muy valiosa. No hay nada que no puedas hacer tocando los archivos de código fuente del tema, pero con este addon te ahorras tener que entrar en esos archivos.

Los Hooks te permiten insertar codigo HTML, CSS, JavaScript o PHP en ciertas áreas del tema.

Si insertas PHP no te puedes olvidar de marcar la casilla “excute PHP”. Y si quieres desactivar el contenido del hook, solo tienes que marcar la casilla “Disable Hook”

hooks-1024x3674


Resumen

GeneratePress es un tema muy flexible y fácil de utilizar.

Las grandes características de este tema son:

  • Su código limpio
  • Que es 100% responsive.
  • Compatibilidad con plugins y navegadores
  • Es ligero y rápido

GeneratePress es un tema gratuito, sin embargo, recomiendo sin dudarlo adquirir el paquete de addons que cuesta 39,95$. No olvides que con eso tienes soporte ilimitado, actualizaciones ilimitadas, y instalaciones ilimitadas.

Os parece GeneratePress un tema tan genial como a mi? 

Web Hosting

8 comentarios en “GeneratePress. Tutorial completo de un tema 5 estrellas.

  1. Buenas Xim,

    Muy buen tutorial te felicito.

    Yo compre el theme y me encuentro en que no se me adapta al móvil al 100 por 100 sobre todo las imágenes de cabecera se ven bien si pongo el móvil en horizontal pero en vertical quedan totalmente cortadas. sabes que estoy haciendo mal?
    Muchísimas gracias!

    • Muchas gracias Dalmau! 🙂

      El problema en la adaptación es que la imagen es muy grande, pero eso se debería arreglar poniendo un “max-width=100%”

      También hay un párrafo

      que no se adapta, y eso es porque le has asignado un ancho fijo en pixeles.

      Un saludo!

Deja un comentario

 

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.

ACEPTAR
Aviso de cookies