Última actualización: mayo 22, 2023
Disponible con cualquiera de las siguientes suscripciones, a no ser que se indique de otro modo:
Marketing Hub
Pro
,
Enterprise
|
Content Hub
Pro
,
Enterprise
|
| Marketing Hub Básico (versión anterior) |
Ajusta el tamaño de tu CTA (legado) utilizando las opciones de tamaño incorporadas y CSS personalizado. Cuando subas tu imagen para un CTA de imagen, quizá quieras tener en cuenta la optimización para retina.
Para personalizar aún más tu CTA, aprende a añadir estilos personalizados a tu CTA (legado) con CSS. Si vas a añadir tu CTA a un correo electrónico o plantilla, aprende a centrar tu CTA (legado).
Edita el tamaño de tu CTA (legado)
Puedes ajustar manualmente el tamaño de tu CTA o utilizar CSS personalizado para rellenar automáticamente el ancho del contenedor o módulo del CTA. Si estás incrustando una imagen CTA en tu sitio que no es de HubSpot, puede que tengas que aplicar declaraciones CSS adicionales (como width: 100%;) en tu hoja de estilos para que la imagen CTA sea responsive.Para editar el tamaño de tu botón CTA:
- En tu cuenta de HubSpot, ve a Marketing > Captación de clientes potenciales > CTAs.
- En la parte superior izquierda, haz clic en el menú desplegable y selecciona CTAs (Legacy).
- Pasa el ratón por encima de un CTA y haz clic en las Acciones > Editar.
- En el panel deslizante, haz clic en Opciones avanzadas.
- Para cambiar manualmente el tamaño de tu CTA personalizado:
- Desmarca la casilla Ajustar al texto. Esto eliminará el redimensionamiento automático aplicado.
- En la sección Relleno del botón, introduce tus valores de tamaño para los campos de anchura y altura del botón.
- Haz clic en Siguiente >.
- Haz clic en Guardar. Luego, haz clic en Finalizar.
- Para que tu CTA personalizado ocupe todo el ancho de su contenedor o módulo:
- Desmarca la casilla Tamaño automáticamente .
- En el campo CSS personalizado, introduce tu CSS personalizado.
- Establece la anchura en anchura: 100%;
- Haz clic en Siguiente >.
- Haz clic en Guardar. Luego, haz clic en Finalizar.
¿Qué es la optimización de retina?
La optimización de retina hace que la imagen de CTA sea más nítida cuando se observa en las páginas del sitio y en correos electrónicos, si tus destinatarios ven la CTA en las versiones modernas de Apple Mail y el correo de iOS; esto no es compatible con los servicios de Outlook o correo electrónico web como Gmail.
La optimización retina es compatible cuando subes una imagen que tiene al menos dos veces el tamaño necesario para el CTA, de forma similar a como funciona la compatibilidad retina para todas las imágenes de Internet. Ten en cuenta también lo siguiente:
- Si estás creando una CTA que será de 400 px por 100 px, la imagen cargada debe ser de 800 px por 200 px para ser compatible con una visualización de densidad de 2x píxeles.
- Los CTA admiten la adición de una versión 4x. Por ejemplo, si estás creando un CTA que tendrá 400px por 100px, puedes subir una imagen de 1600px por 400px.
- La CTA se visualizará automáticamente en el sitio web con un atributo srcset que sirve para las versiones de 1x, 2x, 3x y 4x, donde esté disponible.
- Si la imagen se sube al tamaño al que se renderizará el CTA, no tendrá soporte retina. Por ejemplo, si se sube una imagen de 400px por 100px para un CTA de 400px por 100px
