---
url: "/pt/emailify/design/presets.md"
description: "O jeito mais rápido de começar a adicionar componentes de layout ao seu e-mail é adicionar componentes de design comuns direto pelo plugin Emailify."
---

# Adicionar componentes iniciais do Emailify ao seu e-mail

> O jeito mais rápido de começar a adicionar componentes de layout ao seu e-mail é adicionar componentes de design comuns direto pelo plugin Emailify.

[Video](/assets/videos/emailify/design/add-preset-components.mp4)

Para navegar pelos componentes disponíveis no plugin Emailify, clique em qualquer uma das abas de categoria abaixo da barra de cabeçalho do plugin. Cada aba mostra os componentes da categoria, e você pode rolar para cima e para baixo para ver as subcategorias da aba selecionada.

> **Note:** Para reordenar uma linha adicionada a partir das predefinições, clique e arraste a linha para cima ou para baixo dentro do frame contêiner do Emailify (que tem Auto Layout ativado) para mudar a posição dela.

## Navegar pela biblioteca de componentes externa {#browsing-the-external-component-library}

### Vídeo tutorial: usar mais de 500 componentes de e-mail HTML grátis nos seus designs do Figma

Este vídeo mostra como usar mais de 500 componentes de e-mail HTML grátis nos seus designs do Figma com o plugin Emailify para Figma.
[Embedded media](https://www.youtube-nocookie.com/embed/zMUQ3tE76Vo)

[Video](/assets/videos/emailify/design/external-component-library.mp4)

Além dos componentes incluídos no plugin Emailify, você pode navegar por componentes de bibliotecas externas e usá-los pelo app web do Emailify. Assim, você tem acesso a uma variedade maior de componentes de e-mail prontos, que podem ser copiados direto para os seus designs do Figma.

Para usar componentes da biblioteca externa:

1. Acesse o [app web do Emailify](https://emailify.hypermatic.com) para ver o catálogo completo de componentes de e-mail disponíveis
2. Filtre os componentes por categoria ou por uso em templates, ou pesquise elementos específicos
3. Clique no botão **Copy Figma Component** de qualquer componente para copiar o snippet HTML dele para a área de transferência
4. No Figma, selecione o frame do Emailify em que você quer colar o componente
5. Cole o componente direto no frame do Emailify com **Cmd+V** (Mac) ou **Ctrl+V** (Windows)

O componente colado se integra automaticamente ao seu design de e-mail e pode ser personalizado como qualquer outro componente do Emailify.

> **Note:** Os componentes externos usam a estrutura de Auto Layout do Emailify. Arraste um componente para cima ou para baixo dentro do frame contêiner do Emailify para reordená-lo.

## Categorias de componentes iniciais {#starter-component-categories}

O Emailify organiza os componentes em algumas categorias (e subcategorias) para facilitar a busca pelo que você precisa no seu design de e-mail.

### Cabeçalhos (Headers) {#headers}

Normalmente usados no topo do e-mail; podem ser componentes como um logotipo da marca, links “ver on-line”, um menu de navegação, ícones de redes sociais etc.

### Imagens (Images) {#images}

São componentes para exibir conteúdo em imagem, como uma imagem de largura total, uma imagem de fundo (para colocar texto por cima), uma grade de logotipos, cards com imagem, grades e legendas.

### Conteúdo (Content) {#content}

Inclui componentes baseados em texto, como parágrafos, citações, depoimentos, avatares de autores, cards de artigos, ícones de recursos, estatísticas, códigos promocionais e cards de produtos.

### Ecomm (e-commerce) {#ecomm-e-commerce}

Oferece alguns componentes comuns que podem ser usados para exibir produtos ou elementos relacionados a um e-mail pós-checkout, e também inclui alguns componentes específicos do Klaviyo para exibir grades dinâmicas de produtos nessa plataforma.

### CTAs (chamadas para ação) {#ctas-call-to-action}

Esses componentes servem principalmente para pedir que o usuário clique em algo ou realize uma ação; podem ser componentes como botões, links, heroes com imagem de fundo, miniaturas de vídeo, blocos de recursos, botões de lojas de apps, ícones de redes sociais e heroes de produtos.

### Rodapé (Footer) {#footer}

Normalmente usado na parte de baixo do e-mail; podem ser componentes para exibir o logotipo e o endereço da sua marca, links de redes sociais, links de cancelamento de inscrição ou botões para baixar apps.

> **Tip:** Todos os componentes que você adiciona em outra categoria são automaticamente “salvos” na categoria Favourites, para que seja fácil encontrá-los de novo depois. Você também pode remover qualquer componente dos favoritos clicando no ícone **Trash**; isso remove o componente da sua lista de favoritos, mas não o “exclui” das outras categorias.
