Agregar productos relacionados a su sitio web de Shopify requiere conocimiento de lenguajes de diseño web como HTML, CSS, Javascript y Liquid.
Sin embargo, mostrar productos relacionados puede ser realmente beneficioso, ya que ayuda a impulsar las ventas al mostrar a los clientes productos similares al que están buscando, lo que les facilita encontrar lo que están buscando.
Puede agregar productos relacionados por:
- Usar una aplicación: la forma más fácil de mostrar productos relacionados es usar una aplicación de la tienda de aplicaciones de Shopify. Hay una serie de aplicaciones que pueden ayudarte a hacer esto. Puedes consultarlos aquí
- Edite el código de su tema: también puede mostrar productos relacionados agregando un código para el mismo a su tema. Este código encontrará la colección que incluye su producto actual y muestra productos relacionados de la misma colección. Por ejemplo, si tiene un producto en la colección «Pantalones», también mostrará productos relacionados en la página del producto de la colección «Pantalones». Así es como puede agregar el código a su tema: a. Inicia sesión en tu panel de administración de Shopify b. Haga clic en Tienda en línea – Temas c. Haga clic en el botón Acciones en el tema al que desea agregar productos relacionados y haga clic en Editar código d. Busque el directorio Plantillas y haga clic en product.liquid e. Encuentre la siguiente línea de código de Liquid: {% sección ‘plantilla de producto’
%} f. Cree una nueva línea debajo y agregue el siguiente código: {% section ‘related-products’ %} g. Haga clic en Guardar h. En el directorio Secciones, haga clic en Agregar una nueva sección i. Cree la sección y asígnele el nombre de productos relacionados j. Haz clic en Crear sección. El editor de código se abrirá para el archivo k. Ahora tendrá que pegar un código en su archivo related-products.liquid. El código que debe pegar variará según su tema: Boundless: para el tema Boundless, copie este código alojado en GitHub y péguelo en su archivo related-products.liquid. Debut: para el tema Debut, copie este código alojado en GitHub
y péguelo en su archivo related-products.liquid. Jumpstart: para el tema Jumpstart, copie este código alojado en GitHub y péguelo en su archivo related-products.liquid. Venture: para el tema Venture, copie este código alojado en GitHub y péguelo en su archivo related-products.liquid. Otros temas: para cualquier otro tema gratuito de Shopify, copie este código alojado en GitHub y péguelo en su archivo related-products.liquid. yo Clic en Guardar
- En caso de que use el tema Boundless, deberá agregar un código en su product-grid-item.liquid a. En el directorio Snippets, haga clic en product-grid-item.liquid b. Encuentre el siguiente código: <span class= “product-item__price–sale” > {{ ‘products.general.now_price_html’ | t: precio: precio }} </span> c. Reemplácelo con el siguiente código <span class= “product-item__price–sale” ><span class= “txt–emphasis” > ahora </span> <span class= “js-price” > {{ product.price | dinero_sin_ceros_traseros }} </span>
D. Haga clic en Guardar - Habilite la sección de productos relacionados: no importa en qué tema de los anteriores haya realizado cambios, ahora debe habilitar la sección de productos relacionados a. Abre la página Personalizar tema en tu panel de administración de Shopify y ve a la página de un producto haciendo clic en cualquier producto en la vista previa del tema b. En el editor de temas en el lado izquierdo, verá una pestaña de Productos relacionados. Haga clic en él para ver su configuración. C. Haga clic en la casilla de verificación Mostrar productos relacionados d. Haga clic en Guardar