Web Hosting
blocksy tema wordpress rapido liviano

Blocksy: plantilla liviana para Gutenberg

Tras un lanzamiento que a la mayoría se le pasó bajo el radar, Blocksy se transformó rápidamente en el ‘tema en boca de todos’. Su velocidad comprobada y el estratégico uso del Editor Gutenberg captaron la atención de la comunidad. Repleto de opciones de personalización y aunado a Blocksy «companion», este Tema gratuito merecía toda nuestra atención. Hoy, aquí les presentamos el fruto de nuestro análisis.

Nota: el presente artículo incluye asimismo una guía de Blocksy y de la instalación (opcional) de su Tema Hijo.

Blocksy y Gutenberg

Por si su nombre no fuese suficiente indicio, ‘Blocksy’ está basado en la construcción de contenido por bloques. Claro, es 100% compatible con Gutenberg, y de hecho trabaja en conjunto con él.

«Apilar» contenido es un modo intuitivo que, particularmente, resulta rápido de dominar para el público en general (léase, administradores no programadores e iniciados en WordPress). Cada bloque posee su propia configuración, lo que permite personalizar cada detalle del diseño como a uno le parezca.

Reorganizar bloques en tiempo real y la opción de Vista Previa en Vivo son bondades que permiten supervisar el progreso mientras trabajamos en el diseño visual.

Además, Blocky añade un montón de funcionalidades poderosas, incluyendo la gran ventaja de estar preparado para montar una tienda virtual.

Blocksy en su versión Premium viene incluido en nuestro plan de hosting WordPress Administrado.

Blocksy: plantilla liviana para Gutenberg 1

Aspectos Principales

En su página oficial de presentación y descarga (ojo: puede descargarse desde WordPress mismo; lo vemos más adelante), Blocksy se presenta con 6 puntos fuertes característicos.

Las funcionalidades principales son:

Blocksy: plantilla liviana para Gutenberg 2

Rápido
de Verdad

No solamente se nota que es rápido, sino que los tests de velocidad usuales (PageSpeed, GTmetrix, etc.) le otorgan puntajes realmente envidiables.

Blocksy: plantilla liviana para Gutenberg 3

Preparado para
Gutenberg

Su código se escribió pensado para trabajar en conjunto con el Editor de Bloques Natal de WordPress: Gutenberg. Esto lo hace más liviano aún.

Blocksy: plantilla liviana para Gutenberg 4

División
de Código

Todos los comportamientos basados en JavaScript se cargan sólo cuando se necesitan. Se emplea el soporte de webpack de importación dinámica.

Blocksy: plantilla liviana para Gutenberg 5

Preparado para eCommerce

Permite construir con rapidez y facilidad una tienda online profesional. Es posible cargar productos y servicios y comenzar a vender enseguida.

Blocksy: plantilla liviana para Gutenberg 6

Preparado para
multi-idiomas

Blocksy se codificó de tal manera que absolutamente todos los textos, mensajes y botones pueden cambiarse a cualquier idioma.

Blocksy: plantilla liviana para Gutenberg 7

Código ágil
y limpio

Cada línea de código fue escrita conscienzudamente buscando sencillez y agilidad. Además, la programación está preparada para añadir funciones y escalar.

Blocksy: plantilla liviana para Gutenberg 8

Previsualización
en vivo

Los cambios del personalizador del tema se sincronizan en tiempo real dentro de la ventana de previsualización, lo que acelera el flujo de trabajo.

Blocksy: plantilla liviana para Gutenberg 9

Diseño
AutoAdaptable

Programado para responder a las diferentes medidas de pantalla de celulares y tabletas, ajustando su diseño y los tamaños de manera automática.

Además, Blocksy permite que el contenido creado sea compartido al instante en las redes sociales. Para ello uno puede añadir los botones de las redes sociales donde lo desee (incluso en el encabezado). Esto propicia la interacción de los usuarios y un mayor tráfico proveniente del contenido compartido.

