Ajuste o tamanho do seu CTA (legado) usando as opções de dimensionamento integradas e CSS personalizado. Ao enviar sua imagem para um CTA de imagem, você pode levar em consideração otimização de retina.
Para personalizar ainda mais seu CTA, saiba como adicione estilos personalizados ao seu CTA (legado) com CSS. Se você estiver adicionando seu CTA a um e-mail ou modelo, saiba como centralize seu CTA (legado).
Edite o tamanho do seu CTA (legado)
Você pode ajustar manualmente o tamanho do seu CTA ou usar CSS personalizado para preencher automaticamente a largura do contêiner ou módulo do CTA. Se você estiver
incorporando um eu
mago CTA em seu site que não seja da HubSpot, pode ser necessário aplicar declarações CSS adicionais (como width: 100%;) em sua folha de estilo para tornar o CTA da imagem responsivo.
Para editar o tamanho do CTA do seu botão:
- No canto superior esquerdo, clique no menu suspenso e selecione CTAs (antigas).
- Passe o mouse sobre um CTA e clique no Ações > Editar.
- No painel deslizante, clique em Opções avançadas.
- Para redimensionar manualmente seu CTA personalizado:
- Limpar o Ajustar ao texto caixa de seleção. Isso removerá o redimensionamento automático aplicado.
- No Preenchimento de botão seção, insira seu valores de tamanho para o largura do botão e altura do botão Campos.
- Clique Próximo >.
- Clique em Salvar. Então clique Terminar.
- Para que seu CTA personalizado preencha toda a largura do contêiner ou módulo:
- Limpar o Dimensionar automaticamente caixa de seleção.
- No CSS customizado campo, insira seu CSS customizado.
- Defina a largura como largura: 100%;
- Clique Próximo >.
- Clique em Salvar. Então clique Terminar .
O que é otimização de retina?
A otimização de retina torna a imagem do seu CTA mais nítida quando visualizada nas páginas do seu site e nos e-mails, se os destinatários visualizarem o CTA nas versões modernas do e-mail do Apple Mail e do iOS; isso não é suportado pelos serviços do Outlook ou do webmail, como o Gmail.
A otimização de retina é suportada quando você carrega uma imagem que tem pelo menos duas vezes o tamanho necessário para o CTA, da mesma forma que funciona o suporte retina para todas as imagens na internet. Observe também o seguinte:
- Se você estiver criando um CTA que será 400px por 100px, a imagem carregada precisa ser 800px por 200px para apoiar um display de densidade @2x pixel.
- CTAs suportam adição de uma versão 4x. Por exemplo, se você estiver criando um CTA de 400 por 100 pixels, poderá enviar uma imagem de 1600 por 400 pixels.
- O CTA será renderizado automaticamente em seu site com um atributo de srcdefinido que atende a 1x, 2x, 3x e 4x a versão disponível.
- Se a imagem for carregada no tamanho em que o CTA será renderizado, ela não terá suporte para retina. Por exemplo, se uma imagem de 400 x 100 pixels for carregada para um CTA de 400 x 100 pixels