Breve Visão Geral

SmartTips fornecem orientações na tela que podem ser usadas para fornecer aos usuários informações adicionais sobre itens específicos na página.

SmartTips são especialmente úteis ao abordar processos ou formulários no seu site onde os usuários costumam cometer erros.

Para obter mais informações sobre SmartTips, consulte a página Introdução às SmartTips.

Dicas inteligentes individuais são criadas em um conjunto — um grupo de Dicas inteligentes que geralmente aparecem no mesmo formulário ou página. Este artigo irá guiá-lo através do processo de criação de um conjunto de SmartTips.

Criar um conjunto de SmartTips

1. No Editor, clique no ícone + azul
2. Selecione conjunto de SmartTips
   
3. Nomeie o conjunto SmartTips
   Isso não ficará visível para seus usuários, portanto, escolha um nome que seja significativo para você
4. Defina onde você deseja que o conjunto seja exibido:
   • Exibir definido em uma página específica | Recomendado
     • As SmartTips são normalmente adicionadas a uma única página, como um formulário de checkout. Neste caso, é melhor usar o mecanismo de regras para definir a página e otimizar o desempenho
     • Clique em Criar regra para identificar a página e seguir as diretrizes do mecanismo de regras
       Observação

       As regras de configuração definidas são avaliadas somente no carregamento da página. Se as regras exigirem uma ação do usuário ou da página para se tornarem verdadeiras, elas devem ser adicionadas às condições de exibição do SmartTip individuais para que a opção "Verificar constantemente" possa ser ativada.

   • Exibir conjunto em várias páginas
     • Se o SmartTip estiver anexado a um elemento que aparece em todo o site (cabeçalho, rodapé, painel de navegação), selecione este método
     • Você não precisa usar o mecanismo de regras aqui
5. Clique em Salvar

Criar Dicas Inteligentes

Agora que você criou um conjunto de Dicas Inteligentes, você criará uma SmartTip individual.

1. Clique no ícone de adição azul no conjunto de SmartTips para adicionar uma nova SmartTip
   
2. Selecione o elemento ao qual você deseja anexar a Dica Inteligente
   
3. Use o pop-up do mini-editor para definir as configurações iniciais do SmartTip
   • As SmartTips de Orientação fornecem aos usuários informações adicionais sobre elementos específicos em uma página
     • Esse é o tipo SmartTip mais comumente usado.
   • As SmartTips de validação podem ser usadas em campos de texto para garantir que os usuários preencham seus formulários corretamente
     • Para obter mais informações sobre as SmartTips de validação, consulte o artigo de suporte sobre SmartTips de validação
4. Escolha quando exibir essa mensagem.
   • Você pode definir essa orientação SmartTip para aparecer quando o usuário passar o mouse sobre um ícone SmartTip
   • Se você escolher essa opção, use as setas direcionais para determinar onde o ícone será posicionado
   • Você também pode optar por exibir uma SmartTip quando um usuário passa o mouse sobre um elemento
5. Clique em Concluído

O seu conjunto de SmartTips está agora criado!

Se estiver criando várias SmartTips, você pode selecionar Próxima SmartTip.

Personalizar SmartTips

1. Abra o conjunto de SmartTips que você deseja personalizar e abra uma SmartTip específica clicando no título
2. Na página de interações, você pode ajustar as configurações de SmartTips que foram criadas quando você criou inicialmente o SmartTip no navegador
   • Para adicionar validação a um SmartTip de orientação, clique no botão Adicionar validação
     • Consulte o guia SmartTips de Validação para obter mais informações sobre como configurar SmartTips de Validação
   • Você também pode escolher aqui para determinar se deseja exibir a mensagem SmartTips quando o usuário passa o mouse sobre o ícone SmartTips ou sobre o elemento
3. Clique nas opções de elemento selecionado para ajustar o comportamento do SmartTip.
   • Se a Dica inteligente estiver anexada a um elemento que aparece e desaparece como resultado do carregamento da página, será necessário ajustar essas configurações
   • Isso geralmente é necessário para SmartTips que aparecem em uma janela pop-up ou em um modal
4. Use o botão Customize on Screen! para ajustar a aparência e a posição desta SmartTip no navegador
5. Use o Editor de Rich Text para fazer personalizações adicionais, incluindo a adição de imagens que foram carregadas na Biblioteca de Recursos
   • Os seguintes tipos de imagem são suportados - TIFF, SVG, PNG, JPG, JPEG, GIF
   • 

SmartTips de Orientação

SmartTips de Orientação apresentam aos usuários informações adicionais sobre o conteúdo e o formato dos dados que devem ser inseridos no campo de entrada.

SmartTips de Orientação podem ser exibidas em um ícone e as mensagens aparecem quando você passa o mouse sobre o ícone ou clica no elemento ou no texto do marcador de posição, que fica sempre visível até que o usuário digite no campo com o marcador de posição.

Como exibir a SmartTip?

• Com ícone. Selecione a posição do ícone: Quando essa opção estiver selecionada, o ícone de orientação será exibido ao lado do elemento e a mensagem será exibida quando o usuário passar o mouse sobre ele
• Sem ícone: quando esta opção estiver selecionada, a mensagem será exibida quando o usuário passar o mouse sobre o elemento
• Somente texto do marcador de posição: quando essa opção estiver selecionada, nenhum ícone será exibido, apenas o texto do marcador de posição

Texto do marcador de posição

O texto marcador, localizado dentro de um campo de texto, é uma dica, descrição ou exemplo adicional das informações necessárias para um campo específico. Ele desaparece quando um usuário começa a digitar no campo.

Você pode ter um marcador de posição e uma mensagem ao passar o mouse.

A opção de texto de marcador de posição só está disponível para SmartTips de Orientação. Não estará disponível se Validação ou Ambas estiverem selecionadas.

O elemento capturado deve ser um campo de entrada para que o texto do placeholder seja compatível. O texto de placeholder também pode ser usado se o elemento for definido com jQuery.

SmartTips de Validação

As dicas inteligentes de validação permitem verificar a entrada dos usuários em um campo de texto para garantir que as informações fornecidas atendam aos requisitos do campo. O SmartTip de Validação destacará o campo em vermelho e exibirá um erro se as informações fornecidas forem inválidas. SmartTips de Validação devem ser colocados em um campo de texto.

1. Para criar um Validation SmartTip, você pode adicionar um SmartTip a um conjunto de SmartTips existente ou criar um novo conjunto de SmartTips.
   Observação: você pode adicionar Validação a um SmartTip de Orientação existente clicando no botão Adicionar Validação na Interaction tab das opções do SmartTip.
2. No SmartTips Set apropriado, clique no sinal de adição laranja.
3. Clique no botão de rádio Validação para tornar este SmartTip um SmartTip de Validação:
   
4. Escolha quando exibir a mensagem de validação e clique em Concluído. Isso abrirá a página Opções do SmartTip no Editor.
5. Escolha entre as opções disponíveis para regras de validação (se nenhuma delas for aplicável, você pode definir entradas válidas usando o Mecanismo de Regras):
   1. Campo obrigatório
   2. Validação de campo numérico
   3. Validação do formato de data
   4. Validação do formato de hora
   5. Validação do formato de número de telefone dos EUA
   6. Validação do formato de endereço de email
   7. Validação do formato de endereço Web
6. Digite a mensagem de erro que você deseja exibir quando o texto inserido for inválido.
7. Opcionalmente, você pode marcar a caixa Indicação de sucesso, que destacará o campo de texto em verde quando o texto inserido for válido. Você também pode incluir uma mensagem de sucesso a ser exibida quando as informações inseridas estiverem corretas.