Blocksy permite arrastrar y soltar los botones sociales que necesites y redirigir nuestros perfiles de redes sociales en pos de una mejor viralización.

Personalización del Tema

menu de atajos de tema Blocksy
Atajos de Blocksy

Consideramos que pocos Temas tienen tantas características de personalización como Blocksy. Realmente el detalle puesto en las posibilidades y una interfaz clara y limpia permite realizar cambios y darle nuestro toque personal a nuestro sitio con facilidad y sencillez.

Entre las configuraciones posibles puede ser establecido el aspecto de botones, formularios, migas de pan, alternativas de diseño para Páginas y Entradas y Tienda de WooCommerce. Incluso, existen opciones de Rendimiento relacionadas a carga diferida de imágenes y creación dinámica de CSS (nota: Duplika te brinda aún más opciones a través de Blocksy Companion, incluido en el plan WordPress Administrado).

Blocksy te permite, asimismo, decidir diferentes aspectos de tu diseño para PC de Escritorio, Tableta y Celulares.

Blocksy: plantilla liviana para Gutenberg 10
Blocksy: plantilla liviana para Gutenberg 11
Blocksy: plantilla liviana para Gutenberg 12

Constructor de Encabezados

Con Blocksy es posible arrastrar y soltar hasta nueve elementos en el encabezado.

El Tema nos permite añadir botones al encabezado, configurar secciones como Blog, Galería, Contacto, Acerca de e incluso insertar un campo de búsqueda. Estos elementos pueden ser ordenados a nuestro antojo o necesidad particular.

Blocksy: plantilla liviana para Gutenberg 13

Fondos y Colores

La paleta de colores es un aspecto distintivo, vital en todo diseño gráfico, y la web no es la excepción.

Por eso, Blocksy nos permite toda la libertad del mundo a la hora de personalizar nuestro sitio web.  Esto incluye la facilidad de poder configurar tres paletas o esquemas para facilitar la edición.

Blocksy: plantilla liviana para Gutenberg 14

Tipografía

Algunos Temas ofrecen pocas variantes cuando de tipos de letras y tamaños refiere. No es el caso de Blocksy.

Blocksy nos brinda absoluto control de formato, color y tamaños de tipografías. De hecho, podemos elegir entre las 900 fuentes de Google Fonts. Mejor que tengamos una idea de la fuente que deseamos porque si no recorrer semejante catálogo buscando LA fuente nos va a llevar bastante tiempo.

Blocksy: plantilla liviana para Gutenberg 15
Blocksy: plantilla liviana para Gutenberg 16

Constructor de Pie de Página

La misma reseña que hicimos para el constructor de encabezados le cabe al de los pies de página*. El constructor nos permite personalizar 100% esta sección arrastrando y soltando elementos.

Podemos personalizar nuestro pie de página en la pestaña de elementos introduciendo información de contacto, acceso a las redes sociales, y sumando hasta 4 áreas de widgets. En la vista de la Pestaña General es posible agregar un efecto de revelación de sitio.

* Sólo con Blocksy Companion, incluido en nuestro plan de WordPress Administrado.

Blocksy: plantilla liviana para Gutenberg 17

WooCommerce

El primer gran acierto del Tema Blocksy es su integración con el constructor de páginas Gutenberg. El segundo gran acierto es su perfecta fusión con el mejor plugin para tiendas comerciales online: WooCommerce.

Nota: esto lo hace a través de su plugin Blocksy Companion. Más sobre esto más adelante.

Blocksy: plantilla liviana para Gutenberg 18

Blocksy incluye características adicionales para este poderoso eCommerce, como la vista fácil del producto, añadir al carrito en donde quieras, y los diferentes tipos de galerías prediseñadas para presentar los productos. A continuación podemos ver unas capturas de algunas de las posibilidades de personalización incluidas.

