¡Huy! Este email no tiene permiso para la apertura de ticket. Por favor, póngase en contacto con el responsable de tu tienda para facilitar el acceso.

Cómo montar un Kit Look

Antes que hablemos sobre el Kit Look, es importante recordar que usted debe saber crear un Kit. Para eso, acceda al artículo "Como crear Kit".

Las diferencias entre el KIT y el KIT LOOK

KIT: En un kit, sólo se puede vender los productos componentes en el kit, o sea, no se puede venderlos separadamente. Esto significa que, caso el producto “Blusa” esté en el kit “Playa”, mismo buscando por el producto Blusa en el sitio web, no se podrá venderlo fuera del kit - con sus demás componentes.

KIT LOOK: En un kit look, es posible encontrar todos los productos componentes en el sitio web y venderlos fuera del kit, o sea, hasta mismo en la página de producto del kit look es posible comprar los ítems separadamente, o todos juntos. Vea nuestra documentación de personalización del kit look.

¿Qué es el Kit Look?

Ese término es muy conocido en el segmento de Moda. Un Kit Look es un modo que usted consigue comprar varios productos visualizando sólo la pantalla de un único producto.

Ejemplos:

En el layout anterior, es posible seleccionar los ítems del kit que al cliente le gustaría comprar y, a continuación, hacer clic en “Comprar Productos Seleccionados”.

O, si preferir, usted puede comprar el kit completo manteniendo todos los ítems seleccionados.

En ese layout cada ítem posee un botón de “Comprar Separadamente”.

Caso prefiera comprar el kit completo, basta clicar en “Comprar Look”.

Cuando haga clic en comprar, independiente del layout, se añadirán todos los componentes del kit en el carrito automáticamente e individualmente, o sea, caso el kit posea 4 ítems, se añadirán los 4 ítems.

Adopción de las páginas de los Kits

<div class="selectSku skuSelection">
<!-- Kit product 01 -->
<div class="kit clearfix">
<!-- /infoKit -->
<div class="price clearfix">
<h2><vtex.cmc:productName productIndex="1" /></h2>
<!-- /tpl-left -->
<div class="tpl-left">
<!-- /skuSelection -->
<div class="skuSelection clearfix">
<!-- /exibicao de cor -->
<div class="viewColor">
<div class="title"></div>
</div>
<vtex.cmc:skuRichSelection changeImage="1" productIndex="1" />
</div>
<!-- /dv-buy-button -->
<div class="dv-buy-button clearfix">
<vtex.cmc:BuyInPage productIndex="1"/>
</div>
</div>
<div class="tpl-right contentpreco">
<div class="tpl-qtd">
<span>Selecione a quantidade</span>
</div>
<vtex.cmc:skuPrice productIndex="1"/>
</div>
</div>
<div class="container-sku-selection">
<div class="loadAjax" style="display:none;"></div>
<div class="bg"></div>
<div class="container">
<div class="close"></div>
<h2>Atenção!</h2>
<vtex.cmc:skuRichSelection changeImage="1" productIndex="1" />
<div class="comprar dv-buy-button clearfix">
<vtex.cmc:BuyInPage productIndex="1"/>
</div>
</div>
</div>
</div>
<!-- Kit product 02 -->
<div class="kit clearfix">
<!-- /infoKit -->
<div class="price clearfix">
<h2><vtex.cmc:productName productIndex="2" /></h2>
<!-- /tpl-left -->
<div class="tpl-left">
<!-- /skuSelection -->
<div class="skuSelection clearfix">
<!-- /exibicao de cor -->
<div class="viewColor">
<div class="title"></div>
</div>
<vtex.cmc:skuRichSelection changeImage="1" productIndex="2" />
</div>
<!-- /dv-buy-button -->
<div class="dv-buy-button clearfix">
<vtex.cmc:BuyInPage productIndex="2"/>
</div>
</div>
<div class="tpl-right contentpreco">
<div class="tpl-qtd">
<span>Selecione a quantidade</span>
</div>
<vtex.cmc:skuPrice productIndex="2"/>
</div>
</div>
<div class="container-sku-selection">
<div class="loadAjax" style="display:none;"></div>
<div class="bg"></div>
<div class="container">
<div class="close"></div>
<h2>Atenção!</h2>
<vtex.cmc:skuRichSelection changeImage="1" productIndex="2" />
<div class="comprar dv-buy-button clearfix">
<vtex.cmc:BuyInPage productIndex="2"/>
</div>
</div>
</div>
</div>
</div>

IMPORTANTE

El controle BuyInPage, descrito en el código anterior, sólo funcionará con la utilización del control AmountÍtemsInCart (en el propio template o en cualquier subtemplate relacionado).

Comprenda la relación entre esos controles en Listado Completo de Controles.

changeImage=”1″: indica cuál la casilla alterará la imagen del sku, cuando seleccionado.

Este template debe asociarse a un nuevo Layout de Página de Producto que se aplicará sólo en la categoría donde los Kits están catastrados:

Es posible añadir al carrito cuántos componentes desee.

Ejemplo: Si usted posee un producto kit con 3 componentes y otro producto kit con 5 componentes, y desee utilizar esta funcionalidad del Kit Look para los dos productos kits, no es necesario crear un template para cada cantidad.

Usted pode crear un template con 5 grupos de controles de los componentes (productIndex=númerototal).

Cuando utilizado el productIndex=0, se exhiben las informaciones del Kit en sí. En la página del producto que tenga un kit con 2 componentes, exhibirá sólo los 2 componentes. Caso tenga un kit con 5 componentes, exhibirá los 5.

Resumiendo, la tienda puede crear un template con la cantidad de product index que desee. Surgirá, en la página del producto, sólo la cantidad de componentes de cada kit.

 



¿Tiene más preguntas? Enviar una solicitud

Comentarios