Elemento pop-up

Sobre o elemento pop-up

Um pop-up é uma janela que aparece enquanto os visitantes navegam em um site. Seu objetivo principal é gerar mais leads e atender aos objetivos de publicidade de forma eficaz.

De Painel GemPages, abra um modelo para editar. Você pode encontrar rapidamente o elemento na barra lateral esquerda do editor, sob o Impulsionador de Conversão seção. Arraste e solte o elemento em qualquer posição da sua página.

Para usar o Elemento pop-up:

Passo 1: De Painel GemPages, localize a página de destino para abrir o editor.

Passo 2: As Popup O elemento pode ser encontrado na barra lateral esquerda, abaixo do Impulsionador de Conversão seção.

Passo 3: Arraste e solte o Popup elemento para qualquer posição na sua página.

Assim que o pop-up for minimizado, um pequeno rótulo aparecerá no lado direito do editor. Você pode clicar neste rótulo a qualquer momento para reabrir e editar o conteúdo do pop-up.

Para editar o conteúdo do pop-up, basta clicar no rótulo do pop-up no lado direito do editor.

O pop-up reaparecerá no editor, permitindo que você selecione e edite seus elementos internos (como texto, imagens ou botões) diretamente.

Configurar a guia Configurações

Nome do pop-up

Nome: Insira seu nome preferido para o elemento pop-up.

Botão fechar

