Configurar as definições do modelo in-app

Estas configurações aplicam-se a todo o modelo in-app de uma só vez, em vez de a um único bloco.

Configurar o estilo de todo o modelo

As configurações do modelo controlam o estilo de todo o modelo in-app: tamanho e fundo do documento, aparência do pop-up e estilos padrão para os blocos.

Abra a aba Configurações no painel direito.

Seções disponíveis:

• Documento: largura, preenchimento, uma imagem de fundo, o espaçamento entre blocos e um raio de canto padrão para imagens. No editor in-app, um campo Margens laterais (px) abaixo do preenchimento define as margens laterais do pop-up.
• Esquema de cores: funções de cores nomeadas (cabeçalho, destaque, links, fundo, bordas e mais) que redesenham o modelo de uma só vez. Os blocos existentes mantêm as cores que você já definiu explicitamente. Ative a Variante de modo escuro para definir cores separadas para uma renderização escura do modelo.
• Tipografia: família de fontes e dimensionamento padrão para o texto no modelo.
• Pop-up: como a mensagem se posiciona sobre o fundo escurecido: raio do canto, mais a cor e opacidade da sobreposição.
• Padrões de bloco: estilos iniciais compartilhados para blocos que você adiciona posteriormente, para que o novo conteúdo corresponda ao modelo até que você substitua um bloco na tela.
• Padrões de colunas: espaçamento para cada layout de Colunas: preenchimento externo, preenchimento dentro de cada coluna e o espaçamento entre colunas.
• Padrões de cartão: aparência inicial para contêineres de Cartão que agrupam conteúdo no layout, aplicada até que você estilize um cartão individualmente.
• Padrões de grupo de botões: espaçamento e alinhamento quando vários botões estão juntos como um grupo.
• Padrões de botão: aparência inicial para novos blocos de Botão para que os CTAs permaneçam consistentes em todo o modelo até que você estilize um separadamente.
• Padrões de divisor: estilo de linha inicial, cor, espessura e largura para novos blocos de Divisor.

Os padrões são aplicados sempre que um bloco individual não os substitui.

Nota

A Variante de modo escuro está disponível nos SDKs para iOS e Web; o Android renderiza apenas a variante clara. Modelos salvos antes deste recurso têm apenas uma variante clara — abra e salve novamente um modelo para adicionar uma Variante de modo escuro. Imagens de fundo e de capa com uma cor incorporada no próprio arquivo não mudam de cor para o modo escuro; use uma imagem transparente ou uma imagem separada para o modo escuro, se necessário.

Nota

No editor in-app, a largura do Documento é chamada de Largura máxima (px), um teto e não a largura exibida na tela. A largura real é a largura da tela menos as margens laterais do pop-up, e uma dica abaixo do campo mostra essa largura efetiva resultante. Defina as margens com Margens laterais (px), logo abaixo de Preenchimento na mesma seção: ele grava um único valor simétrico para os dois lados, e um valor negativo é limitado a 0. Novos modelos in-app começam com 36 px, o que deixa o pop-up com cerca de 80% da largura da tela; edite o campo para mudar isso. No editor de email, não há campo de margens, e o mesmo campo de largura é chamado de Largura (px) e define a largura diretamente.

Nota

Não há configuração de altura. O pop-up cresce com seu conteúdo. Para uma mensagem em tela cheia, defina a Largura (Largura máxima no editor in-app) em Configurações e escolha Tela cheia em Configurações in-app.

Configurar a aparência do in-app no dispositivo

As Configurações in-app controlam como a mensagem aparece e se comporta no dispositivo: posição, animações, gestos de deslizar e o botão de fechar. Essas configurações se aplicam apenas ao iOS e Android Nativo.

Clique em Configurações in-app na barra superior.

Posição na tela

Escolha Tela cheia, Topo, Centro ou Fundo.

Animações

• Animação de Apresentação / Animação de Fechamento: Nenhuma, Esmaecer, Esquerda, Direita, Cima ou Baixo, ou Padrão para usar o padrão do SDK do seu aplicativo.
• Duração da Animação (MS): 100 a 3000 milissegundos. Deixe em branco para usar o tempo padrão do SDK.

Nota

Nenhuma e Esmaecer atualmente funcionam no Android. No iOS, a mensagem aparece e desaparece instantaneamente (alinhamento em breve).

Deslizar para fechar

Habilite qualquer combinação de Esquerda, Direita, Cima e Baixo.

Botão de fechar

Ative ou desative Mostrar botão de fechar.

Quando estiver ativado, defina:

• Posição: Canto superior direito, Canto superior esquerdo, Canto inferior direito ou Canto inferior esquerdo.
• Fundo: uma cor ou Transparente.
• Raio do canto: arredonda os cantos do fundo do botão de fechar. Disponível apenas quando o Fundo é uma cor (não Transparente). Defina de 0 a 16 px: 16 px cria um círculo (padrão), 0 px cria um quadrado.
• Cor do ícone: cor do ícone de fechar.
• Margem: espaço ao redor do botão de fechar em cada lado (Topo, Direita, Fundo, Esquerda).

Diferente das outras opções em Configurações in-app, o estilo do botão de fechar é salvo na própria mensagem. Ele aparece em todas as plataformas, não apenas no iOS e Android Nativo.

Clique em Aplicar para salvar suas escolhas, ou em Cancelar para descartá-las. Abra a Pré-visualização para verificar a posição, as animações e o botão de fechar antes de salvar.