🔔 ¿Qué es el Shoppable Content y cómo funciona?

Gracias al widget de contenido shoppable, podrás centralizar y difundir todos tus CGU favoritos en tu sitio web de comercio electrónico, como los posts de marketing de influencia de Skeepers, las repeticiones de compras en directo o incluso cargar tu propio contenido de CGU.

Este complemento de Skeepers es la mejor forma de proporcionar la experiencia de compra más auténtica, inspiradora y atractiva a tus clientes.

Para ello, convertiremos cualquier UGC en un activo Shoppable para utilizar el instante emocional que los Visitantes vivirán en tu sitio web mientras rastrean tu oferta.

 

Contenidos

(Puede hacer clic en cada título para acceder directamente a la información)

Prequisitos

Una vez activada la Shoppable Contenido (póngase en contacto con su CSM), podrás acceder a la gestión de contenidos en esta URL: https://backoffice.spockee.com/channels

How does it work?

Antes de crear contenido, permítanos presentarle algunos redacción:

  • Shoppable Contenido: este es el resultado de la agregación Producto + Medios, este montón de medios agregados con un producto serán visibles en tu sitio web de comercio electrónico gracias a the Shoppable Player que deberás integrar en tu sitio web.
  • A Media: Esto es lo más extensivo definición podemos tener, esto incluye publicaciones de Skeepers, medios subidos, clips de compras en directo generados...
  • A Producto: antes de crear Contenido comprable, sincronizaremos tu catálogo para permitirle "agregar" medios & productos.
  • A Colección: a La colección es la agregación de muchas (al menos dos) Contenido comprable. Esto es esencialmente utilizado on the home páginas o en páginas de categorías para mostrar diferentes tipos de productos (I.e.: esto es útil en el "Día de San Valentín página de ofertas especiales", por ejemplo, mostrar a la vez maquillaje, moda & Zapatos).

Introducción al panel de contenido comprable

En el Back Office encontrarás tres páginas principales :

 

  • Panel de mandos: Encontrarás información sobre el Contenido que ya has creado.

Captura de pantalla 2023-07-19 a las 15.58.37.png

 

  • Productos: Este es el lugar donde verás todos los Contenidos Shoppable creados en base a un producto determinado.

Captura de pantalla 2023-07-19 at 15.57.54.png

 

 

  • Colecciones: Este es el lugar donde encontrarás todas las Colecciones existentes. Podrás crear una nueva como bien.

Captura de pantalla 2023-07-19 a las 15.58.31.png

 

Para mostrar el contenido en tu sitio, se necesitan dos pasos (una vez activada la funcionalidad de contenido shoppable)

  • Crear el contenido - gestión de contenidos
  • Integración del widget en tu sitio y el añadir al carrito

 

Content Gestión

A continuación, encontrará los pasos a seguir para crear tu Contenido:

 

- On tu Back-Office alcanzar el ContenidoContenido sección

Captura de pantalla 2023-07-19 a las 15.57.54.png

 

- Haz clic en el "+ Shoppable Content" Botón, dentro de la sección Shoppable Content.

- Selecciona el producto que desea agregar media

 

- Elige el producto que deseas utilizar

 

- Una vez seleccionado el producto, puedes seleccionar el contenido que deseas agregar. Puedes seleccionar contenido de Live Shopping, contenido de Influencer Marketing o incluso cargar tu propio contenido.

 

- Si seleccionas la Compras en directo contenido, puedes generar clips de toda la repetición para crear un "foco" en la parte necesaria.Seleccione la hora inicialhora (o utilice el corchete) y la hora final. Una vez que tu selección esté bien, genere el clip haciendo clic en el botón "Usar este clip".

 

- El clip generado aparecerá automáticamente en el panel multimedia seleccionado. Un clip generado puede borrarsecon el icono de la papelera que encontrarás en la esquina superior derecha del activo.

 

- Si seleccionas el contenido de Skeepers, puedes seleccionar los activos creados para este producto por nuestro Guardianes influyentes. Puedes filtrar el tipo de activo que quieres ver.

 

- Si seleccionas la Contenido cargado, accederás al módulo de carga para gestionar archivos MP4, JPEG o PNG. Una vez cargado un media, entonces aparece unutomático en el panel de medios seleccionados.

 

💡 ¡Es bueno saberlo!

Intenta utilizar vídeos cortos, de no más de 30 segundos, ya que tus espectadores sólo podrán pasar a la siguiente historia, un vídeo largo noserá tan eficaz.
Un vídeo de 1080p (1920x1080), 15 segundos de vídeo debe pesarentre 2 y 4 mb.
Asegúrete de mantener esos archivos a un tamaño mínimo para reducir el tiempo de carga y aumentar la experiencia del usuario.

