Usar componentes de conteúdo content-components

Ao criar seu conteúdo de email, os componentes de Conteúdo permitem personalizar seu email com componentes brutos e vazios que você pode usar depois de colocados em um email.

Você pode adicionar quantos Conteúdos forem necessários dentro de uma Estrutura, que define o layout do seu email.

Adicionar componentes de conteúdo add-content-components

Para adicionar componentes de conteúdo ao seu email e ajustá-los às suas necessidades, siga as etapas abaixo.

  1. No Designer Email, use um conteúdo existente ou arraste e solte uma Estrutura no conteúdo vazio para definir o layout do seu email. Saiba como

  2. Arraste e solte o Conteúdo de sua escolha dentro das estruturas relevantes.

    Captura de tela que mostra como arrastar e soltar componentes de conteúdo em estruturas no Designer de Email. {modal="regular"}

    note note
    NOTE
    É possível adicionar vários componentes em uma única estrutura e em cada coluna de uma estrutura.
  3. Ajuste as opções de cada componente usando a guia contextual Configurações. Por exemplo, escolha exibi-lo somente em dispositivos móveis ou de desktop, ou ambos. Você também pode gerenciar opções de link nesta guia. Saiba mais sobre como gerenciar links

  4. Ajuste os atributos de estilo para cada componente usando a guia Style. Por exemplo, altere o estilo do texto, o preenchimento ou a margem de cada componente. Saiba mais sobre alinhamento e preenchimento

    Captura de tela mostrando a guia de configurações para componentes de conteúdo no Designer de Email. {modal="regular"}

  5. No menu avançado do seu Conteúdo no painel direito, exclua ou duplique qualquer componente de conteúdo, conforme necessário.

Container container

É possível adicionar um container simples dentro do qual você adiciona outro componente de conteúdo. Isso permite aplicar um estilo específico ao contêiner, que é diferente do componente usado dentro dele.

Por exemplo, adicione um componente Container e, em seguida, adicione um componente Botão dentro desse container. Use um fundo específico para o contêiner e outro para o botão.

Captura de tela mostrando como adicionar um componente de contêiner no Designer de email. {modal="regular"}

Botão buttons

Use o componente Botão para inserir um ou vários botões no email e redirecionar o público-alvo do email para outra página.

  1. A partir da lista Conteúdos, arraste e solte o componente Botão em um componente Estrutura.

    Captura de tela que mostra como arrastar e soltar um componente de botão no Designer de Email. {modal="regular"}

  2. Clique no botão recém-adicionado para personalizar o texto e acessar as guias Configurações e Estilos.

    Captura de tela mostrando a guia de configurações para componentes de botão no Designer de Email. {modal="regular"}

  3. Na guia Configurações, no campo URL, adicione a URL para a qual redirecionar ao clicar no botão.

  4. Escolha como o conteúdo será exibido usando a lista suspensa Target:

    • Nenhum: abre o link no mesmo quadro em que foi clicado (padrão).
    • Branco: abre o link em uma nova janela ou guia.
    • Auto: abre o link no mesmo quadro em que foi clicado.
    • Principal: abre o link no quadro principal.
    • Superior: abre o link no corpo completo da janela.

    Captura de tela mostrando as opções de direcionamento para componentes de botão no Designer de Email. {modal="regular"}

  5. Personalize ainda mais seu botão alterando atributos de estilo como Borda, Tamanho, Margem e outros da guia Estilos.

Texto text

Use o componente Texto para inserir texto no email e ajustar o estilo (borda, tamanho, preenchimento etc.) usando as guias Configurações e Estilos.

  1. No menu Conteúdo, arraste e solte Texto em um componente Estrutura.

    Captura de tela mostrando como arrastar e soltar um componente de texto no Designer de email. {modal="regular"}

  2. Clique no componente recém-adicionado para personalizar o texto e acessar as guias Configurações e Estilos.

  3. Altere o texto com as seguintes opções disponíveis na barra de ferramentas contextual:

    Captura de tela mostrando a barra de ferramentas de edição de texto no Designer de email. {modal="regular"}

    • Alterar estilo do texto: aplique negrito, itálico, sublinhado ou tachado ao texto.
    • Alterar alinhamento: escolha entre alinhamento à esquerda, à direita, centralizado ou justificado para o texto.
    • Criar lista: adicionar listas de marcadores ou números ao texto.
    • Definir cabeçalho: adicione até seis níveis de cabeçalho ao texto.
    • Tamanho da fonte: selecione o tamanho da fonte do texto em pixels.
    • Editar imagem: adicione uma imagem ou um ativo ao seu componente de texto.
    • Mostrar o código-fonte: exibir o código-fonte do texto. Ele não pode ser modificado.
    • Duplicar: adicione uma cópia do seu componente de texto.
    • Excluir: exclua o componente de texto selecionado do seu email.
    • Adicionar personalização: adicione campos de personalização para personalizar o conteúdo dos dados de seus perfis.
    • Habilitar conteúdo condicional: adicione conteúdo condicional para adaptar o conteúdo do componente aos perfis direcionados.
  4. Ajuste outros atributos de estilo, como cor do texto, família da fonte, borda, preenchimento, margem e outros, na guia Estilos.

    Captura de tela mostrando a guia de estilos para componentes de texto no Designer de Email. {modal="regular"}

