Partekatu bidez


Módulo de cuadro de compra

Nota:

El grupo de interés comercial de Dynamics 365 Commerce ha pasado de Yammer a Viva Engage. Si no tiene acceso a la nueva comunidad de Viva Engage, rellene este formulario (https://aka.ms/JoinD365commerceVivaEngageCommunity) para agregar y mantenerse involucrado en las últimas discusiones.

En este artículo se describen los módulos de cuadro de compra y se explica cómo agregarlos a páginas de sitio en Microsoft Dynamics 365 Commerce.

El término cuadro de compra normalmente hace referencia al área de una página de detalles del producto (PDP) que está en la parte superior de la página. Contiene toda la información más importante que un cliente necesita para realizar una compra. Un área que está "por encima del pliegue" es visible al cargar la página, por lo que los usuarios no tienen que desplazarse hacia abajo para verla.

Un módulo buy box es un contenedor especial que hospeda todos los módulos que se muestran en el área de la caja de compra de una página de detalles del producto.

La dirección URL de una página de detalles de producto incluye el id. de producto. El identificador del producto proporciona toda la información necesaria para representar un módulo de cuadro de compra. Si no proporciona un identificador de producto, el módulo de cuadro de compra no se representa correctamente en una página. Por lo tanto, puede usar un módulo de caja de compra solo en páginas que tengan contexto de producto. Para usarlo en una página que no tiene contexto de producto (por ejemplo, una página de inicio o una página de marketing), debe realizar personalizaciones adicionales.

La siguiente imagen muestra un ejemplo de un módulo de cuadro de compra en una página de detalles del producto.

Captura de pantalla de un módulo de compra.

Franjas y propiedades del módulo de cuadro de compra

En una página de detalles del producto, un cuadro de compra se divide en dos regiones: una región multimedia a la izquierda y una región de contenido a la derecha. De manera predeterminada, la proporción del ancho de columna de la región multimedia con respecto al ancho de columna de la región de contenido es 2:1. En los dispositivos móviles, las dos regiones se apilan de modo que una región aparece debajo de la otra. Puede usar temas para personalizar los anchos de columna y la clasificación de apilamiento.

Un módulo de caja de compra representa el título, la descripción, el precio y las calificaciones de un producto. También permite a los clientes seleccionar variantes de productos que tienen atributos de producto distintos, como tamaño, estilo y color. Cuando un cliente selecciona una variante de producto, el módulo actualiza otras propiedades en el cuadro de compra (por ejemplo, la descripción del producto e imágenes) para reflejar la información de variante.

Se proporciona un selector de cantidad, para que los clientes puedan especificar la cantidad de artículos a comprar. La configuración del sitio define la cantidad máxima que un cliente puede comprar.

Desde el cuadro de compra, los clientes también pueden realizar acciones como agregar un producto al carrito, agregar un producto a su lista de deseos y seleccionar una ubicación de recogida. Estas acciones se pueden realizar en un producto o una variante de producto. Para agregar un producto a una lista de deseos, el cliente debe iniciar sesión.

Puede usar temas para quitar o cambiar el orden de los controles de acciones y las propiedades del producto de cuadro de compra.

Propiedades del módulo

  • Etiqueta de encabezado: esta propiedad define la etiqueta de encabezado para el título del producto. Si la caja de compra está en la parte superior de la página, establezca esta propiedad en h1 para cumplir los estándares de accesibilidad.

  • Habilitar recomendaciones de "comprar looks similares": esta propiedad permite que el cuadro de compra muestre vínculos a productos que se parecen al artículo que se ve actualmente. Esta función está disponible en Commerce, versión 10.0.13 y posterior.

Módulos que puede usar en un módulo buy box

  • Galería multimedia : use este módulo para mostrar imágenes de un producto en una página de detalles del producto. Para obtener más información sobre este módulo, consulte Módulo de galería de medios.
  • Selector de la tienda : use este módulo para mostrar una lista de tiendas cercanas en las que hay un artículo disponible para su recogida. Permite a los usuarios especificar una ubicación para encontrar tiendas cercanas. Para obtener más información sobre este módulo, consulte Módulo selector de tienda.
  • Botón de compartir en redes sociales - Agregue este módulo al cuadro de compra para que los usuarios puedan compartir la información del producto en las redes sociales. Para más información, consulte Módulo Compartir en redes sociales.

Configuración del módulo de cuadro de compra

Puede configurar las siguientes configuraciones del módulo de la caja de compra en Configuración del sitio > Extensiones:

  • Límite de cantidad de la línea del carrito. Use esta propiedad para especificar el número máximo de cada artículo que se puede agregar al carrito. Por ejemplo, un minorista puede decidir si solo 10 de cada producto se pueden vender en una única transacción.
  • Inventario: para obtener información sobre cómo aplicar la configuración de inventario, consulte Aplicar configuración de inventario.
  • Agregar producto al carrito - Para obtener información sobre cómo aplicar la configuración Agregar producto al carrito, consulte Agregar producto a la configuración del carrito.

Compre extensiones de definición de módulo de caja en el tema Adventure Works

El módulo de caja de compra que proporciona el tema Adventure Works tiene una extensión de definición de módulo que admite la implementación de un módulo de especificaciones de producto dentro de un módulo de acordeón en una caja de compra de PDP. Para mostrar los atributos de especificación del producto en una caja de compra de PDP, agregue un módulo de especificación de producto a la ranura del módulo de acordeón en la ranura de la caja de compra.

Importante

El tema de Adventure Works está disponible a partir del lanzamiento de la versión 10.0.20 de Dynamics 365 Commerce.

Interacción con Commerce Scale Unit

El módulo de cuadro de compra obtiene la información de producto mediante las interfaces de programación de aplicaciones (API) de Commerce Scale Unit. Usa el identificador de producto de la página de detalles del producto para obtener toda la información del producto.

Agregar un módulo de cuadro de compra a una página

Para agregar un módulo de cuadro de compra a una nueva página y establecer las propiedades necesarias, siga estos pasos:

  1. Vaya a Fragmentos y seleccione Nuevo para crear un nuevo fragmento.
  2. En el cuadro de diálogo Nuevo fragmento, seleccione el módulo Cuadro de compra.
  3. En Nombre del fragmento, especifique el nombre Fragmento de cuadro de compra y luego seleccione Aceptar.
  4. En el espacio Galería de medios del módulo de cuadro de compra, seleccione los puntos suspensivos (...) y luego seleccione Agregar módulo.
  5. En el cuadro de diálogo Seleccionar módulo, seleccione el módulo Galería de medios y, a continuación, Aceptar.
  6. En el espacio Selector de tienda del módulo de cuadro de compra, seleccione los puntos suspensivos (...) y luego seleccione Agregar módulo.
  7. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Selector de tienda y elija Aceptar.
  8. Seleccione Guardar y seleccione Finalizar edición para proteger el fragmento y luego seleccione Publicar para publicarlo.
  9. Vaya a Plantillas y luego seleccione Nuevo para crear una nueva plantilla.
  10. En el cuadro de diálogo Nueva plantilla, en Nombre de plantilla, introduzca Plantilla PDP y luego seleccione Aceptar.
  11. En el espacio Cuerpo, seleccione los puntos suspensivos (...) y después seleccione Agregar módulo.
  12. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Página predeterminada y, a continuación, Aceptar.
  13. En el espacio Principal de la página predeterminada, seleccione los puntos suspensivos (...) y, a continuación, Agregar fragmento.
  14. En el cuadro de diálogo Seleccionar fragmento, seleccione el fragmento Fragmento de cuadro de compra creado anteriormente y, a continuación, seleccione Aceptar.
  15. Seleccione Guardar y seleccione Finalizar edición para proteger la plantilla y luego seleccione Publicar para publicarla.
  16. Vaya a Páginas y seleccione Nuevo para crear una nueva página.
  17. En el cuadro de diálogo Crear nueva página, en Nombre de página, introduzca una Página PDP y luego seleccione Siguiente.
  18. En Elegir plantilla, seleccione Plantilla PDP y luego seleccione Siguiente.
  19. En Elija un diseño, seleccione un diseño de página (por ejemplo, Diseño flexible), y luego seleccione Siguiente.
  20. En Revisar y terminar, revise la configuración de la página. Si necesita editar la información de la página, seleccione Atrás. Si la información de la página es correcta, seleccione Crear página.
  21. En el espacio Principal de la nueva página, seleccione los puntos suspensivos (...) y, a continuación, Agregar fragmento.
  22. En el cuadro de diálogo Seleccionar fragmento, seleccione el fragmento Fragmento de cuadro de compra creado anteriormente y, a continuación, seleccione Aceptar.
  23. Guarde la página y obtenga una vista previa de ella. Agregue el parámetro de cadena de consulta ?productid=<id. de producto> a la dirección URL de la página de vista previa. De esa manera, el contexto del producto se usa para cargar y representar la página de vista previa.
  24. Seleccione Guardar y seleccione Finalizar edición para proteger la página y luego seleccione Publicar para publicarla. Un cuadro de la compra debe aparecer en la página de detalles de productos.

Recursos adicionales

Descripción general de la biblioteca de módulos

Módulo de selector de tienda

Módulo de galería de medios

Módulo Contenedor

Módulo de carrito

Módulo de finalización de la compra

Módulo de confirmación de pedido

Módulo de encabezado

Módulo de pie de página

Módulo de compartir en redes sociales

Configuración de Agregar producto a la carrito

Calcular la disponibilidad de inventario para canales minoristas

Actualizaciones de SDK y bibliotecas de módulos