Blocksy: plantilla liviana para Gutenberg 19
Blocksy: plantilla liviana para Gutenberg 20
Blocksy: plantilla liviana para Gutenberg 21

Compatibilidad con Elementor, Beaver, etc

Hoy no se puede lanzar un Tema de WordPress que funcione mal, o no funcione, con los constructores de sitios más populares. Sobre todo, teniendo en cuenta que quizás Blocksy acaba siendo el nuevo Tema de un sitio ‘viejo’, hecho con un constructor diferente a Gutenberg.

Por eso, Blocksy abraza a todos los siguientes constructores y les dice ‘bienvenidos’.

Blocksy: plantilla liviana para Gutenberg 22
Beaver
Blocksy: plantilla liviana para Gutenberg 23
Elementor
Blocksy: plantilla liviana para Gutenberg 24
Brizy

Blocksy: plantilla liviana para Gutenberg 25
Gutenberg

Blocksy Tema CHILD

Otra de las características obligadas en un tema moderno profesional es la inclusión del ‘Tema hijo’ o Child. Por supuesto, Blocky nos brinda la posibilidad, a través de su Tema Hijo, de producir cambios en el código del Tema sin que esto afecte los archivos originales del Tema ni que nuestros cambios se pisen con futuras actualizaciones. De hecho, para eso existe un Tema hijo.

Blocksy: plantilla liviana para Gutenberg 26

Para los nuevos en este asunto de los Temas Hijo, sepan que se trata de un Tema basado en (y dependiente de) su Tema ‘Padre’, es decir el Tema original en sí. Un Tema hijo es sólo un conjunto de archivos básicos que permiten a un admin de WordPress realizar modificaciones seguras de un Tema sin pisarlo. Sin embargo, para lograr esto, el Tema Hijo debe ser seleccionado como Tema en lugar del Padre. En este caso, elegiríamos como Tema de nuestro WordPress a Blocksy Child.

Al final de la nota veremos información adicional sobre cómo instalar Blocksy y dejar andando su child.

Blocksy Companion

En las palabras mismas de sus desarrolladores, «Blocksy Companion es el plugin que convierte al Tema Blocksy en una poderosa navaja suiza». En otras palabras, es el plugin que le añade a Blocksy una generosa cantidad de funcionalidades adicionales.

El plugin Companion tiene una versión gratuita y brinda acceso a plantillas de demostración, extensiones y un montón de cosas útiles a la hora de comenzar un sitio en el menor tiempo posible y con todas las funcionalidades servidas.

En el link provisto se explica (en inglés) cómo instalarlo.

Si han llegado hasta aquí en la lectura confiamos en que la nota es de su agrado, lo que nos enorgullece de verdad. Aprovechamos para recordar a los lectores que Duplika ofrece la versión PREMIUM de Blocksy Companion junto con Blocksy PRO en su plan de Hosting WordPress Administrado.

Blocksy Companion provee:

  • Aviso de Consentimiento de Cookies.
  • Integración de galerías de Instagram.
  • Formulario de suscripción a boletines informativos con integración con Mailchimp.
  • Integración con WooCommerce.
  • Widgets adicionales

Tests de Velocidad

Adelantamos que era rápido. Lo es. Nuestras pruebas son sólo otra de las tantas que certifican que su código limpio y el uso de tecnologías web modernas (como React, Webpack y Babel) vuelven a Blocksy un cohete ultrasónico. De hecho, activar el Tema ya aligera el Escritorio de WordPress. Cualquiera lo puede notar.

Blocksy: plantilla liviana para Gutenberg 27

Instalando Blocksy

Instalar Blocksy en su versión gratuita es igual que instalar cualquier otro Tema. Repaso:

Nos dirigimos a Apariencia → Temas y hacemos clic sobre el botón «Añadir nuevo».

Blocksy: plantilla liviana para Gutenberg 28

Pasando el cursor del mouse sobre el resultado, daremos clic a Instalar, y luego, tras unos segundos de descarga, en Activar. Listo.

