---
title: "Desenhe um pop-up e o respetivo teaser"
description: "Escolha o tipo de pop-up, dê estilo ao pop-up e ao botão de fechar e adicione um teaser que convida os visitantes a abri-lo."
url: https://scratcher.io/pt/help/sharing/popup-design-and-teaser
language: pt
---

1. [Centro de ajuda](https://scratcher.io/pt/help)
2. [Publicar e partilhar](https://scratcher.io/pt/help/sharing)
3. Desenhe um pop-up e o respetivo teaser

# Desenhe um pop-up e o respetivo teaser

Escolha o tipo de pop-up, dê estilo ao pop-up e ao botão de fechar e adicione um teaser que convida os visitantes a abri-lo.

Uma campanha pop-up tem duas partes: o próprio pop-up e um teaser opcional. O teaser é um pequeno banner no seu site, como "Rode e ganhe 🎁", que abre o pop-up quando é clicado.

## Tipo e posição do pop-up

Abra **Posicionamento** em **Layout** no editor:

- **Tipo**: um pop-up normal, uma barra no topo ou no fundo do ecrã, um slider no canto ou uma página inteira. A barra, o slider e a página inteira fazem parte dos planos superiores.
- **Alinhamento**: onde fica o pop-up. As barras podem ficar em cima ou em baixo, os sliders à esquerda ou à direita, e os pop-ups normais em qualquer ponto de uma grelha de 3 × 3.

Da primeira vez que abre um novo pop-up, o Scratcher pede-lhe o domínio onde vai ser mostrado. Pode alterá-lo mais tarde em **Domínio**.

## Dar estilo ao pop-up

Clique em **Definições do pop-up** por cima da página, ou clique na margem do pop-up. No separador **Estilos**:

- **Pop-up**: **Fundo**, **Sobreposição de fundo** (a camada escurecida por trás do pop-up), **Contorno**, **Tamanho**, **Forma**, **Alinhamento do conteúdo** e **Margem**.
- **Botão de fechar**: o **Fundo**, a cor do **Ícone**, o **Tamanho**, o canto (**Alinhamento**) e a **Margem**.

No separador **Efeitos**, escolha como o pop-up abre e fecha, por exemplo **Desvanecer** ou **Deslizar**.

Complementos do pop-up:

- **Ocultar o teaser ao fechar**: oculte também o teaser quando alguém fecha o pop-up.
- **Ocultar após a submissão do formulário**: não volte a mostrar o pop-up aos visitantes que já se registaram nele.

## O teaser

Em **Fluxo**, a linha **Teaser** permite ativar e desativar o teaser. Clique em **Definições** no menu dele para o configurar:

- **Ação**: **Mostrar pop-up**, **Link** ou **Nenhum**.
- **Ocultar em computador**, **Ocultar em tablet**, **Ocultar em telemóvel**.
- **Estilos**: o **Fundo**, o **Contorno**, o **Tamanho**, a **Forma**, o canto (**Alinhamento**) e a **Margem** do teaser, e o seu próprio botão de fechar.

O teaser aparece assim que a página carrega; os acionadores em **Apresentação** só se aplicam ao pop-up. Desenhe o teaser como uma página e guarde-o com **Guardar teaser como modelo** para o reutilizar.

## Imagem de fundo nos pop-ups

Os pop-ups têm um elemento **Fundo de imagem** que preenche um dos lados do pop-up com uma imagem. Defina a **Altura em telemóvel** para controlar quanto do ecrã ocupa nos telemóveis.

## Abrir um pop-up a partir do seu próprio botão

Com o complemento de acionador **Acionador de clique**, o pop-up abre quando alguém clica num elemento do seu site. Introduza o seletor CSS do elemento, por exemplo `.open-competition`. Pergunte ao seu programador web se tiver dúvidas.

Publicar e partilhar

- [Partilhe a ligação e o código QR da sua campanha](https://scratcher.io/pt/help/sharing/share-your-campaign-link)
- [Incorpore uma campanha no seu site](https://scratcher.io/pt/help/sharing/embed-on-your-website)
- [Mostre uma campanha como pop-up](https://scratcher.io/pt/help/sharing/show-a-campaign-as-a-popup)
- [Desenhe um pop-up e o respetivo teaser](https://scratcher.io/pt/help/sharing/popup-design-and-teaser)
- [Escolha o endereço web da sua campanha](https://scratcher.io/pt/help/sharing/campaign-url-and-own-domain)
- [Envie e-mails a partir do seu próprio domínio](https://scratcher.io/pt/help/sharing/email-sending-domain)
- [Alterne campanhas com programações de campanhas](https://scratcher.io/pt/help/sharing/campaign-schedules)

## Artigos relacionados

- [Como funcionam as definições dos elementos](https://scratcher.io/pt/help/elements/element-settings-basics): Os separadores Conteúdo, Estilos, Definições e Efeitos, tamanhos, formas, contornos, cores e fundos, alterações para telemóvel e complementos.
- [Incorpore uma campanha no seu site](https://scratcher.io/pt/help/sharing/embed-on-your-website): Coloque uma campanha dentro de uma página do seu site com o script de incorporação, confirme que funciona e resolva problemas comuns.
- [Mostre uma campanha como pop-up](https://scratcher.io/pt/help/sharing/show-a-campaign-as-a-popup): Instale o script uma única vez, escolha o tipo de pop-up e decida em que páginas, quando e com que frequência aparece.

## Ainda precisa de ajuda?

Há pessoas reais prontas para ajudar. Se já usa o Scratcher, o mais rápido é o chat dentro da plataforma.

- **[Fale connosco no chat](https://platform.scratcher.io/login)**

    Inicie sessão e clique no botão de chat no canto inferior direito. O Rex responde de imediato e a nossa equipa está à distância de um clique.
- **[Marque uma reunião](https://scratcher.io/pt/book-a-meeting)**

    Uma videochamada gratuita de 30 minutos com a nossa equipa: uma demonstração, ideias de campanhas ou ajuda com a sua configuração.
- **[Envie-nos um e-mail](mailto:contact@scratcher.io)**

    Escreva para contact@scratcher.io e entraremos em contacto consigo.