Integración de ShopEngine con Gutenberg para la tienda WooCommerce

¡Finalmente se acabó la espera! ShopEngine ahora es compatible con su editor de bloques Gutenberg . Anteriormente, podía acceder a los widgets de ShopEngine solo a través de la ventana de Elementor, ¿verdad?

Pero ahora ShopEngine está disponible más allá de eso. Además de acceder a los widgets de ShopEngine a través de Elementor, puede utilizar ShopEngine en Gutenberg para la tienda WooCommerce . Sin embargo, en Gutenberg, estos widgets se mostrarán como bloques.

De hecho, las funciones de los widgets de Elementor y los bloques de Gutenberg son idénticas. Entonces, ¿dónde está la diferencia? La diferencia radica en la aplicación. Para los widgets de Elementor, tenía que arrastrar y soltar widgets en las áreas designadas para ver el resultado. Pero para los bloques de Gutenberg, solo tiene que hacer clic en los bloques y su trabajo está hecho.

Una visión general de Gutenberg:

Como usuario de WordPress, debes estar familiarizado con el término Gutenberg . Es un editor de contenido de WordPress, también conocido como editor de bloques de WordPress. Hoy en día, Gutenberg es el editor de WordPress más popular entre los usuarios de WordPress debido a su facilidad de uso. Muchos complementos de WordPress Gutenberg también están disponibles a través de desarrolladores externos.

Anteriormente, la gente estaba más acostumbrada a usar “Classic Editor”, otro editor de WordPress. Desde la llegada de Gutenberg, la gente ha estado adoptando más el editor de bloques en comparación con el Editor clásico. La especialidad de Gutenberg es su contenido basado en bloques .

No importa si se trata de un párrafo, una imagen o un botón, cada uno de estos elementos es un bloque. A diferencia de Classic Editor, este editor de contenido basado en bloques le permite manipular su contenido con más control. La mejor parte de este editor de bloques es que permite a los desarrolladores de terceros incrustar bloques personalizados.

Y esto es exactamente en lo que nos centraremos en este blog informativo, ya que a partir de ahora, un montón de características de ShopEngine estarán a su disposición en Gutenberg para WooCommerce. Antes de extendernos sobre los bloques personalizados de ShopEngine en Gutenberg, permítanme aclarar por qué integramos ShopEngine con Gutenberg para WooCommerce .

Por qué integrar ShopEngine con Gutenberg:

ShopEngine se diseñó inicialmente exclusivamente para Elementor. Eso significa que puede crear sus páginas de WooCommerce solo para Elementor. Pero ahora, como mencioné anteriormente, ShopEngine ha dado un paso adelante después de integrarse con Gutenberg.

Entonces, ¿qué nos hizo integrar ShopEngine con Gutenberg para WooCommerce ? Para responder a esta pregunta, permítanme presentarles algunos datos:

Según gutenstats.blog, Gutenberg ha recibido 76 millones de instalaciones activas hasta ahora. Además de eso, 264,5 millones de publicaciones escritas con Gutenberg hasta la fecha.

Creo que estos datos son suficientes para convencer a cualquiera de por qué hemos ampliado la gama de ShopEngine a Gutenberg. Millones de personas están implementando Gutenberg para desarrollar su contenido y no queremos que se pierdan las funciones fascinantes que ofrece ShopEngine.

Algunas razones más de la integración de ShopEngine con Gutenberg:

Permítanme enfatizar un punto : Gutenberg no es solo un editor de contenido . El proyecto Gutenberg tiene como objetivo convertir el editor de bloques en una herramienta de edición de sitio completo en un futuro próximo.

La idea es permitirle diseñar el 100% de su sitio WooCommerce con el editor Gutenberg. Si esto sucede, es probable que la demanda de Gutenberg se dispare. Entonces, vale la pena integrar ShopEngine con Gutenberg para WooCommerce, ¿verdad?

• Con Gutenberg, no tiene que usar códigos cortos para incrustar contenido. En su lugar, puede implementar los bloques para agregar los elementos de página necesarios.
• Gutenberg no tiene problemas de compatibilidad, por lo que los desarrolladores pueden incorporar fácilmente la compatibilidad con Gutenberg en sus complementos.
• Gutenberg genera un código liviano y también es una herramienta de carga rápida.

Algunos de los bloques notables de ShopEngine en Gutenberg:

Antes de arrojar luz sobre los bloques de ShopEngine, permítanme aclarar que ShopEngine viene con más de 65 widgets , más de 13 módulos y una gran cantidad de plantillas para las páginas de la tienda de WooCommerce dirigidas a los usuarios de Elementor. Después de la integración de ShopEngine con Gutenberg para WooCommerce, ahora puede obtener acceso a más de 45 bloques de ShopEngine en Gutenberg .

