Integración de ProductX Page Builder: Elementor, Divi, Oxygen y Beaver

Publicado: 2023-07-09

ProductX es un complemento completo de WooCommerce que le permite crear cuadrículas de productos impresionantes y distintivas, listas de productos, listas de categorías, controles deslizantes de productos y mucho más con sus increíbles Bloques de productos. Esta solución todo en uno es ideal para tiendas basadas en WooCommerce, ya que le permite diseñar diseños visualmente atractivos para sus páginas de productos de WooCommerce.

Los usuarios de WooCommerce se sienten atraídos por los bloques de productos personalizables de ProductX (Gutenberg WooCommerce Blocks). Muchos usuarios también quieren usar bloques de productos en otras plataformas como Elementor, Divi, Oxygen y Beaver. Sin embargo, esto puede ser difícil debido a la necesidad de códigos y códigos abreviados, que a veces pueden causar problemas de diseño o afectar la funcionalidad de ciertos elementos.

Y es por eso que presentamos la integración de ProductX Page Builder. ¡Usar bloques de productos en Elementor, Divi, Oxygen y Beaver Builder ahora es mucho más fácil!

Quédese con nosotros y le diremos cómo funciona esta increíble integración.

ocultar contenido
1 ¿Por qué debería usar bloques de productos en otros constructores?
2 Cómo usar bloques de productos con la integración de ProductX Page Builder
2.1 Paso 1: Instalar y activar ProductX
2.2 Paso 2: habilite las plantillas guardadas y los complementos de integración
2.3 Paso 3: Crear una plantilla guardada
2.4 Paso 4: Use la plantilla ProductX en Elementor
2.5 Paso 5: Personalización (Opcional)
3 preguntas frecuentes
3.1 ¿Cómo usar bloques de productos en Divi?
3.2 ¿ Qué creadores de páginas son compatibles con ProductX?
3.3 ¿Necesito creadores de páginas para crear tiendas WooCommerce?
4 recursos que te encantarán
5 Conclusión

¿Por qué debería usar bloques de productos en otros constructores?

Si está utilizando Elementor, Divi, Oxygen o Beaver, ya sabe cómo funciona cada plataforma y sus ventajas y desventajas, así que no perdamos el tiempo explorándolas.

Como se mencionó, los bloques de productos son bloques Gutenberg WooCommerce con una capacidad de personalización increíble. Los bloques de productos tienen varias ventajas: son reutilizables, aptos para dispositivos móviles y proporcionan una interfaz limpia con diversos elementos. Estas funciones facilitan la creación de estructuras de contenido bien organizadas.

Y ProductX mejora estas capacidades al máximo. Por ejemplo, no puede crear diseños complejos de forma predeterminada en Gutenberg. Pero con ProductX, puede crear fácilmente diseños complejos para su tienda de la forma que desee.

Y es por eso que debe usar bloques de productos en los creadores de páginas para la creación definitiva de tiendas WooCommerce.

En resumen, la integración de ProductX con otros creadores de páginas crea posibilidades de diseño ilimitadas, mejora la personalización y simplifica la edición para darle a su tienda la mejor perspectiva.

Cómo usar bloques de productos con la integración de ProductX Page Builder

ProductX actualmente tiene integración con los siguientes creadores de páginas:

  • Elementor
  • divide
  • Constructor de oxígeno
  • Constructor de castores

ProductX tiene complementos separados para cada constructor, que puede habilitar y usar bloques de productos para constructores de páginas específicos. Tiene que usar la función Plantilla guardada de ProductX para esto.

Le mostraremos cómo puede usar Bloques de productos en Page Builders. Los pasos son muy similares para cada creador de páginas. Le mostraremos el uso de bloques de productos en Elementor para este artículo.

Vamos a ello sin más preámbulos.

Paso 1: Instalar y activar ProductX

Para comenzar, primero debe instalar y activar el complemento ProductX.

Install ProductX
Instalar ProductoX

Una vez activado, puede habilitar el complemento Plantilla guardada para crear plantillas guardadas y otros complementos del creador de páginas para usar bloques de productos en los Constructores posteriores.

¡Obtenga ProductX ahora!

Paso 2: habilite las plantillas guardadas y los complementos de integración

Después de activar ProductX, puede acceder a todos sus complementos y desbloquear funciones adicionales.

Para usar bloques de productos en Elementor, DIVI, Oxygen o Beaver, debe habilitar el complemento "Plantilla guardada" y el creador de páginas que desea usar para los bloques de productos. Por ejemplo, si desea utilizar bloques de productos en Elementor, debe habilitar el complemento ProductX Elementor. Lo mismo ocurre con Divi, Oxygen y Beaver.

ProductX Integration Addons
Complementos de integración de ProductX

Puede encontrar Todos los complementos en la página Complementos de ProductX. Haga clic en la barra de alternancia junto a Plantilla guardada y otra Integración de Page Builder para habilitar los complementos adyacentes.

Paso 3: crea una plantilla guardada

Antes de usar los bloques de productos en los creadores de páginas, debe crear una plantilla con ProductX.

Vaya a la sección Plantilla guardada de ProductX. Y verá el botón "Agregar nueva plantilla". Haga clic en el botón "Agregar nueva plantilla" para ver el editor de Gutenberg, donde puede crear fácilmente una plantilla.

Creating New Saved Template with ProductX
Creación de una nueva plantilla guardada con ProductX

