Insertar los widgets en una página de producto es lo mismo que colocar los widgets en otras páginas, pero se debe insertar el Código de Parámetros Adicionales en elemento <head> de la página, o justo antes del Código de Integración del Widget.
Código de inserción del Widget
Para colocar un widget previamente creado en el editor de widgets del panel de control de Photoslurp, sólo tienes que insertar el código que aparece a continuación en la página en la que quieras que se muestre el widget.
<!-- Start Photoslurp Embed Code -->
<div class="ps-container">
<ps-widget data-config="INSERTA AQUÍ EL WIDGET ID"></ps-widget>
<script src="https://static.photoslurp.com/widget/v3/loader.js" async></script>
</div>
<!-- End Photoslurp Embed Code -->
Se debe rellenar el parámetro data-config con el valor del ID del Widget
Parámetros de configuración para un widget de página de producto
Parámetros obligatorios:
- lang - (código de idioma de la tienda).
Si la tienda está disponible en diferentes idiomas, este parámetro determinará en qué idioma se mostrarán los textos del widget. Su valor debe coincidir con el código de idioma correspondiente en su catálogo Photoslurp. Recomendamos asignarlo dinámicamente. -
productId - (identificador/SKU del producto en su catálogo Photoslurp).
Para que un widget muestre primero las imágenes relacionadas con un producto específico (SKU), el parámetro adicional productId debe ser añadido al widget. Cuando no haya más imágenes que coincidan con este parámetro, el widget mostrará el resto de imágenes aprobadas. Este valor debe establecerse dinámicamente, usando las características de tu plataforma de e-commerce para mostrar sólo el SKU del producto que se está mostrando en la página
Parámetros opcionales:
-
productType - (valores especificados en el campo product_types del feed de productos).
Si decides mostrar más contenido además del producto que aparece en la página, puedes utilizar este parámetro para mostrar contenido relacionado con el tipo de producto (p.e. categorías). Para utilizar este parámetro, el product feed debe contener datos en la columna product_typesSu valor es una lista de categorías separada por comas (Hombres, Zapatos), una lista con corchetes para mostrar la jerarquía (Hombres > Zapatos) o una combinación de ambas. Para más información sobre la función de tipos de productos puede consultar esta guía.
Código de Configuración del Widget
Estos parámetros se deben añadir justo antes del Código de Integración del Widget.:
<!-- Start Photoslurp Widget Configuration Code -->
<script>
window.photoSlurpWidgetSettings = window.photoSlurpWidgetSettings || {};
photoSlurpWidgetSettings["INSERTA AQUÍ EL WIDGET ID"] = {
lang: 'INSERTA AQUÍ EL CÓDIGO DE IDIOMA',
productId: ['INSERTA AQUÍ EL SKU DEL PRODUCTO'],
// DESCOMENTAR EL PARAMETRO SI SE QUIERE UTIIZAR
// productType: ['TIPO DE PRODUCTO 1', 'TIPO DE PRODUCTO 2', '...']
};
</script>
<!-- End Photoslurp Widget Configuration Code -->
Tras asegurarse de haber usado los datos necesarios en los parámetros que se van a necesitar, y de haber descomentado el código, guarde los cambios.