Documentação: Video Commerce

Consulte abaixo todos os formatos e tags para implementar  Video Commerce by StreamShop no seu site ou ecommerce.

Widget

Instale o código abaixo em todas as páginas do seu site em que deseja rodar o Widget StreamShop.
Você pode utilizar gerenciadores de Tags como o Google Tag Manager para facilitar esta tarefa.

Você também pode aplicar widgets específicos para páginas do seu site.
Basta criar diferentes Tags para cada uma de suas páginas e variar no parâmetro live, o video destino que quer aplicar na sua página.

<script>
   var liveshopSdkWidgetOptions = {
     live: 'https://streamshop.liveshop.com.br/streamshopdemo/loja?v=JPAVHsLx',
     bg: 'https://images.crunchbase.com/image/upload/c_pad,f_auto,q_auto:eco,dpr_1/mzolsyhormiy7fvz6dgp'
   };

  (function (w, d, s, src) {
    var _ss = d.createElement(s);
    _ss.async = true;
    _ss.src = src;
    _ss.onload = () => Promise.resolve().then(() => ss_widget_btn(liveshopSdkWidgetOptions));
    d.getElementsByTagName(s)[0].parentNode.insertBefore(_ss, null);
    })(window, document, 'script', 'https://assets.streamshop.com.br/sdk/liveshop-sdk-widget-btn.min.js');
</script>

Script SDK

Assista ao Vídeo

O Script SDK é necessário para os demais formatos do Video Commerce StreamShop.
Instale o script abaixo em todas as páginas do seu site em que deseja rodar os demais formatos Video Commerce by StreamShop.
Você pode utilizar gerenciadores de Tags como o Google Tag Manager para facilitar esta tarefa.

SCRIPT SDK:
 
<!-- Do not change the order -->
<script async src=https://assets.streamshop.com.br/sdk-ads/liveshop-ads-video.min.js></script>
<script async src=https://assets.streamshop.com.br/sdk-ads/liveshop-ads-carousel.min.js></script>

Stories

Instale o código abaixo para incorporar o formato Stories na sua página.
No lugar de video-ID, insira o slug dos seus vídeos, encontrados na lista do StreamStudio.
Basta copiar o link e recortar somente o slug do vídeo desejado.

<liveshop-ads-carousel videos-width="80px" height="80px" border-radius="50%" gap="25px" slugs-video="video-ID,video-ID,video-ID,video-ID,video-ID,video-ID,video-ID,video-ID,video-ID"></liveshop-ads-carousel>

Observações: Você pode customizar a altura, largura e espaçamento do seu Stories, alterando os parâmetros 'width', 'height', 'gap' entre outros.

Carrossel

Instale o código abaixo para incorporar o formato Carrossel na sua página.
No lugar de video-ID, insira o slug dos seus vídeos, encontrados na lista do StreamStudio.
Basta copiar o link e recortar somente o slug do vídeo desejado.

  <liveshop-ads-carousel slugs-video="video-ID,video-ID,video-ID,video-ID,video-ID,video-ID,video-ID,video-ID,video-ID"></liveshop-ads-carousel>

Observações: Você pode customizar a altura, largura e espaçamento do seu Stories, alterando os parâmetros 'width', 'height', 'gap' entre outros.

Reels

Instale o código abaixo para incorporar um vídeo Reels na sua página.
No lugar de 'store-slug', insira o slug da sua conta.
Basta copiar o link e recortar somente o slug da sua conta e adicionar ao código abaixo.  

<iframe
	src="https://lite.streamshop.com.br/store-slug"
	style="border-radius: 16px; overflow: hidden"
	frameborder="0"
	height="680px"
	width="380px"
	allow="autoplay; playsinline; picture-in-picture; clipboard-read; clipboard-write; microphone; camera; fullscreen; "
></iframe>

Observações: Você pode customizar a altura, largura e espaçamento do seu Stories, alterando os parâmetros 'width', 'height', 'gap' entre outros.