Gerente de interação

O Interaction Manager permite que você crie interações personalizadas que melhoram a funcionalidade do seu site sem exigir código adicional. Essas interações personalizadas são criadas pela combinação de regras predefinidas, oferecendo possibilidades ilimitadas de funcionalidade.

Pense nas regras como ingredientes: elas podem ser combinadas de diversas maneiras para criar uma variedade de resultados diferentes.

Alguns tutoriais de exemplo do que pode ser criado com o Interaction Manager podem ser encontrados no Blocs Academia.

Gerenciador de Interação Aberta

Para iniciar o Gerenciador de Interação, vá até o Barra de Menus Principal e a partir da Windows menus, selecione Gerente de interação ou, alternativamente, use o atalho do teclado ⌃⌘eu.

Adicionar interação

Para criar uma nova interação, clique em + botão que está localizado no canto superior direito da janela do Interaction Manager ou, alternativamente, use o atalho do teclado ⌃n.

Renomear interação

É possível renomear uma interação simplesmente clicando no texto do item de interação e digitando um novo nome.

Interação Duplicada

É possível duplicar uma interação por clique direito e selecionando duplicar no menu de contexto ou, alternativamente, use o atalho do teclado ⌘+D.

Remover interação

Para remover e excluir uma interação personalizada, basta selecionar o item de interação que deseja remover e clicar no botão - botão, que está localizado no canto superior direito da janela do Interaction Manager ou, alternativamente, use o atalho de teclado ⌘+⌫.

Editar interação

Para editar uma interação, clique em Configurações que está localizado na extrema direita do item de interação, ou simplesmente clique duas vezes no item de interação. Isso abrirá um popover contendo todas as regras contidas na interação.

Inserir uma regra

Para inserir uma nova regra em uma interação, basta clicar no + botão que está localizado no canto superior direito do popover de interação ou, alternativamente, use o atalho do teclado ⌃n. Isso abrirá um menu suspenso contendo todas as regras disponíveis que podem ser usadas dentro de interações personalizadas. Clicar em uma delas a inserirá abaixo da regra selecionada no momento.

Declaração If

A regra de instrução if é usada para executar lógica condicional. Ela permite que você coloque regras dentro dela que são acionadas somente se uma condição especificada for avaliada como verdadeira. Isso é útil para tomada de decisão em suas interações personalizadas, permitindo resultados diferentes com base em certas condições.

As instruções if de interação personalizada oferecem suporte às seguintes variáveis: URL, Visível, Na tela, Rolagem Y, Cookie, Sistema operacional (SO), Intervalo de tempo, Diurno, Noturno, Data, Dia, Mês, Dia da semana, Fim de semana. Todas as variáveis ​​permitem que você especifique um valor de comparação e oferecem suporte a vários operadores.

Navegar para a página

Esta regra navegará o navegador até a página especificada.

Navegar para URL

Esta regra navegará o navegador até o URL especificado.

Atualizar página

Esta regra recarregará a página atual no navegador.

Rolar para o alvo

Esta regra rolará até o elemento com o #ID especificado.

Alternar visibilidade

Esta regra alternará a visibilidade dos elementos com os #ID's especificados.

Alternar modal

Esta regra alternará um modal (mostrar/ocultar) com o #ID especificado.

Alternar classe

Esta regra alternará as classes especificadas nos elementos com os #IDs especificados.

Adicionar classe

Esta regra adicionará as classes especificadas aos elementos com os #ID's especificados.

Remover classe

Esta regra removerá as classes especificadas dos elementos com os #IDs especificados.

Definir Atributo

Esta regra definirá o valor de um atributo de dados para o elemento com o #ID especificado.

Definir texto

Esta regra definirá o conteúdo de texto especificado para o elemento com o #ID especificado.

Selecionar guia

Esta regra selecionará a guia para uma guia Bric com o #ID especificado.

Clique no item

Esta regra clicará programaticamente no elemento com o #ID especificado.

Copiar texto

Esta regra copiará uma sequência de texto especificada ou o conteúdo textual de um elemento para a área de transferência do usuário.

Remover elemento

Esta regra removerá o elemento com o #ID especificado.

Link de telefone

Esta regra iniciará uma chamada telefônica (em dispositivos compatíveis) para o número de telefone especificado.

E-mail link

Esta regra abrirá o cliente de e-mail do usuário atual com o campo de endereço preenchido com o endereço de e-mail especificado.

Baixar Arquivo

Esta regra acionará o download do arquivo especificado.

Video Player

Esta regra pode acionar eventos como reproduzir, pausar, parar e silenciar para o elemento do player de vídeo com o ID especificado.

Audio Player

Esta regra pode acionar eventos como reproduzir, pausar, parar e silenciar para o elemento do reprodutor de áudio com o ID especificado.

Tocar som

Esta regra reproduzirá o arquivo de áudio mp3 atribuído (Adicionar arquivos de áudio ao Asset Manager).

Definir cookie

Esta regra definirá um cookie no navegador do usuário com um nome, valor e número de dias especificados.

Destruir Cookie

Esta regra destruirá um cookie no navegador do usuário com um nome especificado.

Chamada de interação personalizada

Esta regra chamará outra interação personalizada e permitirá um atraso definido em milissegundos.

Interação de pausa

Esta regra adiciona um atraso (em milissegundos) antes da execução da próxima regra de interação.

Parar interação

Esta regra impede que uma interação personalizada execute regras adicionais depois dela.

Registro do console

Esta regra criará um log do navegador com o texto especificado.

Alertar

Esta regra acionará um alerta com a mensagem especificada.

Página de impressão

Esta regra abrirá as opções de impressão para a página atual.

Parar de carregar

Esta regra interromperá o carregamento do navegador da web.

Duplicar uma regra

É possível duplicar uma regra por clique direito e selecionando duplicar no menu de contexto ou, alternativamente, use o atalho do teclado ⌘+D.

Remover uma regra

Para remover uma regra de uma interação, basta selecionar a regra que deseja remover e clicar no botão - botão localizado no canto superior direito do popover de interação.

Coloque dentro da declaração If

Você pode colocar rapidamente várias regras dentro de uma instrução if selecionando-as, clicando com o botão direito e escolhendo Lugar Dentro > Declaração If no menu de contexto.

Código curto de dados

Agora você pode usar o dados() código curto em uma interação personalizada para obter personalizado atributo de dados valores do elemento de gatilho quando a interação é executada. Basta colocar o atributo de dados de destino dentro dos colchetes, assim: dados(meu-atributo). O atributo devo também pode ser armazenado no elemento de gatilho.

Você pode usar o dados() short-code em qualquer campo de texto de regra de interação. Saiba mais sobre como adicionar atributos de dados personalizados a elementos aqui.

Aplicar interações personalizadas

Interações personalizadas podem ser aplicadas a quase qualquer elemento dentro Blocs, itens como botões, imagens e ícones tenha uma opção de interação personalizada disponível no menu suspenso de interações da barra lateral padrão.

Outros elementos como Blocs, linhas, colunas, divs e texto mostrará um painel de interação personalizado no inspetor da barra lateral.

A Gerente de Menu tem suporte para usar interações personalizadas em itens de menu.

Acionar interação personalizada

Na maioria dos casos, as interações personalizadas podem ser acionadas de três maneiras: quando um elemento é clicou, quando o cursor do mouse está pairando sobre um elemento e quando o cursor do mouse folhas um elemento.

Também é possível acionar uma interação personalizada quando uma página tiver carregado, isso pode ser feito através do opções de configurações de página.