• ícone: Escolha o ícone do botão Fechar (por exemplo, “X” ou “X em negrito”).
• Tamanho do ícone: Ajuste o tamanho do ícone.
• Cor do ícone: Escolha a cor do ícone (por exemplo, branco, #FFFFFF).
• Largura altura: Defina o tamanho do botão.
  
• Contexto: Selecione a cor de fundo para o botão Fechar.
• Posição: Escolha se o botão Fechar aparece dentro ou fora do pop-up.

Sobreposição

A sobreposição escurece o conteúdo de fundo da página quando o pop-up aparece, ajudando a focar a atenção no próprio pop-up. Quando ativada, você pode personalizar a cor e a transparência da sobreposição.

• Cor: Escolha uma cor na paleta para a cor de sobreposição.
• Opacidade: Ajusta a opacidade de toda a seção. Um valor numérico menor corresponde a um nível maior de transparência.
• Clique para fechar: Alterne esta opção para permitir que os usuários cliquem no plano de fundo da sobreposição para fechar o pop-up. 

Dimensões:

• Tela cheia: Escolha se o pop-up deve ocupar a tela inteira (Sim/Não).
• Largura: Defina a largura do pop-up (por exemplo, 600px).
• Altura: Ajuste a altura do pop-up (automático ou valor específico).
• Acolchoamento: Defina o preenchimento dentro do elemento pop-up (por exemplo, 32 px ao redor).

Contexto

• Cor: Escolha uma cor de fundo para o pop-up (por exemplo, #FFFFFF).

• Imagem: Você também pode adicionar uma imagem de fundo.

Shape

• Fronteira: Defina o tipo de borda (por exemplo, sólida, tracejada).
• Raio de canto: Ajuste a redondeza dos cantos (por exemplo, 16px para cantos arredondados).
• Shadow: Você pode habilitar ou desabilitar efeitos de sombra para o pop-up.

Posição

Ajuste a posição da imagem em 9 posições diferentes: superior esquerdo, superior central, superior direito, meio esquerdo, meio central, meio direito, inferior esquerdo, inferior central e inferior direito.

Condição de exibição

Configure quando o pop-up será acionado:

Mostrar quando: Selecione uma das 5 opções no menu suspenso para definir o horário exato em que o pop-up deve aparecer.

• nenhum: O pop-up não será exibido na página ativa.
• Após o carregamento da páginaA janela pop-up será exibida ao carregar a página.
• Rolar parcialmente: O pop-up será acionado depois que o usuário rolar para uma porcentagem específica da página.
• Prestes a sair:O pop-up aparecerá quando o usuário estiver prestes a sair da página.

Demora: Essa configuração aparece quando você seleciona "Após o carregamento da página".

Use esta opção para definir quantos segundos o sistema deve esperar antes de exibir a janela pop-up após o carregamento da página.

• Insira o tempo de atraso em segundos.
• Tempo máximo de atraso: 100 segundos

Rolagem: Essa configuração aparece quando você seleciona "Rolar parcialmente".

Use esta opção para definir quanto da página o usuário precisa rolar antes que a janela pop-up apareça.

• Insira a porcentagem de rolagem (por exemplo: 50% significa que o pop-up aparece depois que o usuário rolar até a metade da página).

No telemóvel: Essa configuração aparece quando você seleciona "Sobre" para sair.

Escolha como a janela pop-up se comporta em dispositivos móveis.

Frequência: Essa configuração controla a frequência com que a janela pop-up é exibida.

Opções disponíveis:

• Uma vez por usuário: A janela pop-up aparecerá apenas uma vez para cada usuário.
• A cada visita: A janela pop-up aparecerá sempre que o usuário visitar a página.
• Após algum tempo: A janela pop-up aparecerá novamente após um número específico de dias.

Se você selecionar "Após um determinado período", uma configuração adicional será exibida, permitindo que você insira o número de dias antes que a janela pop-up seja exibida novamente para o mesmo usuário.

Efeito

Este elemento tem 7 efeitos de entrada que você pode escolher:

• Desvanecer
• Zoom
• Zoom out
• Movimento horizontal
• Movimento Vertical
• Desdobramento 3D
• Nenhum: Nenhum efeito de entrada.

Configurar a guia Avançado

Para uma personalização mais avançada, navegue até o Guia Avançado e siga as instruções em Este artigo.

Você também pode encontrar dicas mais úteis e tutoriais em vídeo em Academia GemPages.

Boa prática: acione um pop-up com um link.

O GemPages permite que você acione pop-ups por meio de texto com hiperlink. Isso significa que você pode obter o ID do pop-up e criar um hiperlink para o texto escolhido.

• Selecione a janela pop-up que deseja abrir ao ser acionada e clique com o botão direito do mouse.
• Selecione os Copiar classe para copiar o ID do pop-up.
• Feche a janela pop-up e selecione o texto que deseja transformar em link.
• Clique no botão de hiperlink e paste o link copiado.
• Remova o ponto do início do ID e substitua-o por um #, depois escolha Link para esta URL.

Como adicionar um formulário em uma janela pop-up

Para incorporar um formulário em uma janela pop-up, basta adicionar um Formulário de Contato elemento dentro do elemento Popup.

Passo 1: Abra a janela pop-up clicando no rótulo da janela pop-up no lado direito do editor.

Passo 2: Em seguida, na barra lateral esquerda, arraste e solte o Formulário de Contato elemento na área pop-up.

Depois de adicionados, você pode personalizar os campos e configurações do formulário conforme necessário.

Finalmente, clique em Economize e Publicar para aplicar as mudanças.

Perguntas frequentes sobre o elemento pop-up

1. Por que o elemento Popup não funciona nas Seções Temáticas?

Atualmente, o elemento Popup é não suportado em seções temáticas. Isso significa que quando você cria uma seção de tema que inclui um pop-up, ele não será exibido nem funcionará corretamente em páginas ativas.

Neste caso, você precisará adicione o elemento Popup diretamente em cada página ao invés.

2. Como posso editar o conteúdo do pop-up depois de minimizá-lo?

Após minimizar, um rótulo pop-up aparecerá no lado direito do editor. Basta clicar nesse rótulo e o pop-up reaparecerá para que você possa editar seu conteúdo.

3. Quando meu pop-up aparecerá na página ativa?

O tempo de exibição do pop-up depende do que você selecionou Mostrar quando condição sob Condição de exibição:

• Após o carregamento da página
• Rolar parcialmente
• Prestes a sair
• nenhum (o pop-up não aparecerá)

4. Como posso abrir um pop-up com um link ou botão?

Você pode acionar um pop-up por meio de texto com hiperlink ou botões copiando o pop-up ID (via “Copy class”) e vinculando-o com um prefixo “#” na URL.

5. Que efeitos posso aplicar ao meu pop-up?

O elemento Popup inclui sete efeitos de entrada: Desvanecer, Zoom, Reduzir, Mover horizontalmente, Mover verticalmente, Desdobramento 3D e Nenhum.

6. Adicionei um pop-up no editor, mas não consigo mais encontrá-lo. Onde ele está?

Quando a janela pop-up é minimizada, ela não permanece visível na tela. Em vez disso, você verá um pequeno rótulo da janela pop-up no lado direito do editor. Clique nesse rótulo para reabrir a janela pop-up e continuar a editá-la.

7. Onde posso encontrar o ID do pop-up?

Selecione a janela pop-up no Editor, clique com o botão direito do mouse e escolha Copiar > Copiar classeO valor copiado é o ID da janela pop-up, que você pode usar para acioná-la por meio de um link.

8. Posso salvar um elemento Popup para uso global em várias páginas?

Atualmente, o GemPages suporta apenas a reutilização global por meio do Seções temáticas Este recurso se aplica somente a seções, não a elementos individuais. Se você quiser usar o mesmo pop-up em várias páginas, pode copiar e colar o elemento Popup.

Para obter instruções detalhadas, consulte o guia em copiar e colar elementos.

9. Como faço para remover uma janela pop-up?

Você verá um pequeno rótulo pop-up no lado direito do editor. Clique nesse rótulo para reabrir o pop-up e, em seguida, clique no ícone da lixeira para excluí-lo.