Pular para o conteúdo principal

Adicionar cartões aos vídeos

Esse recurso requer uma assinatura Business, Premium, Standard, Advanced ou Enterprise.

Os cartões são uma camada personalizável em estilo de notificação que os membros do Vimeo podem configurar para aparecer durante a reprodução de seus vídeos incorporados ou não listados. Você pode criar cartões tão simples quanto um título ou optar por detalhá-los com uma descrição, uma miniatura e um link para qualquer destino.

Neste artigo:

Configurando cartões em seus vídeos

Para adicionar ou editar cartões para um dos seus vídeos, vá para a aba de Ferramentas de interação nas configurações de vídeo. Embaixo da seção Durante o vídeo, clique em + Cartões, formulário de contato e, em seguida, selecione “Cartão” no menu suspenso para ver os campos para preencher seu cartão.

No mínimo, você precisa inserir um título para seu cartão e o carimbo de data/hora para quando quiser que ele apareça pela primeira vez durante o vídeo. Você também tem a opção de adicionar uma descrição, link e miniatura de foto. Conforme você está editando seu cartão, você verá a atualização de pré-visualização do player em tempo real. A menor duração de tempo que os cartões podem ser adicionados ao lado do outro é de seis segundos.

Quando você acabar de editar o seu cartão, aperte o botão Adicionar.Você pode adicionar até um cartão por segundo do seu vídeo. Quando você acabar de edição suas configurações de incorporação, aperte o botãoSalvar.

⚠️Nota: adicionar um cartão ao seu vídeo desativa os controles Curtir, Assistir Depois e Compartilhar.

Visualizando cartões

A experiência de visualização de vídeos com cartões será diferente dependendo da plataforma em que o vídeo é compartilhado e do dispositivo usado para visualizá-lo.

⚠️ Nota: As cartas só serão exibidas em jogadores com, no mínimo, 600 px de largura no modo horizontal (jogadores padrão) e 225 px de largura no modo vertical (jogadores em que a altura é maior que a largura).

Os cartões permanecem no canto superior direito do vídeo por seis segundos após aparecerem pela primeira vez, a menos que você tenha adicionado outro cartão para aparecer nessa janela. Vídeos com cartões são reproduzidos em linha em qualquer lugar em que estejam incorporados. Eles também aparecem na página do vídeo no Vimeo se a configuração de privacidade for "Privada" ou "Não listada".

 

Uma captura de tela de um reprodutor de vídeo. Há um cartão exibido no canto superior direito do vídeo. 

Em sites como Wix, Squarespace e WordPress, vídeos com cartões são reproduzidos em linha na web móvel. No Facebook e no Twitter, os aplicativos móveis e a web móvel serão vinculados à página de vídeo vimeo.com.

Análise de engajamento para cartões

No painel de análise na página do vídeo, você podeverificar o número de vezes que todos os cartões foram vistos e clicados nos últimos 30 dias. Saiba mais sobre análises para ferramentas de interação de vídeo no painel de análise de configuraçõesde vídeo.

Cartões em vitrines

Os cartões, bem como quaisquer outras ferramentas de interação de vídeo (como telas finais e formulários de contato) que você adicionou anteriormente, agora serão exibidos em sua vitrine.Depois de compartilhar sua apresentação, seus espectadores verão seus cartões ao assistirem à apresentação. Saiba mais em Vitrines do Vimeo.

Incorporar código para vídeos com cartões

O código regular de incorporação do Vimeo é um iframe simples. Para dar suporte aos cartões em todos os ambientes de visualização, acrescentamos um wrapper javascript para o código de incorporação regular. O novo código de incorporação é ágil e permite que o player mantenha sua proporção original sempre que a janela do navegador for redimensionada. Veja o exemplo do código de incorporação abaixo, com o wrapper do javascript em negrito.

< div classe = "vimeo-espaço" style = "padding: 56.25% 0 0 0; posição: relativo; " >< iframe src = "https://player.vimeo.com/video/76979871" style = "height: 100%; à esquerda: 0; posição: absoluto; Top: 0; largura: 100%; "frameborder ="0"allowfullscreen de mozallowfullscreen de webkitallowfullscreen >< / iframe >< / div >< script src ="https://player.vimeo.com/api/player.js">< / script >


Se você incorporou um vídeo em que você acabou de adicionar cartões, você precisará atualizar o código de incorporação no seu site para incluir o wrapper javascript. Você pode acessar o novo código de incorporação depois de ter adicionado cartões no seu vídeo, clicando no botão do código de incorporação cinza, acima da visualização do player, nas suas configurações de incorporação.

Práticas recomendadas para compartilhamento de vídeos com cartões em plataformas sociais

Se você está incorporando um vídeo com cartões em plataformas sociais como Twitter ou Linkedin, você pode simplesmente colar na sua URL de vídeo do Vimeo no seu post, em vez de usar o código de incorporação do Vimeo.

Se você quiser compartilhar seu vídeo no Facebook ou Twitter, mas quiser que seu post seja vinculado ao seu próprio site em vez da página de vídeos do Vimeo, você precisará adicionar um código extra ao seu site. Saiba mais em “Otimize seu site para postagem em plataformas sociais”

Práticas recomendadas para incorporar vídeos com cartões

Se você está incorporando vídeos com cartões através de um construtor de sites como o Wix ou Squarespace, você vai querer ter certeza que o wrapper javascript não é removido do código de incorporação.  Também recomendamos evitar o uso de widgets para incorporar seus vídeos.

Se você estiver incorporando vários vídeos com cartões em uma página, recomendamos apenas adicionar o marcador do javascript <script src="https://player.vimeo.com/api/player.js"></script> em um dos vídeos na sua página.  Todos as incorporações subsequentes deverão incluir somente o novo marcador <div>.

Incluir o marcador de script javascript várias vezes pode ter um impacto no desempenho da sua página.

Para incorporar um vídeo com cartões usando criadores de sites comuns, siga estas etapas:

  • Wix
    • No editor do site Wix, clique em+Adicionar,selecionarMaisno final da lista, depois escolha a opçãoHTML
    • Clique nobotãoEntrar código acima do bloco cinza na sua página, para ativar o modo de edição
    • Certifique-se que a opção Códigoestá selecionada, depois cole o wrapper Javascript no seu código de incorporação do Vimeo
    • Clique no botão azulUpdate,depois publique as alterações no seu site
  • Squarespace
    • Entre no modo de edição na sua página do Squarespace e, em seguida, clique no ícone+Adicionar blocono canto superior direito da página
    • Role para baixo no menu até chegar ao cabeçalho Mais, e selecione a opção  </> Código
    • Cole o seu código de incorporação do Vímeo com o wrapper Javascript e, em seguida, toque no botão Aplicar
    • Quando você terminar de fazer todas as edições na sua página, clique emSalvar, no canto superior esquerdo
  • Wordpress
    • Selecione a guia de edição de HTML na sua postagem do Wordpress
    • Cole o código de incorporação do Vimeo com o wrapper Javascript 
    • Quando estiver pronto, bata clicar em Fazer Update no canto superior direito
  • Tumblr
    • SelecioneVídeosda seleção dos tipos de postagens
    • Selecionea opção Adicionar vídeos da web
    • Cole o seu código de incorporação do Vimeo com o wrapper Javascript
    • O player incorporado do Vimeo irá carregar e você terá a opção de adicionar texto para postagens do Tumblr
    • Quando estiver pronto, pressione o botão Postar. 

Artigos relacionados

=