Una vez generados los contenidos, puedes cambiar el orden en que se muestran en el reproductor de widgets. Utiliza el asa de la izquierda para reorganizar los activos.

wiki_scproductorder.jpg

 

Crear una colección

Una vez que hayas añadido contenido a diferentes productos y necesites consolidar o agregar, tienes la posibilidad de crear una colección. Por ejemplo, puedes crear una colección de todos los productos de una misma categoría para mostrarlos en una página de categoría.

  1. Haz clic en Nueva colección
  2. Da un nombre a su colección
  3. Añade tantos productos como desee.
    • Encontrarás el producto con el contenido adjunto.
  4. Selecciona el contenido que deseas mostrar
  5. Haz clic en guardar

Captura de pantalla 2023-07-19 a las 15.58.31.png

 

Integrar el widget deslizante Shoppable Content a una página web

Después de que contenido Shoppable ha sido creado (Producto + Medios) puedes empezar a mostrar el Contenido Shoppable en tu página web

Para ello necesita copiar pegar el siguiente código donde quieras mostrar el Contenido Shoppable

<script async src="https://sc.ls.skeepers.io/shoppable.umd.js"></script> 
<skp-widget></skp-widget>

 

Este es un código totalmente genérico, lo que significa que se puede utilizar en todo su sitio web (si utiliza Shopify, puedes utilizar nuestra Shopify App), y funciona automáticamente si cumple las siguientes condiciones:

  • Tu nombre de dominio está en la lista del dominio que nos dio durante el onboarding. Estamos limitando dónde se puede mostrar el Shoppable Content por razones de seguridad. Puedes darnos tantos dominios como desees (ej: Producción, staging, desarrollo...)
  • El enlace del producto debe estar definido en el feed del producto, para que podamos hacer coincidir la URL que está visitando con el contenido shoppable que debemos mostrar

 

💡 ¡Bueno saberlo!

Puedes dinámicamente cambiar el identificador del producto, si deseas mostrar un contenido Shoppable en otra página de producto, o en una página que no está en el feed de productos.

<script async src="https://sc.ls.skeepers.io/shoppable.umd.js"></script> 
<skp-widget product="PRODUCT_ID"></skp-widget>

 

Para saber más sobre la integración de widgets, puedes leer este artículo: 🔔 Shoppable Content - Integración técnica (con casos de uso)

 

Integrar una colección

Añadir una colección (múltiples contenidos shoppable) a una página es muy similar a la integración de contenidos shoppable. Después de seleccionar una Colección en el menú correcto :

1. Haz clic en el botón de la derecha. Haga clic en el botón de la derecha

2. Copia el código

image-20230509-151851.png

Deberías obtener un código como este :

 
<script async src="https://sc.ls.skeepers.io/shoppable.umd.js"></script> 
<skp-widget collection="XXX"></skp-widget>

 

Este código se puede integrar en cualquier lugar dentro de la Nombre de dominio lista que nos ha proporcionado.

Para saber más sobre la integración de widgets, puedes leer este artículo: 🔔 Shoppable Content - Integración técnica (con casos de uso)

 

Despliegue del rastreador

Una vez completada la integración, es hora de realizar un seguimiento del comportamiento de los clientes. Encontrarás ayuda en línea para configurar el rastreador en el siguiente enlace: Shoppable Content Tracker - Despliegue

 

FAQ - Rendimiento del widget

¿Cuál es el impacto de integrar el widget en la página del producto?

Widget

El peso total del widget por sí solo es de 150kb y se carga asíncronamente, lo que significa que ocurre mientras se cargan otros elementos de la página, minimizando el impacto visual que sienten los clientes.

El tiempo de respuesta de nuestro servidor oscila entre 50ms y 100ms dependiendo de su ubicación.

Medios

Los medios a tamaño completo sólo se descargan cuando se hace clic en ellos. Creamos una vista previa ligera y optimizada para cada medio, reduciendo el tiempo de descarga al mínimo. Cada medio añade 20kb a 90kb al peso total cargado.

Al pasar el ratón por encima de un vídeo, el widget carga y muestra un extracto del vídeo de 5 segundos, que también está optimizado y comprimido, con una media de 500 a 900kb

Impacto

Impacto sobre FCP(First Contentful Paint - momento en el que se pinta el primer texto o imagen) en un PDP → Ninguno

Impacto en el TTI (Tiempo para interactuar) en un PDP → insignificante (menos de 50ms)

Ejemplo

Aquí tienes una prueba de rendimiento que muestra el resultado en la misma página, con y sin el widget de contenido shoppable. Esta prueba contiene 20 activos para un peso total de 521kb + 150kb para el widget. (peso medio por medio 26kb)

Captura de pantalla

Sin contenido comprable

Captura de pantalla

Con contenido shoppable

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 0 de 0