Divisor divider

Use o componente Divisor para inserir uma linha divisória para organizar o layout e o conteúdo do email.

Você pode ajustar atributos de estilo, como cor da linha, estilo e altura, na guia Estilos.

Captura de tela mostrando como adicionar um componente divisor no Designer de email. {modal="regular"}

HTML HTML

Use o componente HTML para copiar e colar partes do HTML existente. Isso permite criar componentes modulares gratuitos do HTML para reutilizar conteúdo externo.

  1. De Componentes, arraste e solte o componente HTML em um Componente Estrutura.

    Captura de tela que mostra como arrastar e soltar um componente do HTML no Designer de email. {modal="regular"}

  2. Clique no componente recém-adicionado e selecione Mostrar o código-fonte na barra de ferramentas contextual para adicionar o HTML.

    Captura de tela mostrando a opção de código-fonte para componentes do HTML no Designer de email. {modal="regular"}

NOTE
Para tornar o conteúdo externo compatível com o Email Designer, a Adobe recomenda criar uma mensagem do zero e copiar o conteúdo do email existente para os componentes.

Imagem image

IMPORTANT
O acesso ao menu do Assets é limitado aos usuários com uma licença ativa do Adobe Experience Manager as a Cloud Service. Se você não tiver essa licença, o menu do Assets não estará disponível.

Use o componente Imagem para inserir um arquivo de imagem do seu computador no email.

  1. No menu Conteúdo, arraste e solte a Imagem em um componente de Estrutura.

    Captura de tela que mostra como arrastar e soltar um componente de imagem no Designer de email. {modal="regular"}

  2. Clique em Procurar para escolher um arquivo de imagem de seus ativos. Você também pode optar por Importar sua mídia.

    Para saber mais sobre como carregar e adicionar ativos no Adobe Experience Manager, consulte a documentação do Adobe Experience Manager as a Cloud Service.

    Captura de tela mostrando a opção de navegação para componentes de imagem no Designer de Email. {modal="regular"}

  3. Navegue pelas pastas para localizar o ativo específico necessário ou use a barra de pesquisa para localizá-lo com eficiência.

    Depois de encontrar o ativo que você está procurando, clique em Selecionar.

    Captura de tela mostrando o processo de seleção de ativos no Designer de email. {modal="regular"}

  4. Clique no componente recém-adicionado e configure as propriedades da imagem usando a guia Configurações:

    • O título da imagem permite que você defina um título para a imagem.
    • Texto alternativo permite definir a legenda vinculada à imagem. Isso corresponde ao atributo HTML alternativo.

    Captura de tela mostrando a guia de configurações para componentes de imagem no Designer de Email. {modal="regular"}

  5. Adicione um link para redirecionar o público-alvo para outro conteúdo. Saiba mais

  6. Ajuste outros atributos de estilo como margem, borda e outros usando a guia Estilos.

Social social

Use o componente Social para inserir links às páginas de redes sociais no seu conteúdo de email.

  1. A partir do menu Componentes, arraste e solte o componente Social em um componente Estrutura.

  2. Clique no componente recém-adicionado.

  3. No campo Social da guia Configurações, escolha qual rede social deseja adicionar ou remover.

    Captura de tela mostrando a guia de configurações para componentes sociais no Designer de email. {modal="regular"}

  4. Escolha o tamanho dos ícones no campo Tamanho das imagens.

  5. Clique em cada um dos ícones de redes sociais para configurar o URL para o qual o público-alvo é redirecionado.

    Captura de tela mostrando a configuração de URL para ícones de redes sociais no Designer de email. {modal="regular"}

  6. Altere os ícones de cada uma de suas redes sociais, se necessário, no campo Source.

  7. Ajuste outros atributos de estilo, como estilo, margem, borda e outros, na guia Estilos.

recommendation-more-help
c39c2d00-ba9a-424b-adf9-66af58a0c34b