# Código de incorporação

> Saiba como códigos de incorporação permitem que criadores adicionem conteúdo interativo — como vídeos, formulários e widgets de checkout — a sites e páginas de destino.

Canonical URL: https://crevio.co/pt/glossary/embed-code

##  O que é um código de incorporação?

Um código de incorporação é um trecho de HTML ou JavaScript que permite exibir conteúdo de uma plataforma dentro de outro site ou página. Criadores usam códigos de incorporação para adicionar vídeos, botões de checkout, formulários de inscrição e outros elementos interativos aos seus sites, [páginas de destino](/pt/glossary/landing-page) e [páginas de vendas](/pt/glossary/sales-page).

## Como funcionam os códigos de incorporação

1. **Gerar código**: Copie o código de incorporação da plataforma de origem
2. **Colar no editor**: Adicione o código ao seu site ou construtor de páginas
3. **Exibir conteúdo**: O conteúdo incorporado aparece na sua página
4. **Permanece atualizado**: Alterações na origem são refletidas automaticamente na sua página

## Tipos comuns de incorporação para criadores

### Incorporações de vídeo
- Vídeos do YouTube ou Vimeo
- [Cartas de vendas em vídeo](/pt/glossary/video-sales-letter)
- Trechos de prévia do curso
- Vídeos de depoimentos

### Checkout & Pagamento
- Botões de compra de produtos
- Formulários de checkout
- Widgets de pagamento
- Botões 'Comprar agora'

### Formulários e inscrições
- [Lista de e-mails](/pt/glossary/email-list) formulários de inscrição
- Incorporações de pesquisas e questionários
- Formulários de contato
- [Ímã de leads](/pt/glossary/lead-magnet) inscrições

### Prova social
- Carrosséis de depoimentos
- Widgets de avaliações
- Feeds de redes sociais
- Notificações de compras ao vivo

### Agendamento
- Widgets de agendamento de calendário
- Sistemas de agendamento de consultas
- Inscrição em eventos

### Comunidade
- Widgets de chat
- Seções de comentários
- Feeds sociais
- Players de transmissão ao vivo

## Exemplos de código de incorporação

### Incorporação iFrame

```html
<iframe src="https://platform.com/content"
        width="100%"
        height="400"
        frameborder="0">
</iframe>
```

### Incorporação por script

```html
<script src="https://platform.com/widget.js"></script>
<div data-widget-id="12345"></div>
```

### Incorporação de botão

```html
<a href="https://checkout.platform.com/product"
   class="buy-button">
   Buy Now - $97
</a>
```

## Melhores práticas

### Desempenho
- Incorpore apenas o que for necessário
- Considere carregamento preguiçoso (lazy loading) para conteúdo abaixo da dobra
- Teste a velocidade da página após adicionar incorporações
- Use carregamento assíncrono de scripts quando disponível

### Segurança
- Incorpore apenas de fontes confiáveis
- Use fontes HTTPS para incorporações
- Tenha cautela com incorporações em JavaScript
- Revise permissões e compartilhamento de dados

### Responsividade móvel
- Use opções de incorporação responsivas
- Teste em vários dispositivos
- Defina valores de largura/altura apropriados
- Use larguras em porcentagem quando possível

### Experiência do usuário
- Garanta que as incorporações carreguem rapidamente
- Forneça conteúdo de fallback quando possível
- Não sobrecarregue as páginas com muitas incorporações
- Teste a funcionalidade regularmente

## Problemas comuns de incorporação

### Problemas de exibição
- Contêiner pequeno demais para o conteúdo
- Problemas de responsividade em dispositivos móveis
- Conflitos de estilo com o CSS da página
- Falhas no carregamento

### Problemas de funcionalidade
- Restrições de origem cruzada (CORS)
- Avisos de conteúdo misto em HTTPS
- Conflitos de JavaScript
- Bloqueadores de pop-up

## Incorporações específicas de plataforma

Diferentes plataformas oferecem várias opções de incorporação:
- **Hospedagem de vídeo**: YouTube, Vimeo, Wistia
- **Pagamentos**: Stripe, PayPal, Gumroad
- **E-mail**: ConvertKit, Mailchimp, Beehiiv
- **Agendamento**: Calendly, TidyCal, SavvyCal
- **Comunidade**: widgets do Discord, incorporações do Circle

## Alternativas à incorporação

Quando incorporações não são ideais:
- **Links diretos**: URLs simples para conteúdo externo
- **Capturas de tela com links**: Imagens estáticas que linkam para conteúdo ao vivo
- **Integrações nativas**: Conexões integradas da plataforma
- **[Webhooks](/pt/glossary/webhook)**: Sincronização de dados nos bastidores