Os botões são a maneira mais fácil de fazer os visitantes do site agirem. Os botões podem levar o visitante para outra página do seu site ou de outro site. Eles também podem abrir um pop-up, um formulário de contato, reservas on-line, e-mail e muito mais.
-
Digite o texto que você deseja exibir no botão no campo fornecido.
-
Entre as opções a seguir, selecione o destino para onde o botão deve levar:
-
Página existente.
-
Link da loja. Isso só será exibido se o site tiver uma loja.
-
Endereço do site.
-
Popup.
-
Âncora.
-
Plano de associação checkout. Isso só será exibido se o site tiver adicionado o recurso de associação.
-
Postagem no blog. Essa opção só será exibida se o site tiver um blog.
-
Endereço de e-mail.
-
Clique para ligar.
-
Arquivo para download.
-
Dica
Para obter detalhes sobre essas opções, consulte Seletor de links
Use o editor de design para selecionar se o botão herda o estilo de botão primário ou secundário definido no painel temático. Além disso, você pode escolher entre os diferentes layouts de botão, fazer edições no estilo do botão (largura, altura) e no texto do botão (fonte, tamanho do texto, cor, formato, alinhamento e direção) e ajustar o espaçamento interno e externo.
Qualquer alteração feita no editor de design substituirá os estilos definidos no nível do botão do tema. Se você precisar voltar ao estilo do botão do tema, clique em Redefinir para o estilo do tema.
-
Se forem feitas alterações no botão (o que anula os estilos definidos no nível de botão do tema), ainda haverá uma caixa indicadora no estilo do botão principal ou secundário.
-
Ao clicar no estilo do botão sem a caixa indicadora, o botão voltará para o estilo definido no nível de botão do tema.
Nota
Para obter mais informações sobre botões temáticos, consulte Botões do site.
Com os botões flutuantes, é possível manter um botão sempre visível, mesmo quando o visitante rola a página. Use botões flutuantes para manter CTAs importantes sempre visíveis e clicáveis em todas as páginas do site.
Os casos de uso ideais incluem:
-
Contate-nos
-
ASSINAR
-
FAÇA UMA COTAÇÃO
Para fazer um botão flutuar no Editor Clássico ou Fixo no Editor 2.0:
-
No painel lateral, clique em Widgets. Procure o widget Button e, em seguida, clique e arraste-o para a tela.
-
Clique com o botão direito do mouse no botão e clique em Editar design. Se você estiver no Editor 2.0, clique no botão para abrir o menu flutuante e selecione Editar design. Isso abre o painel de design no lado direito da tela. Role para baixo até a seção Posição do painel de design.
-
Na guia Estilo, role para baixo e clique no botão Flutuante. Se o atributo Floating estiver desativado, o botão aparecerá automaticamente na primeira linha na parte superior da página. Se você estiver no Editor 2.0, clique para expandir o menu Tipo de posição e selecione Fixo. Isso garante que seu botão permaneça em uma posição fixa enquanto o usuário navega pelo seu site. Essa alteração se aplica a todos os tamanhos de tela, mas você pode substituí-la, se necessário. Depois de selecionar a posição, você não pode alternar de Fixa para Fixada. Isso ocorre porque quando você seleciona Fixo, o botão é removido do contêiner original para que fique visível na tela enquanto o usuário rola. Se você mudasse de Fixo para Fixado, o editor não saberia em qual contêiner colocar o botão. Se você precisar mudar, primeiro você precisa voltar para o Padrão. O botão será movido para a primeira seção na janela de exibição.
-
Selecione uma posição para o botão. Mude a visualização do dispositivo para alterar a posição em diferentes dispositivos. Se você estiver no Editor 2.0, no menu Espaçamento, use as configurações de margem para definir onde o botão está localizado na janela de exibição. É especialmente importante configurar isso se você tiver dois botões fixos na mesma posição da janela de visualização.
-
Para exibir o botão flutuante somente na página atual, ative a opção Mostrar somente nesta página.
Nota
Um botão flutuante pode ser configurado para ser exibido em páginas específicas, mas ele aparecerá em todas as páginas por padrão (atualmente não há uma maneira de desativá-lo somente para páginas específicas).
-
No celular, sugerimos que você coloque o botão Flutuante no canto inferior da tela para que os visitantes possam clicar facilmente com uma mão.
-
Você pode exibir um ícone em vez de texto no celular, escolhendo o layout que apresenta um ícone no celular.
-
Se um botão flutuante não estiver sendo exibido no celular, você pode estar usando um layout móvel antigo. Para atualizar o layout, acesse o Editor de design e clique em Layout do site.
Os botões fixados permanecem no elemento principal (coluna ou coluna interna) enquanto o elemento principal estiver na janela de visualização. Se houver mais de um botão fixado na mesma posição, o botão na parte superior será o primeiro botão.
Nota
Fixado não é uma opção em grades avançadas.
Para habilitar um botão fixo no Editor 2.0:
-
No painel lateral, clique em Widgets. Procure o widget Button e, em seguida, clique e arraste-o para a tela.
-
Clique no botão para abrir o menu flutuante e selecione Editar design. Isso abre o painel de design no lado direito da tela.
-
No painel de design, role para baixo até a seção Posição.
-
Clique para expandir o menu Tipo de posição e selecione Fixado. Isso garante que o botão permaneça no elemento principal (coluna ou coluna interna), desde que o elemento pai esteja na janela de visualização. Essa alteração se aplica a todos os tamanhos de tela, mas você pode substituí-la, se necessário.
-
Na seção Posição, configure o deslocamento do botão. O deslocamento é onde o botão será fixado na rolagem antes de sair da janela de visualização. Se definido a partir do desktop, outros tamanhos de tela terão os mesmos valores; no entanto, ele pode ser substituído por tamanho de tela, conforme necessário. Se o cabeçalho fixo estiver ativado, o deslocamento será baseado na altura padrão do cabeçalho. Se você ativar um cabeçalho fixo após definir o deslocamento, ele não será atualizado automaticamente e você precisará voltar e ajustar manualmente o deslocamento.
Se em algum momento você mover o botão para um elemento principal diferente (coluna ou coluna interna), as configurações do painel de design, como deslocamento, serão mantidas.
Haverá um ícone indicador fixado no menu flutuante e no painel de design do botão.