--- url: "/pt/emailify/integrations/customer-io.md" description: "Faça upload pela API do Customer.io de e-mails ou templates reutilizáveis para o Design Studio, ou exporte um ZIP para copiar o HTML manualmente." --- # Fazer upload dos e-mails para o Customer.io > Faça upload pela API do Customer.io de e-mails ou templates reutilizáveis para o Design Studio, ou exporte um ZIP para copiar o HTML manualmente. ### Vídeo tutorial: fazer upload dos e-mails para o Customer.io Este vídeo mostra como fazer o upload manual de e-mails HTML do plugin Emailify para Figma para o Customer.io. [Embedded media](https://www.youtube-nocookie.com/embed/KQyaQy6gYps) O Emailify tem duas opções de exportação para o Customer.io: - **Customer.io (API)** faz o upload dos e-mails direto para o Design Studio do Customer.io como e-mails ou como templates de e-mail reutilizáveis. - **Customer.io (Zip)** exporta um arquivo ZIP que você pode copiar manualmente para o Customer.io. ## Fazer upload direto para o Design Studio do Customer.io {#uploading-directly-to-customer-io-design-studio} No painel de exportação do Emailify, selecione a opção **Customer.io (API)** na lista suspensa, cole uma [App API Key](https://docs.customer.io/integrations/api/app/) válida do Customer.io e escolha a região do Customer.io correspondente ao seu workspace. > **Note:** Se o seu workspace do Customer.io estiver hospedado na UE, escolha a região **EU** no Emailify. Caso contrário, mantenha selecionada a região padrão **US**. Use a configuração **Upload As** para escolher se o Emailify cria templates de e-mail reutilizáveis ou e-mails normais do Design Studio no Customer.io. O padrão é **Template**, para manter a compatibilidade com versões anteriores. Quando estiver tudo pronto, clique no botão **Upload To Customer.io** para começar a exportar para HTML os e-mails selecionados no Figma e fazer o upload automático deles para o Design Studio do Customer.io. > **Note:** Você vai precisar de uma App API key do Customer.io que possa criar e-mails do Design Studio no seu workspace do Customer.io. Ao fazer upload pela API do Customer.io, o Emailify envia por padrão as imagens de e-mail compatíveis para o [Customer.io Assets](https://docs.customer.io/integrations/api/app/#tag/assets/createAsset). Ele usa uma pasta `emailify` no Customer.io Assets e cria essa pasta automaticamente se ela ainda não existir. As imagens que o Customer.io Assets não aceita, incluindo as que passam do limite de 2 MB por arquivo do Customer.io, são enviadas para a Hypermatic como alternativa, para que o e-mail ou template do Design Studio ainda possa referenciar uma URL de imagem hospedada. ## Atualizar e-mails e templates do Customer.io enviados pelo Emailify {#updating-customer-io-emails-and-templates-uploaded-from-emailify} Se quiser que os seus e-mails ou templates do Customer.io sejam _atualizados_ automaticamente, em vez de serem criados como novos itens a cada vez, ative a opção **Enable Updatable Templates** nas configurações de exportação do plugin (ou **Enable Updatable Emails** quando a configuração **Upload As** estiver definida como **Email**). Isso adiciona automaticamente um valor `customerioEmailId` ou `customerioTemplateId` ao nome da camada do frame do Figma enviado e reutiliza esse ID quando o mesmo frame for enviado de novo ao Customer.io pela API na próxima exportação do plugin. > **Tip:** Atenção: você precisa **conferir se a opção _Enable Updatable Templates_ ou _Enable Updatable Emails_ também está ativada _antes_ de fazer o upload inicial do e-mail ou do template**, porque é isso que adiciona o ID original do e-mail ou template do Customer.io ao nome do frame do Figma. Esse ID passa a ser usado em todos os uploads seguintes para atualizar o mesmo item na sua conta do Customer.io (em vez de criar um novo a cada vez), desde que a opção de atualização continue ativada. > **Note:** Para _atualizar_ e-mails ou templates no Customer.io, você precisa usar uma App API key do mesmo workspace e da mesma região do Customer.io que receberam o upload original. ## Fazer o upload manual de uma exportação ZIP para o Customer.io {#manually-uploading-a-zip-export-to-customer-io} No painel de exportação do Emailify, selecione a opção **Customer.io (Zip)** na lista suspensa. Quando estiver tudo pronto, clique no botão **Export For Customer.io** para começar a exportar para HTML os e-mails selecionados no Figma. Quando a exportação terminar, baixe o arquivo .zip para o computador e descompacte. Abra o arquivo `index.html` dentro da pasta com o nome do seu e-mail em um editor de código ou de texto, copie todo o HTML do arquivo e depois: - [Entre](https://fly.customer.io/login) na sua conta do Customer.io. - Expanda o item de menu **Content** na navegação de administração. - Clique no item de menu **Email Layouts**. - Clique no botão **Create Layout**. - Clique na opção **Start from scratch**. - Dê um nome ao layout e clique em **Create Layout**. - Cole o HTML copiado do arquivo index.html exportado no editor da aba **Edit**. - Clique no botão **Save changes**. ## Criar um layout totalmente em branco no Customer.io {#creating-a-totally-blank-layout-in-customer-io} > **Warning:** **Confira se você está usando um layout totalmente em branco!** Por padrão, o Customer.io adiciona automaticamente as próprias tags HTML extras (por exemplo, head, body etc.) a todo layout novo. Você precisa remover esse código; caso contrário, o template HTML vai aparecer quebrado quando for enviado. No Customer.io, ao começar a criar um e-mail, você precisa selecionar um [Layout](https://customer.io/docs/journeys/3-layouts-and-customerio/), e ele precisa estar totalmente em branco para que o seu template HTML personalizado seja a única coisa renderizada. ![Seleção de um layout de e-mail no Customer.io](/assets/images/emailify/customer-io-one.jpg) Como você pode ver na captura de tela abaixo, um **Layout** que parece em branco não está realmente em branco (ele inclui automaticamente as tags ``, que envolvem o conteúdo do seu template HTML). ![HTML padrão em um layout do Customer.io](/assets/images/emailify/customer-io-two.jpg) Para resolver, remova manualmente todo o HTML que o Customer.io adiciona ao Layout em branco e deixe apenas a tag `content` (abaixo). ![Layout do Customer.io em branco apenas com a tag content](/assets/images/emailify/customer-io-three.jpg) Depois que o **Layout** for salvo e contiver apenas a tag `content`, o seu template HTML personalizado deve ser renderizado como esperado.