Arquitectura de diseño de Commerce Composer

Un diseño es una disposición de widgets de Composer Commerce en una plantilla de diseño que recupera y visualiza distintos artefactos para representar una página de tienda. Cuando un comprador ve una página, la infraestructura de Commerce Composer resuelve el diseño adecuado para utilizar para la página para ese momento concreto. La infraestructura de Commerce Composer utilizará el contenido y el diseño para representar la página que visualizará el vendedor.

Para obtener información general sobre diseños, consulte Diseños, plantillas de diseño y diseños predeterminados.

Crear diseños

Los diseños de Commerce Composer se crean seleccionando una plantilla de diseño que incluya ranuras definidas y añadiendo widgets en la plantilla. Puede utilizar el programa de utilidad de carga de datos o la herramienta Commerce Composer para crear diseños.

Visión general de los puntos de personalización de diseño — Figura 1. Management Center proceso de creación de un diseño. La siguiente imagen ilustra el proceso para crear un diseño y detalla los puntos de personalización de los diseños.

Los pasos en el diagrama se explican aquí:

1 El usuario de empresa inicia la sesión en Management Center y abre la herramienta Commerce Composer.
2 El usuario de empresa selecciona una plantilla de diseño para utilizarla como punto de partida para el nuevo diseño. Cada plantilla es una cuadrícula que contiene una disposición específica de ranuras. De forma predeterminada, hay varias plantillas de diseño disponibles con HCL Commerce para que un usuario pueda seleccionarlas y utilizarlas para crear un diseño.
Punto de personalización: puede crear plantillas de diseño que se adapten al diseño de la tienda y que hagan que las plantillas estén disponibles para los usuarios de empresa en la herramienta de Commerce Composer. Para obtener más información sobre la creación plantillas de diseño, consulte Creación de plantillas de diseño de Commerce Composer.
3 El usuario de empresa añade los widgets a las ranuras numeradas de la plantilla de diseño, y define las propiedades y el contenido de cada widget. De forma predeterminada, hay varios widgets disponibles con HCL Commerce. Para obtener más información sobre los widgets que un usuario puede incluir en las ranuras de plantilla, consulte Biblioteca de widgets de Commerce Composer.
Los valores de las propiedades del widget están asociados al diseño específico y normalmente se almacenan en la base de datos de la tabla PLWIDGETNVP. Si las propiedades del widget son propiedades de par nombre-valor simples, el nombre y el valor de la propiedad que está asociada al diseño se almacena en la tabla PLWIDGETNVP. Si desea almacenar datos más complejos o específicos del idioma, debe utilizar una clase de gestor de widget específica. Para obtener más información, consulte Definir una clase del gestor de widgets de Commerce Composer.
Punto de personalización: puede crear plantillas de diseño que se adapten al diseño de la tienda y que hagan que las plantillas estén disponibles para los usuarios de empresa en la herramienta de Commerce Composer. También puede registrar widgets de proveedores de terceros, si los widgets se desarrollan para ser compatibles con la herramienta Commerce Composer. Para más información sobre cómo crear un widget, consulte Creación de widgets de Commerce Composer.

Un diseño está compuesto de tres componentes, una plantilla de diseño, un conjunto de widgets e información de metadatos.

Plantilla de diseño: Una plantilla es un esquema HTML de la página que divide la página en ranuras configurables. Para obtener más información sobre plantillas de diseño, consulte Arquitectura de plantilla de diseño de Commerce Composer.
Widgets: Un widget es un módulo de interfaz de usuario independiente que recupera y visualiza un tipo de datos específico en una página de tienda. Los widgets son los componentes básicos intercambiables que un usuario del Management Center puede utilizar para componer diseños para las páginas de tienda. Para obtener más información, consulte Arquitectura de widgets de Commerce Composer.
Información de metadatos: Esta información se utiliza para enlazar widgets con las ranuras que se definen en la definición de plantilla de diseño.

La información de metadatos en la definición de plantilla de diseño que enlaza un widget con una ranura se almacena en la tabla de base de datos PLWIDGETREL.PLWIDGETREL

Para más información sobre la creación de un diseño, consulte

Asignaciones de diseño

Una sola página puede tener varios diseños asignados al mismo. Un diseño se puede asignar a una única página, varias páginas o a una página de destino para un término de búsqueda. Por ejemplo,

Un diseño puede asignarse a todas las páginas dentro de una categoría para garantizar un diseño de página coherente para las páginas de categoría.
Un diseño puede asignarse a las páginas de detalles de productos para una marca de productos y a los términos de búsqueda para esos productos. Cuando los compradores buscan o examinan productos de esa marca, las páginas de destino y las páginas de detalles de productos para el producto muestran un diseño específico de la marca.

Los diseños pueden asignarse a cualquier página que tiene un grupo de páginas que esté soportada por la infraestructura de Commerce Composer. De forma predeterminada, se da soporte a los grupos de páginas siguientes:

