Su sitio web de comercio electrónico debería permitirle diseñar y mover contenido rápidamente sin escribir códigotodo sin dejar de ser fiel a la marca.
Esa flexibilidad le permite delegar tareas de contenido y diseño de sitios web a casi cualquier miembro del equipo, lo que le ayuda a evitar retrasos o agotamiento de los desarrolladores, para que pueda entregar proyectos más rápido.
Esa es la solución que ofrecen los creadores de sitios web de comercio electrónico de arrastrar y soltar.
Pero sólo una cosa. Tienes necesidades empresariales únicas.
Por lo tanto, su constructor de arrastrar y soltar debería acomodarlos. Por ejemplo, tu solución sin código debe ser elástico, permitiendo diversas personalizaciones, incluida la inserción de código, cuando sea necesario.
Ahí es donde Magento 2 Page Builder resulta útil.
Esta guía le ayuda a comprender los casos de uso y los beneficios de Magento 2 Page Builder y le muestra cómo crear una página de destino, un escaparate, una lista de productos y una página de contenido.
Vamos a sumergirnos.
Beneficios de usar Magento 2 Page Builder
A los usuarios empresariales les encanta Magento 2 Page Builder por al menos cinco razones.
- No se requieren habilidades de codificación: Magento 2 Page Builder permite a cualquiera crear páginas de contenido de primera clase sin conocimientos de programación.
- Interfaz amigable: Magento 2 Page Builder tiene una curva de aprendizaje casi nula y un diseño de interfaz intuitivo.
- Arrastrar y soltar y vista previa en vivo: Arrastre y suelte componentes, diseños y elementos de contenido y obtenga una vista previa de ellos en tiempo real.
- Gestión de contenidos flexible: La extensión Page Builder admite todas las necesidades de creación de contenido y diseño de páginas de comercio electrónico.
- Admite personalizaciones de desarrolladores: Los usuarios empresariales o avanzados pueden crear funciones personalizadas usando la ayuda del desarrollador.
¿La mejor parte? Comenzar con Magento 2 Page Builder es fácil. Así es cómo.
Comenzando con Magento 2 Page Builder
Page Builder es una extensión de Magento que permite a los usuarios de Adobe Commerce y Magento Open Source crear páginas de contenido rico en diseño utilizando controles prediseñados.
Estos controles incluyen creadores de páginas intuitivos de arrastrar y soltar, vistas previas en vivo, medios enriquecidos, editores de formularios y catálogos de productos.
Sin embargo, sólo los usuarios de Magento Commerce pueden acceder a sus funciones mejoradas.
Exploremos cómo empezar con esto. Creador de páginas CMS.
Configure Magento 2 Page Builder en 4 pasos
Siga estos pasos para configurar su área de preparación de Magento Page Builder en Adobe Commerce.
Paso 1: Ir a Historias > Ajustes > Configuración desde la barra lateral de Administrador.
Paso 2: Seleccionar Gestión de contenido bajo general.
Paso 3: Selecciona el Habilitar generador de páginas campo a Sí en herramientas de contenido avanzadas.
Etapa 4: Guarde la configuración.
Configure sus diseños predeterminados
Ahora, dirígete al área de Configuración.
Bajo Generalseleccionar Web. A continuación, expanda el Diseños predeterminados y elija su producto, categoría y diseños de página.
A continuación, guarde la configuración.
Ahora está listo para comenzar y explorar las muchas funciones que Magento 2 Page Builder tiene para ofrecer.
Características del generador de páginas Magento 2
Page Builder tiene cinco funciones con un total de más de 20 subfunciones.
Exploremos qué le ofrece cada componente.
Opciones de la caja de herramientas
Puede controlar los diseños de página, los elementos y el contenido mediante las opciones de la caja de herramientas. Por ejemplo, estas funciones le permiten mover, agregar, ocultar y eliminar componentes de su página.
Pase el cursor sobre los contenedores de contenido del Page Builder para encontrar estas opciones de caja de herramientas.
Tenga en cuenta que estas características son específicas del contenedor. Entonces las opciones varían de un contenedor a otro. La siguiente imagen muestra las opciones de la caja de herramientas para el diseño de Fila.
Diseños
Magento 2 Page Builder le ofrece tres tipos de diseños:
Arrastre cualquiera de estos tipos de contenido desde el diseño de Page Builder al escenario de su panel. Luego, haga clic en el icono de engranaje de la caja de herramientas para acceder a la configuración y personalizar el diseño.
Elementos
Los elementos del creador de páginas le permiten agregar contenido escrito, imágenes, llamadas a la acción y otras funcionalidades de contenido a sus páginas.
Como cualquier otra cosa, puedes arrastrar y soltar elementos de contenido y personalizarlos a tu gusto.
Magento 2 Page Builder tiene cinco elementos. Arrojemos un poco de luz sobre ellos.
- Texto: esta función le permite agregar texto, imágenes, enlaces, plantillas de contenidoy widgets para su contenido.
- Encabezamientos: esta función le permite agregar etiquetas de encabezado para establecer un flujo de temas dentro de su contenido para un mejor SEO (optimización de motores de búsqueda).
- Botones: esta función le permite agregar y personalizar los botones de navegación o de llamado a la acción de su página.
- Divisores: Los divisores agregan pausas visuales entre las secciones de contenido.
- código HTML: esta función le permite incrustar fragmentos de código JavaScript, HTML y CSS en su página.
Medios de comunicación
Esta interfaz de arrastrar y soltar le permite agregar medios enriquecidos a su contenido.
Puede agregar estos tipos de medios:
- Imágenes
- Video
- pancartas
- Deslizadores
- mapas de Google
Magento Page Builder admite tipos de imágenes PNG, JPG y GIF, y puede vincular su imagen a cualquier página de contenido, producto o categoría.
Esta misma idea se aplica a otros tipos de medios: arrástrelos al escenario y luego use las opciones de su caja de herramientas para agregar los medios que desea que vea su audiencia.
Componentes de contenido
Los componentes de contenido son útiles para agregar formularios, crear experiencias de comercio electrónico únicas y distribuir contenido en su sitio web.
Magento 2 Page Builder tiene cuatro tipos de contenido:
- bloques CMS
- Bloques dinámicos
- Productos
- Recomendaciones de productos
Los bloques son las unidades básicas de creación de páginas de Magento 2 Page Builder. Puedes incrustar bloques en bloques.
bloques CMS mostrar información estática como imágenes y textos, mientras que bloques dinámicos mostrar información de su base de datos mediante widgets.
El contenido de recomendación de productos le ayuda servir productos recomendados a los compradores en su página. Pero esta característica es sólo para usuarios de Magento Commerce.
Ahora, hagamos algunos tutoriales rápidos usando estas funciones.
Guías de usuario de Magento 2 Page Builder
Antes de crear páginas o crear contenido en Page Builder, aumente su duración de la sesión de administrador para evitar tiempos de espera en las sesiones mientras trabaja.
Cómo crear una página
Inicie la creación de la página desde su panel de administración usando esta ruta: Contenido > Elementos > Páginas.
Agrega un nueva pagina desde la esquina superior derecha de su pantalla.
Selecciona el Habilitar página control deslizante para No para evitar realizar cambios en vivo en su tienda. Y luego, dale un título a tu página.
Expanda la sección de diseño, elija un tema o use el tema predeterminado de Magento.
Ahorrar.
A continuación, agreguemos filas y columnas a su página.
Cómo agregar filas y columnas a las páginas
Comencemos agregando filas.
Crear una fila
Abra la página que desea editar en la etapa del Creador de páginas.
Arrastre el diseño de Fila desde la sección Diseño a la página. Verás una línea roja entre las filas que indica el límite. Agregue su nueva fila allí.
Personalice esta fila usando las opciones de su caja de herramientas. Luego, establece la apariencia de la fila.
Elija una apariencia de ancho para su fila.
Y luego ahorrar.
Crear una columna
Divida esa fila en dos partes iguales arrastrando y soltando la columna desde las opciones de diseño en el área de preparación de Magento Page Builder.
Cada columna es un contenedor único con sus opciones de caja de herramientas. Entonces, tienes un control completo de personalización del mismo.
Cómo agregar banners a una página
Abra la página donde desea agregar un banner, luego arrastre y suelte un contenedor de banner en el backend de Page Builder.
Elija una imagen de banner de la caja de herramientas: cargarla o galería.
Elija una apariencia de banner de la Configuración de la caja de herramientas.
Desplácese hacia abajo hasta el Fondo sección para configurar la imagen de fondo del banner.
Cambie y dé formato al texto del marcador de posición en el editor WYSIWYG.
Regrese a la configuración para agregar un color de botón, elija fuentes y luego vaya a la sección de contenido para agregar un enlace de banner.
Entonces la interfaz de tu banner debería terminar luciendo así:
Concluya su configuración, guárdela y ciérrela.
Cómo agregar contenido de reseña a una página
Agregar contenido de revisión es tan simple como crear filas y columnas y agregar contenido nuevo utilizando elementos y medios.
Veamos un ejemplo.
Crea una fila y dos columnas. Pero arrastre el borde derecho de la primera columna a la posición 4/12 en la cuadrícula. Esta configuración ajusta la segunda columna a 8/12 automáticamente.
Agregue la imagen de su producto de reseña a la primera columna usando el imagen componente de la medios de comunicación sección: vea la imagen a continuación.
Luego agregue el texto de su reseña a la otra columna usando Texto de Elementos.
Agregue una imagen de cinco estrellas al cuadro de texto usando la función nativa de insertar imagen en el editor WYSIWYG.
Y luego agregue el texto de su reseña al editor. También puede agregar enlaces al texto de su reseña.
El resultado final debería verse así.
Cómo agregar un catálogo de productos a una página
Abra la página donde desea agregar este catálogo o cree un página de catálogo dedicada en el editor del generador de páginas.
Arrastra y suelta el producto componente al escenario.
Establecer las condiciones y la categoría. en el producto ajustes área.
Elija la cantidad de productos a mostrar y agregue un botón de compra.
Configure el área de pago, escriba la descripción de su producto y agregue otros elementos de la página para completar la configuración del catálogo.
Y luego guardar.
Salga de la página CMS haciendo clic en el icono blanco en la esquina superior derecha con dos flechas apuntando entre sí.
Y luego, guarde y cierre usando el menú desplegable en la página de administración.
Reflexiones finales: inicie su creador de páginas Magento 2
Magento 2 Page Builder es una solución de gestión de contenidos flexible que puede ayudarle a aumentar la productividad. Así que no más dolores de cabeza en la gestión de contenidos.
Pero un CMS flexible sólo puede llevarle hasta cierto punto. Sería útil si tuvieras un solución de alojamiento de comercio electrónico eso depende del tabaco.
Ingrese al alojamiento empresarial Nexcess. Nexcess maneja sus necesidades de hosting de comercio electrónico empresarial, incluyendo alojamiento magento. Pruébelo hoy.