Componentes interativos: Lightbox

A Lightbox é uma ótima ferramenta para exibir conteúdo adicional sem levar os visitantes para outra página. Você pode usá-la para exibir formulários, vídeos, imagens e qualquer outro tipo de conteúdo em uma janela pop-up exibida em sua página.

Assista ao vídeo abaixo para mais exemplos:

Vamos começar

Para começar a usar a Lightbox, basta arrastar o ícone para qualquer caixa da página.

Uma vez no lugar, você verá a caixa do Lightbox selecionada com um botão nela. Essa é a caixa do Lightbox que é adicionada à página e que inclui configurações para especificar o que será exibido na janela Lightbox e como.

Você pode publicar virtualmente qualquer tipo de conteúdo em uma Lightbox. Assim, se você deseja, por exemplo, que uma Lightbox seja aberta quando alguém clicar na miniatura de uma imagem, você pode excluir o botão e arrastar uma imagem para a caixa da Lightbox.

Open On Page Load (Abrir automaticamente)

Quando esta configuração está habilitada, sua Lightbox irá abrir automaticamente sem a necessidade do visitante clicar em nada.

Você também verá uma opção que permite definir um atraso para a ativação automática. Se você quiser que uma Lightbox abra assim que a página carregar, basta definir como 0. Se você quiser que uma Lightbox abra 5 segundos após o carregamento da página, altere o número para 5.

A opção Hide Lightbox Button pode ser habilitada para ocultar o botão de uma Lightbox. Isso pode ser útil se você deseja acionar uma Lightbox para abrir no carregamento da página, mas não deseja necessariamente ter um botão na página onde os visitantes possam clicar para abri-la.

Content (Conteúdo)

Em Content settings você especificará o que mostrar na Lightbox.

Por padrão, a opção de URL é selecionada. Você pode usar esta opção para exibir na Lightbox uma página do seu Creative Studio ou de um site externo.

Se você alternar para a opção Text, poderá abrir uma caixa de texto para digitar a mensagem que deseja exibir na janela da Lightbox.

Na opção Image, você poderá selecionar uma imagem da Biblioteca de Imagens do Ion Console para exibir na Lightbox.

Design

Existem inúmeras opções de design para uma Lightbox. Depois de clicar na guia Design da caixa da Lightbox, você poderá definir uma animação para quando ela for aberta, especificar a largura e a altura, ajustar o alinhamento vertical, o raio da borda, a cor de fundo, a cor de sobreposição e muito mais.

Behaviors (Comportamentos)

Como já vimos nesse post, você pode publicar qualquer tipo de conteúdo que desejar em uma Lightbox - incluindo conteúdo que você pode não querer que execute de modo automático.

O comportamento Open Lightbox precisará ser aplicado a cada elemento individual que você deseja que os visitantes possam clicar para abrir uma determinada caixa Lightbox.

* Nota: Qualquer coisa publicada numa caixa Lightbox com este comportamento atribuído, vai desconsiderar quaisquer ações atribuídas anteriormente a esse elemento e, em seu lugar, fará referência às configurações da caixa Lightbox, ou seja, para a página que será aberta na janela pop-up.

Caso você tenha dúvidas, por favor, entre em contato conosco help@rockcontent.com. 😀