---
title: "Mostrar productos relacionados"
---

## Una estrategia para mejorar tus ventas

El visitante de tu página está revisando el detalle de un producto que le interesó.

Sería buena idea mostrarle además productos relacionados (no confundir con similares) al que está revisando para así incentivar la permanencia en la tienda y *eventualmente* generar una o varias ventas.

¿Cómo hacer esto?. A continuación te contamos.

## Qué es un producto relacionado

En Bolder un producto relacionado tienen **etiquetas en común** pero *además* **son de distinto *Tipo de Producto***. Veamos un ejemplo:

-   Producto 1: Set Contenedores
-   Marca: Joseph Joseph
-   Tipo de producto: Contenedor
-   Etiquetas: hermético, portátil, utensilio

* * *

-   Producto 2: Good grips
-   Marca: Oxo
-   Tipo de producto: Mandolina
-   Etiquetas: cortar, ergonomico, utensilio

Ambos productos son de tipos de producto diferentes, pero tienen una etiqueta en común: «utensilio», en consecuencia son Producto relacionados.

**Una o más**:

Los productos relacionados pueden compartir una o más etiquetas.

## Cómo muestro productos relacionados

Esta es una funcionalidad que ya viene programada en todas nuestras plantillas, pero si estás desarrollando una nueva plantilla propia tuya desde cero debes agregar lo siguiente a tu código product.html:

\<!-- product.html --> \{% if product.has\_related\_products %\} \<div id="related-products">   \<h2>\{\{ "titles.related\_products" | t \}\}\</h2>   \<ul class="products clearfix">   \{% loop product.related\_products in 'product\_item' limit:3 %\}   \</ul> \</div>\<!-- /related-products --> \{% endif %\}

## Orden de aparición

El orden de aparición de los productos relacionados es de forma descendente por la cantidad de etiquetas que tengan en común.

### Ejemplo

A continuación te mostramos una página detalle de un producto, con sus similares y relacionados.

Figura 1: Detalle de un producto. Contiene además Relacionados y Similares

## Sugiere productos relacionados en el carro de compra

El siguiente trozo de código sugerirá productos relacionados justo después que el comprador agrega un producto al carro. Un excelente momento para *incentivar* otra compra. Esta es una funcionalidad que ya viene programada en todas nuestras plantillas, pero si estás desarrollando una nueva plantilla propia tuya desde cero debes agregar lo siguiente a tu código.

\<!-- cart.html --> \{% if related\_products\_to\_just\_added %\} \<section class="product-list">   \<h2>\{\{ 'orders.messages.you\_might\_be\_interested' | t \}\}\</h2>   \<ul class="products row">     \{% loop related\_products\_to\_just\_added in 'product\_item' limit:3 %\}   \</ul> \</section> \{% endif %\}

Productos relacionados en el Carro de compra