Pular para o conteúdo
Português - Brasil
  • Não há sugestões porque o campo de pesquisa está em branco.

Como fazer incorporação da live e utilizar o recurso de picture in picture?

Você pode incorporar sua live do Live-Co diretamente no seu site, landing page ou plataforma externa utilizando dois formatos:

  • Picture-in-Picture (PIP): player flutuante que acompanha o usuário enquanto ele navega pelo site.

  • Embed (Iframe Responsivo): player fixo incorporado diretamente na página.

Ambas as opções utilizam o domínio base:

 
https://dash.live-co.app/go/

e o ID da live (liveId), que identifica qual transmissão será exibida.

Atualização importante (obrigatória)

A partir de 2025, para garantir o funcionamento correto do player, do PIP e da sincronização entre sessões, passou a ser obrigatório utilizar o parâmetro:

 
only_live: true

Os parâmetros username e useremail são opcionais, porém altamente recomendados, pois ajudam a:

  • manter a sessão ativa entre PIP e iframe;

  • evitar que o sistema solicite o preenchimento de dados repetidamente;

  • melhorar a identificação do usuário;

  • garantir melhor funcionamento de fluxos B2B.

1. Picture-in-Picture (PIP)

O PIP exibe a live em uma janela flutuante que permanece visível enquanto o usuário navega pela página.

Código (inserir antes de </body>)

<script>
window.embeddedLiveConfig = {
liveId: "XXX",
domain: "https://dash.live-co.app/go/",
only_live: true,
username: "",
useremail: ""
};
</script>

<script
defer
src="https://dash.live-co.app/live-co-embed.js"
liveId="XXX"
domain="https://dash.live-co.app/go/">
</script>

Observações

  • liveId: identificador único da live.

  • only_live: obrigatório para funcionamento correto do PIP.

  • username e useremail: opcionais. Podem ser preenchidos automaticamente se o usuário já estiver logado no seu sistema.

  • Caso não sejam informados, o Live-Co poderá solicitar esses dados ao usuário.

2. Embed (Iframe Responsivo)

Use este formato quando quiser que a live apareça fixa dentro da página, como um player tradicional.

Código

<div class="container" style="position: relative; width: 100%; height: 0; padding-bottom: 56.25%;">
<iframe
src="https://dash.live-co.app/go/XXXXX?embed=true&only_live=true&username=NOME_DO_USUARIO&useremail=EMAIL_DO_USUARIO"
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
frameborder="0"
allowfullscreen>
</iframe>
</div>

Observações

  • O padding-bottom: 56.25% garante proporção 16:9 (responsivo).

  • O player se ajusta automaticamente à largura da tela.

  • username e useremail são opcionais, mas recomendados.

  • Caso não sejam informados, o sistema solicitará os dados ao usuário.

Configuração técnica (avançado)

Esta seção é indicada para times técnicos ou integrações customizadas.

Parâmetros obrigatórios

Parâmetro Descrição
liveId Identificador único da live
domain Domínio base do Live-Co
only_live Deve ser true para exibir apenas conteúdo ao vivo

 

A ausência do parâmetro only_live: true pode causar problemas como:

  • falha na comunicação entre PIP e iframe;
  • solicitação repetida de dados ao usuário;
  • comportamento inconsistente do player.

Parâmetros opcionais

Parâmetro Descrição
username Nome do usuário
useremail E-mail do usuário
usercnpj CNPJ do cliente (cenários B2B)

Esses parâmetros funcionam de forma dinâmica:

  • Se não forem enviados, o sistema solicitará os dados apenas uma vez;

  • As informações preenchidas serão usadas para manter a sessão integrada entre PIP e iframe;

  • Se forem enviados, o sistema utilizará diretamente os valores informados.

Exemplo completo – Embed via script

 <script>
window.embeddedLiveConfig = {
liveId: "12022510125255",
domain: "https://dash.live-co.app/go/",
only_live: true,
username: "NOME_DO_USUARIO",
useremail: "EMAIL_DO_USUARIO",
usercnpj: "CNPJ_DO_USUARIO"
};
</script>

<script defer src="https://dash.live-co.app/live-co-embed.js"></script>

Exemplo completo – Embed via iframe

<iframe
  src="https://dash.live-co.app/go/12022510125255?embed=true&only_live=true&username=NOME_DO_USUARIO&useremail=EMAIL_DO_USUARIO"
  style="width: 100%; height: 100%;">
</iframe>

Boas práticas

  • Utilize sempre HTTPS.

  • Teste a integração em ambiente de homologação antes de publicar.

  • No WordPress, utilize o bloco HTML personalizado.

  • Em plataformas externas (RD Station, Unbounce, LeadLovers etc.), utilize preferencialmente o iframe (Embed).

  • Para integrações com login próprio ou B2B, recomenda-se o envio de username, useremail e usercnpj.

Para dúvidas adicionais ou apoio, entre em contato com o Suporte pelo WhatsApp:

📱 +55 11 4858-9359
 ou  Clique aqui