Become a HubSpot power user — join us for HubSpot Training Day 2017.

CTA

¿Cómo puedo añadir estilos personalizados a mi CTA?

Última actualización: January 29, 2016

La nueva pestaña de diseño CSS de HubSpot facilita la tarea de los diseñadores para crear botones de llamadas a la acción (CTA) altamente personalizados en HubSpot, que se ajustan perfectamente a cualquier tema del sitio web. Para acceder a estas herramientas en tu portal, navega hasta Contenido > Llamadas a la acción > haz clic en el botón azul Crear una CTA (o edita un botón existente en tu lista de CTA) > haz clic en la pestaña Diseño en la interfaz del editor > y haz clic en el botón Personalizar CSS para abrir la pestaña de diseño CSS.

Botón Personalizar CSS de la CTA
Botón Personalizar CSS de la CTA

La casilla CSS generado automáticamente es un cuadro de vista previa que hace que sea fácil ver qué estilos se aplican a los elementos específicos de una CTA, basados en la configuración de diseño de la CTA actual.

Si deseas agregar una clase personalizada a tu CTA, el recuadro Clase CSS admite entradas de clase personalizadas. Esto puede ser útil cuando varias CTA de tus páginas web deben compartir un conjunto similar de características de diseño, como familias de fuentes, tamaño o, incluso, relleno y márgenes. Si vas a usar una clase CSS personalizada, asegúrate de implementarla y también cualquier estilo correspondiente, dentro de la hoja de estilos CSS que se aplica como el estilo principal para tus páginas de HubSpot.

customize-css-class-cta.png
CTA Personalizar clase CSS de la CTA

Con el recuadro CSS personalizado, también es fácil aplicar estilo en línea específico a la CTA que se está editando. Si tienes un elemento de la CTA que quisieras cambiar, simplemente agrega una nueva declaración de estilo en el recuadro de CSS personalizado antes de guardar los cambios.

CTA personalizar código CSS de la CTA
CTA personalizar código CSS de la CTA

Para actualizar completamente las CTA en las páginas en vivo, deberás hacer clic en Actualizar CTA (o Crear CTA, si estás trabajando en una CTA nueva).