Recordemos que, como todo Tema, podemos realizar su personalización en Apariencia → Personalizar.

Blocksy: plantilla liviana para Gutenberg 29

Instalando Blocksy Child (Tema Hijo)

Si pretenden modificar los archivos principales del Tema Blocksy, la sugerencia universal para éste (o cualquier otro Tema) es siempre instalar y activar el Tema Child. Tras este paso, no debemos preocuparnos por arruinar el tema principal. Cualquier cambio «hardcore» que realicemos sólo afectará al Tema Hijo.

El Tema Blocksy Child se descarga de aquí.

Los pasos para instalarlo correctamente:

  1. Nos dirigimos a Apariencia → Temas en nuestro Escritorio de WordPress.
  2. Haremos clic en el botón Añadir nuevo y, a continuación, presionaremos sobre Subir Tema para cargar el archivo .zip del tema child ya descargado, blocksy-child.zip.
  3. Tras la carga del archivo, debemos hacer clic en Instalar ahora y luego sobre Activar el tema.
Blocksy: plantilla liviana para Gutenberg 30

Tras este último paso, ya podemos realizar modificaciones del Tema a gusto y a salvo. Para más información, recomendamos ver la documentación oficial sobre Blocksy Child.

Blocksy PRO

El equipo de Creative Themes no se ha quedado quieto tras el éxito de Blocksy. Recientemente, han lanzado la versión premium de su tema Blocksy, llamada Blocksy Pro.

Como suele ocurrir con las versiones Premium/Pro de Temas y Plugins, Blocksy Pro incluye muchas características avanzadas que apuntan a cubrir contextos menos comunes, o más exigentes. Entre sus funcionalidades PRO encontramos:

  • Múltiples encabezados condicionales, diferentes barras laterales y alternativas de pies de página.
  • Ganchos de bloque de contenido (hooks).
  • Posibilidad de añadir fuentes personalizadas y usar fuentes de Google localmente.
  • Mega menú con características avanzadas.
  • Cajón de escritorio fuera del lienzo (off-canvas).
  • Carrito de compras flotante.
  • Filtros fuera del lienzo (se deslizan en pantalla con una activación, y pueden ser ocultados de nuevo).
  • Carrito fuera del lienzo (ídem explicación anterior).
  • Proyector de diapositivas (slider de imágenes/galería animada).
  • Lista de productos deseados (wishlist).

Los planes de Blocksy Pro comienzan a partir de U$D49 para un sitio único, U$D69 por 5 sitios y U$D99 para sitios ilimitados.

Téngase en cuenta que estos montos son anuales y deben ser renovados para poder continuar empleando Blocksy PRO en nuestro sitio.

Blocksy Pro y Blocksy Companion se encuentran incluidos gratuitamente en nuestro Plan de Hosting con WordPress Administrado.

Conclusiones

En la carrera web, la velocidad no solamente es una búsqueda imperiosa, sino un constante encuentro superador con tecnologías cada vez más eficientes, completas y útiles a la hora de ahorrarnos trabajo.

Blocksy, Blocky Companion y Blocksy Pro aúnan una de las mejores alternativas actuales para mejorar nuestro flujo de trabajo e imprimir inmediatez a nuestro contenido. No son meras palabras: Blocksy brilla por la prolijidad de su código, su hermandad con las herramientas natales de WordPress y una velocidad que se siente ni bien activamos el Tema.

Blocksy es un tema que puede ser empleado para diversos escenarios incluyendo Portfolios/Showrooms, sitios corporativos, tiendas online y blogs de cualquier índole.

Y Blocksy está construido para quedarse con nosotros, estando a la altura de cualquier Tema profesional empleado hoy día (como Astra).

Esperamos que el análisis les haya gustado. Si les surgen dudas, por favor no duden en escribirla en los comentarios. Compartan sus experiencias. Leemos y contestamos todos los mensajes.

Éxitos, y gracias por leer.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *