Gutenberg Hub lanzó su colección de plantillas de bloques ayer. El proyecto, que comenzó con 100 plantillas gratis, tiene como objetivo ayudar a los usuarios a crear diseños complejos simplemente copiando y pegando el código de bloque en el editor.

Munir Kamal, el fundador de CakeWP, creó Gutenberg Hub en 2017 después de enterarse del anuncio inicial del proyecto Gutenberg. "Me emocionó desde los primeros días, y eso me empujó a crear un blog donde pueda compartir cosas relacionadas con Gutenberg", dijo. “Todo comenzó con la selección de las últimas actualizaciones del proyecto Gutenberg y en lo que otros están trabajando en relación con Gutenberg. Más tarde, comencé a escribir algunos tutoriales en el blog para ayudar a los usuarios principiantes a comenzar a usar Gutenberg ".

Luego construyó un directorio de bloques antes de seguirlo con el directorio de plantillas. "El objetivo es hacer de Gutenberg Hub un excelente recurso para los usuarios de Gutenberg", dijo. También tiene otros objetivos importantes con el sitio, incluido un posible directorio de temas junto con los tutoriales, plantillas y bloques existentes.

Actualmente, Kamal tiene un equipo de cinco personas que trabajan en sus diversos proyectos CakeWP. Parte del equipo contribuyó a la biblioteca de plantillas. Un miembro creó el sistema de biblioteca de plantillas sobre Gatsby, un marco basado en React que puede extraer datos de un CMS como WordPress.

La idea de la biblioteca de plantillas le llegó a Kamal mientras intentaba replicar páginas de inicio de los creadores de páginas de WordPress en Gutenberg. "Pude recrear constructores de páginas populares en Gutenberg sin ningún complemento adicional", dijo. "Pero eso me llevó mucho esfuerzo, y me di cuenta de que se podía lograr mucho con el núcleo de Gutenberg". Comenzó a pensar en términos de cómo las plantillas de sección podrían ayudarlo a construir páginas más rápidamente. "Entonces, comencé a crear secciones y, finalmente, eso se convirtió en una idea de biblioteca de plantillas".

Con la ayuda de un miembro del equipo, los dos eliminaron 100 plantillas personalizadas en un mes. "Honestamente, tomó mucho tiempo", dijo Kamal. “Seguramente agregaré más plantillas yo mismo. Pero, lo que deseo que suceda es que otros diseñadores, desarrolladores y usuarios contribuyan y agreguen plantillas a esta biblioteca ".

Kamal actualmente está construyendo un sistema para que otros puedan agregar sus plantillas personalizadas. En última instancia, quiere que el proyecto sea dirigido principalmente por la comunidad. La idea es similar en alcance al Sitio de la comunidad ShareABlock pero con un enfoque en plantillas.

Con el enfoque del proyecto Gutenberg en patrones de bloque Este año, será interesante ver cómo proyectos como este encajarán en ese paradigma. Como mínimo, la biblioteca de plantillas proporcionará ideas útiles para el equipo de Gutenberg, proporcionando una especie de hoja de ruta de patrones que vale la pena adoptar en el núcleo de WordPress.

"Técnicamente, lo que estoy haciendo con esta biblioteca es algo similar a patrones de bloque", Dijo Kamal. "Estoy ansioso por ver cómo funciona el sistema de patrones de bloques y haré todo lo posible para que esta biblioteca funcione con eso".

Una colección de plantillas

Screenshot of using the Probar el Plantilla Hero 3 de la biblioteca Gutenberg Hub.

Las plantillas en la biblioteca son esencialmente secciones de una página. Los usuarios pueden importar múltiples secciones para crear una gama de diseños complejos.

A diferencia de otras bibliotecas donde los usuarios pueden necesitar importar un archivo JSON, las plantillas de Gutenberg Hub se copian y pegan completamente. El sitio proporciona un simple botón "Copiar código". Una vez que se hace clic, el código de bloque se copia en el portapapeles, que se puede pegar directamente en el editor de bloques.

Algunos de los bloques tienen CSS personalizados para manejar ciertos aspectos de diseño, que también es copiar y pegar. Kamal recomienda el Bloquea el complemento CSS por ThemeIsle, que permite a los usuarios agregar CSS directamente al editor de bloques. La otra opción es que los usuarios agreguen el código CSS a través del personalizador de WordPress. En mi experiencia con algunas de las plantillas, el CSS adicional era innecesario para lograr algunos diseños agradables.

Con 100 plantillas y contando, Kamal dividió la colección en 12 categorías:

  • Héroe
  • Testimonial
  • Equipo
  • Estadísticas
  • Precios
  • Logos
  • Galería
  • Caracteristicas
  • Preguntas más frecuentes
  • Contenido
  • Contacto
  • Tarjeta

Hay algo para todos los gustos. La biblioteca cubre muchos de los patrones más populares que se encuentran actualmente en la web. Me estoy divirtiendo probando las diferentes plantillas. Algunos funcionan mejor dentro de mi tema que otros. En general, Gutenberg Hub ha creado un proyecto sólido.

Las plantillas de formulario de contacto requieren el uso de Complemento de formularios de Gutenberg, que es desarrollado y mantenido por Kamal. Este requisito se debe a que WordPress no tiene un sistema de formulario incorporado, por lo que era necesario un complemento externo. Ninguna de las otras plantillas requiere un complemento en este momento.

Kamal no tiene una plantilla favorita de la colección. Hizo hincapié en que no era diseñador. "He hecho todo lo posible para crear plantillas que sean buenas y útiles en múltiples casos de uso", dijo. "Espero que a otros también les gusten las plantillas, y puede ser un buen punto de partida para crear un diseño hermoso en Gutenberg".

Me gusta esto:

Me gusta cargar ...



Enlace fuente