Puede usar bloques de productos predeterminados de ProductX o importar plantillas prefabricadas/paquetes de inicio de la biblioteca de bloques de ProductX. Usaremos la biblioteca de bloques para facilitarle las cosas. Haga clic en el botón "Bloquear biblioteca" en la parte superior de la página.

Selecting ProductX Block Library
Selección de la biblioteca de bloques ProductX

Verá todos los paquetes de inicio prefabricados hechos por ProductX aquí. Elige el que más te guste y haz clic en "Importar".

Importing Template from ProductX Block Library
Importación de plantillas desde la biblioteca de bloques de ProductX

No olvide darle a la plantilla un "Nombre", ya que este nombre se mostrará dentro del generador de páginas.

Naming Saved Template for ProductX Integration
Plantilla guardada de nomenclatura para la integración de ProductX

Una vez que haya terminado de crear su plantilla, haga clic en "Publicar". Y ya está listo para usar bloques de productos en cualquier creador de páginas.

Publishing Saved Template
Plantilla guardada de publicación

Paso 4: use la plantilla ProductX en Elementor

Ahora, le mostraremos cómo usar la plantilla guardada de ProductX en Elementor.

Desde el Panel de WordPress, ve a Páginas y haz clic en "Agregar nueva página".

Creating New Page
Crear nueva página

Una vez en el editor de páginas, verá un botón de Elementor: "Editar con Elementor" en la parte superior. Haga clic en él y lo redirigirá a Elementor.

Edit With Elementor for ProductX Integration
Editar con Elementor para la integración de ProductX

Una vez dentro de Elementor, puede agregar la “Plantilla ProductX” desde la sección General o usar la barra de búsqueda para encontrarla fácilmente. Arrastre y suelte el elemento "Plantilla ProductX" en su página.

Drag ProductX Template
Arrastre la plantilla ProductX

Después de eso, tendrá la opción de seleccionar la Plantilla. Seleccione la plantilla que creó anteriormente en el menú desplegable Plantilla guardada de Elementors.

Selecting Saved Template for ProductX
Selección de plantilla guardada para ProductX

Ahora todo lo que necesita hacer es publicar o actualizar la página.

Publishing Page With Elementor
Página de publicación con Elementor

Con la ayuda de ProductX, puede usar fácilmente Product Blocks en creadores de páginas como Elementor, Divi, Oxygen y Beaver.

Paso 5: Personalización (Opcional)

Después de usar Bloques de productos en los creadores de páginas, puede personalizarlos fácilmente para cambios o actualizaciones con ProductX.

Editing ProductX Saved Template
Edición de la plantilla guardada de ProductX

Vaya a las plantillas guardadas de ProductX y haga clic en "Editar" en la plantilla guardada que necesita personalizar; le permitirá editar su Plantilla. Realice los cambios necesarios y haga clic en "Actualizar". Los cambios que realice aquí se sincronizarán automáticamente con los creadores de páginas si ha utilizado esta plantilla.

Preguntas más frecuentes

¿Cómo usar bloques de productos en Divi?

Así es como puedes usar cualquier bloque de productos en Divi:

  • Instale y active ProductX.
  • Habilite la plantilla guardada y el complemento de integración DIVI.
  • Cree una plantilla guardada con ProductX.
  • Utilice la plantilla guardada creada en DIVI Builder.
  • Publicar la página.

Y puede usar con éxito bloques de productos en Divi sin ningún problema.

¿Qué creadores de páginas son compatibles con ProductX?

Actualmente, ProductX tiene integración con Elementor, Divi, Oxygen y Beaver Builder. Y puede usar bloques de productos sin esfuerzo en estos creadores de páginas sin ningún problema.

¿Necesito creadores de páginas para crear tiendas WooCommerce?

Bueno, la respuesta es si o no. Puede usar el editor Gutenberg para crear tiendas WooCommerce simples y en su mayoría no personalizables. Pero puede usar ProductX para crear páginas de productos sorprendentes y totalmente personalizables sin usar el nuevo constructor.

Recursos que te encantarán

  • Formas más fáciles de usar bloques de Gutenberg en Divi Builder
  • Cómo usar bloques de Gutenberg en Oxygen Builder
  • Integración de PostX Beaver Builder: use bloques de Gutenberg en Beaver Builder
  • Cómo usar los bloques de Gutenberg en WPBakery Page Builder con la integración de PostX
  • Cómo agregar la búsqueda de productos de WooCommerce: una guía para mejorar la experiencia de compra

Conclusión

En resumen, con la ayuda de la integración del creador de páginas ProductX, el uso de bloques de productos en los creadores de páginas brinda a los propietarios de tiendas WooCommerce infinitas opciones de diseño, funciones personalizables y un rendimiento mejorado.

Explore el poder de los bloques de productos de ProductX en los creadores de páginas ahora y mejore su experiencia al crear una tienda.

Puede consultar los tutoriales en vídeo de WordPress en nuestro canal de YouTube. ¡También, encuéntrenos en Facebook y Twitter para actualizaciones periódicas!

¿Te gusta este artículo? Difundir la palabra
  • How to Display and Customize WooCommerce On Sale Products

    Cómo mostrar y personalizar los productos en oferta de WooCommerce

  • Use Gutenberg Blocks in Divi Builder

    Formas más fáciles de usar bloques de Gutenberg en Divi Builder

  • Best WooCommerce Shipping Plugins

    Los mejores complementos de envío de WooCommerce

  • PostX Celebration - Up to 35% OFF

    ¡PostX celebra más de 20 000 instalaciones activas! [¡Celébralo con nosotros!]