Según el tipo de página que seleccione para crear una plantilla para su tienda WooCommerce, los bloques de Gutenberg se mostrarán en consecuencia. Además, obtendrá acceso a módulos como Vista rápida, Muestras de variación, Comparación de productos y Lista de deseos .

Echemos un vistazo a algunos de los bloques de ShopEngine en Gutenberg para la tienda WooCommerce:

Titulo del producto:

El bloque de título del producto aparece en una sola página para un producto específico. Después de seleccionar el tipo de página única para crear su plantilla, solo tiene que hacer clic en el bloque Título del producto en la barra lateral.

Inmediatamente después, el título de su producto aparecerá en la página. Desde la barra lateral derecha, puede modificar la etiqueta del título, la alineación, el color y la tipografía.

Lista de productos:

La lista de productos muestra todos los tipos de productos que vende en su tienda WooCommerce. El bloque de la lista de productos aparece en todos los tipos de páginas, incluidas las páginas individuales, de tienda, de pago y de carrito. Una vez que seleccione el tipo de página, haga clic en la lista de productos de la ventana emergente o la barra lateral.

Asegúrese de seleccionar la categoría de producto para que aparezcan los productos. Desde la barra lateral derecha, puede seleccionar y personalizar diferentes elementos de la lista de productos. Puede seleccionar la cantidad de productos por página, etiquetas, mostrar/ocultar insignia de ventas, porcentaje de descuento, etc.

Descripción del producto:

Si crea una plantilla de una sola página, el bloque de descripción del producto aparecerá en la barra lateral. Para que la descripción del producto aparezca en su página, haga clic en el bloque de descripción del producto. Puedes personalizar la descripción y también estilizarla modificando tipografía, color, alineación, etc.

Pago de pago:

Al igual que el widget de Checkout Payment en Elementor, el bloque Checkout Payment funciona en Gutenberg. Puede ver el bloque "Pago de pago" si accede a la plantilla de creación para su página de pago. Después de eso, puede agregar el bloque de pago de pago según lo necesite para su tienda WooCommerce.

Tendrá las opciones para modificar el estilo del contenido, los métodos de pago, el botón, etc. Puede modificar la posición de la casilla de verificación, el color del botón, la tipografía, el borde, etc.

Archivo de productos:

La página de productos archivados contiene todos los productos publicados en un solo lugar. Para crear una plantilla para la página de archivo en Gutenberg para WooCommerce, solo vaya a la barra lateral izquierda y haga clic en el bloque Archivar productos . Todos los productos del inventario aparecerán uno tras otro.

La página de productos del archivo cuenta con una gran cantidad de segmentos que incluyen diseño, contenido, paginación, calificación, etc. La página contiene una gran cantidad de elementos como el título del producto, la imagen del producto, el precio del producto, la descripción del producto, el pie de página del producto, etc.

Mesa de carro:

En la tabla del carrito, aparecen todos los detalles de los productos seleccionados, incluido el nombre de los productos, el precio, la cantidad, el subtotal y el monto total. Con el bloque Cart Table de ShopEngine, puede mostrar a sus compradores toda la información relevante para sus productos a través de una tabla de carrito en la página de carrito de WooCommerce.

Para personalizar el contenido y estilizar diferentes elementos de la tabla del carrito, obtendrá parámetros en la barra lateral derecha. Puede modificar los colores del encabezado y pie de página del producto, el color del borde, el color del texto, así como personalizar las secciones de contenido, incluido el título, el precio, la cantidad, el total, etc.

Productos vistos recientemente:

Con el bloque Productos vistos recientemente de ShopEngine, puede mostrar los productos que sus usuarios han buscado o visto recientemente en su tienda WooCommerce. Puede mostrar los productos vistos recientemente en la página de la tienda, la página del producto, la página del carrito, etc.

Al igual que los otros bloques, puede observar los parámetros relacionados con los productos vistos recientemente en la barra lateral derecha. Aprovechando los parámetros, puede especificar la cantidad de productos para mostrar, mostrar/ocultar insignias de ventas, establecer el espacio entre columnas y filas, ajustar las alturas de las imágenes de productos, etc.

Liquidando:

Entonces, ¿cuál es su opinión sobre nuestro movimiento para integrar ShopEngine con Gutenberg para WooCommerce ? Háganos saber acerca de su experiencia en la implementación de bloques de ShopEngine en Gutenberg para la tienda WooCommerce.

Le invitamos a dar cualquier comentario positivo o negativo sobre la integración de Gutenberg para WooCommerce. También agradeceríamos recibir sus sugerencias para agilizar nuestro proceso de integración. Sin embargo, nuestro trabajo sobre la integración de ShopEngine con Gutenberg aún está en progreso. En breve, habremos terminado con el proyecto.