Página de inicio
Páginas de contenido
Páginas de resultados de búsqueda
Páginas de categoría
Páginas de detalles del producto
Páginas de paquete compuesto
Páginas de código de artículo
Páginas de kit
Páginas de kit dinámico

Los diseños son específicos para una clase de dispositivo. La definición de plantilla de diseño establece si un diseño puede utilizarse para móvil, escritorio o cualquier dispositivo. A una página se le puede asignar un diseño para cada clase de dispositivo para manejar la representación de las páginas cuando los compradores visualizan la página en diferentes dispositivos. Los diseños también se pueden definir para que sean adaptables. Los diseños adaptables pueden utilizarse para páginas que se visualicen en cualquier clase de dispositivo. Los diseños adaptables utilizan plantillas de diseño que se adaptan al rango de tamaños de pantallas más amplio utilizando cuadrículas e imágenes flexibles, y otras técnicas de diseño adaptables. De forma predeterminada, todas las plantillas de diseño que se proporcionan con la herramienta Commerce Composer son adaptables. Los diseños adaptables están pensados para que solo incluyan widgets adaptables. Para obtener más información, consulte Creación de plantillas de diseño sensibles.

Actividades de asignación y resolución de diseño

Cuando un comprador ve una página de tienda que se gestiona en la herramienta Commerce Composer, la infraestructura de Commerce Composer debe determinar qué diseño utilizar para representar la página. Para resolver el diseño, la infraestructura procesa las asignaciones de diseño configuradas por los usuarios de empresa para la página. Cuando un usuario de empresa o administrador asigna un diseño a una o más páginas o términos de búsqueda, el motor de marketing crea una actividad de asignación de diseño para cada página y término de búsqueda para manejar la asignación de diseño. El motor de marketing utiliza la actividad de asignación de diseño para asociar un diseño con una página en un dispositivo concreto cuando el comprador visualiza la URL de la página. La actividad asocia cada página o término de búsqueda asignados a un diseño para una clase de dispositivo específica.

La actividad de asignación de diseño llama a la infraestructura de Commerce Composer para mostrar la página con el diseño. Dado que se pueden asignar varios diseños a una página, un usuario puede planificar las actividades de diseño para la página. Cada página tiene una planificación que está asociada con la misma para determinar cuándo se debe utilizar una actividad de diseño para representar la página. Cuando un comprador ve una página de tienda, se invoca la infraestructura de Commerce Composer para recuperar el diseño que se debe visualizar para la página actual. El infraestructura de Commerce Composer utiliza las reglas de actividad web del motor de marketing para identificar el diseño correcto que se debe utilizar en función de la planificación de asignación de diseño y el dispositivo que el comprador está utilizando para ver la página.

El proceso de resolución de diseño utiliza las propiedades configurables para los widgets dentro del diseño que están definidos en Management Center para ayudar a representar la página. Cuando el diseño se está representando, el contenedor de plantilla identifica los widgets que no se representan y la colocación posicional. Los widgets determinan los datos que se deben visualizar o utilizar dentro de los widgets, y determina valores de visualización adicionales para los widgets dentro del diseño. El proceso recupera los valores para las propiedades de widget de la tabla PLWIDGETNVP y recupera los valores de propiedad complejos con la clase de gestor de widget definida.

Para obtener más información sobre la resolución de diseño, consulte Resolución de diseño de Commerce Composer.

Diseños predeterminados

Si no se ha establecido ningún diseño para la página, la infraestructura de Commerce Composer utiliza un mecanismo de reserva para asignar un diseño predeterminado para la página. Cuando un usuario de empresa crea una página, el diseño predeterminado para el grupo de páginas al que pertenece la página se asigna automáticamente a la página. A continuación, el usuario de empresa puede asignar un diseño diferente a la página o seguir utilizando el diseño predeterminado para la página. Si un usuario elimina la asignación de diseño para una página, el diseño predeterminado se vuelve a asignar a la página de forma automática para representar la página en la tienda.

Por ejemplo, cuando un usuario de empresa crea una página de producto o de código de artículo, la infraestructura de Commerce Composer asigna un diseño de página de producto predeterminado a la página. No obstante, el usuario de empresa no puede ver la asignación de diseño predeterminada para la página dentro de la herramienta Commerce Composer. El usuario puede ver el diseño predeterminado de una página, cuando ve la página en la vista previa de la tienda Management Center o visitando su tienda.

De forma predeterminada, HCL Commerce incluye una asignación de diseño predeterminada para las páginas que pertenecen a los grupos de páginas admitidos. Este diseño predeterminado proporcionado de forma predeterminada es sensible y se utiliza para la página para todas las clases de dispositivos. Si su empresa desea un diseño predeterminado diferente para páginas dentro de un grupo de páginas, un desarrollador puede establecer un nuevo diseño predeterminado para cada clase de dispositivo para un grupo de páginas. Para obtener más información, consulte Establecer un diseño predeterminado para un grupo de páginas.