--- url: "/pt/emailify/content/gifs.md" description: "Adicione GIFs animados do seu computador aos designs de e-mail como imagens inline (dentro de uma Column) ou de fundo (em uma Row, Hero ou Wrapper)." --- # Adicionar GIFs animados aos seus designs de e-mail > Adicione GIFs animados do seu computador aos designs de e-mail como imagens inline (dentro de uma Column) ou de fundo (em uma Row, Hero ou Wrapper). ### Vídeo tutorial: adicione GIFs animados do Figma às exportações de e-mail HTML Este vídeo mostra como adicionar GIFs animados aos seus designs de e-mail e exportar do Figma e-mails HTML responsivos e prontos para produção com o plugin Emailify. [Embedded media](https://www.youtube-nocookie.com/embed/Jmy2Tuzzwjg) > **Warning:** Fazer upload de imagens GIF animadas exige uma licença Emailify Pro. > **Note:** Se você estiver usando a versão de teste grátis do plugin, os GIFs serão enviados como imagens estáticas. Outra opção é usar **Export HTML** com o botão **Upload** em **off** para exportar e baixar localmente os arquivos `.gif` animados junto com os seus e-mails HTML. ## Adicionar um GIF animado como imagem de conteúdo dentro das camadas Column {#add-an-animated-gif-as-a-content-image-inside-your-column-layers} [Video](/assets/videos/emailify/content/inline-animated-gif.mp4) Você pode arrastar e soltar um arquivo `.gif` do seu computador em qualquer camada **Column**, e ele será adicionado como uma camada de conteúdo de imagem do Figma. Para manter a qualidade do GIF, redimensione a camada proporcionalmente (segurando a tecla **Shift** enquanto redimensiona a camada no Figma) para preservar a proporção original. Assim, o Emailify consegue usar os dados do arquivo GIF original nas exportações. Se você mudar a proporção da camada no Figma para algo diferente do GIF original, o Emailify precisará recriar os frames do GIF em um arquivo `.gif` totalmente novo para refletir a área cortada da imagem (já que os clientes de e-mail HTML não são compatíveis com corte via CSS). Isso gera arquivos GIF maiores e exportações mais lentas. ## Por que o GIF exportado é maior que o GIF original? {#why-is-my-exported-gif-larger-than-the-original-gif} Se você mudar a proporção da camada do GIF no Figma, o Emailify precisa recriar os frames do GIF em um novo arquivo `.gif` para que o e-mail exportado corresponda à área cortada da imagem. Os clientes de e-mail HTML não são compatíveis com corte via CSS em GIFs da mesma forma que as pré-visualizações do Figma, então recriar os frames pode aumentar o tamanho final do arquivo e deixar a exportação mais lenta. Para manter o GIF exportado mais próximo do tamanho do arquivo original, redimensione o GIF proporcionalmente e mantenha a proporção original. > **Tip:** Você pode definir o atributo de [texto alternativo](/pt/emailify/content/alt-text) ou adicionar um [link de URL clicável](/pt/emailify/content/link-images) às suas imagens usando o botão Settings no cabeçalho do plugin. > **Note:** O Emailify tenta detectar automaticamente se o seu GIF tem fundo transparente. Se o seu GIF precisar de transparência e o plugin não detectar isso sozinho, adicione a palavra **Transparent** em qualquer parte do nome da camada no Figma (por exemplo, `My Layer Name - Transparent`) para forçar a exportação com fundo transparente. O formato GIF só aceita 0% ou 100% de opacidade, sem nada entre os dois. Isso significa que você pode ter um GIF animado com fundo totalmente transparente atrás de elementos totalmente opacos e visíveis. Ou seja, as camadas precisam ser totalmente transparentes ou não: qualquer camada com opacidade abaixo de 50% fica transparente, e qualquer camada com opacidade acima de 50% fica opaca. ## Adicionar um GIF animado como imagem de fundo em uma camada Row, Hero ou Wrapper {#add-an-animated-gif-as-a-background-image-on-a-row-hero-or-wrapper-layer} [Video](/assets/videos/emailify/content/gif-background-image.mp4) Se você precisar usar um GIF animado como imagem de fundo atrás de conteúdo em rich text _real_, arraste um arquivo `.gif` do seu computador para o preenchimento do Figma de qualquer frame Row, Hero ou Wrapper. Ele será definido como preenchimento de imagem no fundo do frame. Os outros preenchimentos do Figma desse frame (por exemplo, sobreposições de cor ou gradiente) também serão incluídos na exportação final do `.gif`. A vantagem é que as camadas de conteúdo dentro do frame continuam sendo renderizadas como camadas de rich content individuais na exportação do seu e-mail HTML, por cima do fundo com GIF animado. > **Note:** O Emailify tenta detectar automaticamente se o seu GIF tem fundo transparente. Se o seu GIF precisar de transparência e o plugin não detectar isso sozinho, adicione a palavra **Transparent** em qualquer parte do nome da camada no Figma (por exemplo, `My Layer Name - Transparent`) para forçar a exportação com fundo transparente. O formato GIF só aceita 0% ou 100% de opacidade, sem nada entre os dois. Isso significa que você pode ter um GIF animado com fundo totalmente transparente atrás de elementos totalmente opacos e visíveis. Ou seja, as camadas precisam ser totalmente transparentes ou não: qualquer camada com opacidade abaixo de 50% fica transparente, e qualquer camada com opacidade acima de 50% fica opaca. > **Warning:** **GIFs animados no Outlook:** embora a maioria dos clientes de e-mail [seja compatível com GIFs animados](https://www.caniemail.com/features/image-gif/), o Outlook _2019 e versões anteriores_ só exibe o **primeiro frame** do GIF, em vez de reproduzir a animação. Garanta que esse frame tenha as imagens ou o texto principais para que ele funcione como alternativa estática. No **Outlook com Office 365**, os GIFs são reproduzidos automaticamente _três vezes_ e depois pausam, com um _botão de play_ para repetir.