Cómo convertir Gutenberg en un generador de sitios web (para usuarios finales y sin código) – 1ª parte

En este post se revisa con vídeotutoriales la primera parte del método para convertir Gutenberg en un generador de sitios web.

Es muy fácil convertir Gutenberg en un generador de sitios web.

El editor de bloques (Gutenberg) facilita la creación de sitios web personalizados de tal manera que, sin conocimientos técnicos de desarrollo web y sin necesidad de saber lo que hay detrás de WordPress, cualquier usuario final puede hacerlo. WordPress es así una fabulosa herramienta sin código.

Para ello, solo necesitas saber el funcionamiento del Administrador de WordPress y, por supuesto, aprender a diseñar con bloques. Al final de este post, tienes enlaces a los recursos precisos para adquirir ese conocimiento básico.

Una vez que conozcas cómo funciona el editor de bloques de WordPress, crear sitios web sin delegar el trabajo en terceros es coser y cantar.

A continuación, va la primera parte del método para convertir Gutenberg en un generador de sitios web.

1. Edición de la página de inicio

Lo primero que debe dejarte hacer el tema que tengas activo es editar la página home. Un tema orientado a bloques debería pero tienes que verificarlo.

Una vez que tengas acceso a la página home en blanco, solo es cuestión de “rellenarla” con bloques de Gutenberg. Esto es válido también para el resto de páginas (about, contacto, etc.) Y, por supuesto, para las entradas del blog.

Blogpocket Sustie es nuestro tema orientado a bloques. Presenta algunas limitaciones pero es plenamente funcional para crear un sitio web solo con bloques del editor.

Blocksy es un tema, también orientado a bloques, mucho más completo que Sustie y muy recomendable para convertir Gutenberg en un generador de sitios web. Por ejemplo, con Blocksy podrás editar la cabecera y el footer, algo que no puedes hacer en Sustie.

2. Restricción de ancho completo impuesta por el tema

El principal problema para diseñar un sitio web con bloques de Gutenberg es las restricciones que impone el tema que tengas activo. Una restricción importante es el ancho de la columna de contenidos, normalmente debida a lo que se conoce como la “plantilla predeterminada”.

En Blogpocket Sustie, la plantilla predeterminada no afecta a la página home, ya que ésta se programó para admitir siempre el ancho completo en los diseños. Si creas una página nueva (about, contacto, etc.) que no sea la página de inicio, el diseño con bloques se ajustará al ancho de la plantilla predeterminada. Esto provoca que no se pueda abarcar, probablemente, todo el ancho de la página.

Pero si el tema es Blocksy, el comportamiento es diferente, presentando los bloques y grupos de bloques la opción de “ancho completo” o “ancho amplio” en la botonadura de configuración (que se muestra en la parte superior de cada bloque). Puedes, por lo tanto, romper la restricción del ancho obligado por el tema, sin más que usar ese botón de configuración.

En cualquier caso, el plugin Fullwidth Page Templates resuelve de un plumazo este problema.

3. Plugin «Fullwidth Page Templates» para resolver las restricciones de ancho completo

El plugin Fullwidth Page Templates es la solución ideal para resolver las restricciones de ancho de contenidos impuestas por el tema que tengas activo.

Con él se añaden nuevas plantillas a las plantillas por defecto en el tema, para elegir dentro del apartado de “Atributos de página (o de entrada)”, en la pestaña “Página” (o Entrada) de la rueda dentada de configuración.

Estas opciones son:

  • FW No Sidebar. Quita la columna lateral si estuviese habilitada.
  • FW Fullwidth. Hace que el contenido abarque todo el ancho de la página.
  • FW Fullwidth No Header Footer. El contenido abarca todo el ancho de la página pero quitando la cabecera y el footer.

4. Cómo crear una landing page usando el plugin «Fullwidth Page Templates»

Uno los resultados inmediatos que se obtienen aplicando este método es la construcción de sitios web de una sola página (o landing pages), muy fácilmente, simplemente con los siguientes pasos:

  1. Crea una página nueva.
  2. Elige “FW Fullwidth No Header Footer” en atríbutos de página.
  3. Diseña la landing con bloques del editor. Si eres principiante, empieza con los patrones de bloques de Sustie, modificando textos e imágenes.

En la segunda parte veremos los siguientes pasos del método para convertir Gutenberg en un generador de sitios web.

Recursos

Como se ha visto con esta primera parte del método para convertir Gutenberg en un generador de sitios web, todo se reduce a aprender el funcionamiento del editor de bloques.

Para ello, hay mucha información en Blogpocket.

Pero si quieres iniciarte, empieza con lo siguiente:

Suscríbete a la newsletter

Todos los lunes por la mañana, enviamos a los suscriptores un boletín especial con las últimas noticias e ideas sobre WordPress y el editor de bloques.

Suscríbete ahora y accede a contenido exclusivo (ebooks, cursos, trainings, etc.)

¿Estás buscando hosting?

Aloja tu web en SiteGround

BIG-SHOES-PODCAST Cómo convertir Gutenberg en un generador de sitios web (para usuarios finales y sin código) - 1ª parte

Deja un comentario

Información básica sobre protección de datos Ver más

  • Responsable Antonio Cambronero.
  • Finalidad  Moderar los comentarios.
  • Legitimación Tu consentimiento.
  • Destinatarios  SiteGround.
  • Derechos Acceder, rectificar y suprimir los datos.
  • Información Adicional Puedes consultar la información detallada en la Política de Privacidad.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ir al contenido