Cómo agregar botones a tu sitio

Crea enlaces de botones para ayudar a los visitantes a explorar tu contenido o encontrar información importante.

Última actualización: 8 de julio de 2024

Puedes agregar botones a tu sitio que animen a los visitantes a interactuar con tu contenido. Los botones son una adición visual a tu página, lo que facilita a los visitantes saber dónde hacer clic.

Para maximizar tu impacto, te recomendamos que el texto del botón sea breve y conciso. Prueba con una sola palabra, como “Donar” o con una frase clave corta, como “Pasa a la acción”.

Esta guía explica las diversas maneras de agregar botones a tu sitio.

Para ayudar a que tus botones sean accesibles para la audiencia más amplia posible, visita Recursos de accesibilidad en Squarespace.

Mira el video

Añadir botones (casi) en cualquier lugar con bloques de botones

Los bloques de botón son la forma más versátil de agregar una llamada a la acción a tu sitio. Puedes agregar un bloque de botón a cualquier sección de Editor dinámico o al área de contenido del editor clásico de tu sitio y personalizar cómo aparece en tu diseño.

Los bloques de botones pueden vincular al contenido de tu sitio, contenido externo, archivos, direcciones de correo electrónico y números de teléfono. Para obtener más información, consulta Bloques de botones.

Button_1.png

Botones de encabezado

Al agregar un botón a un encabezado, la llamada a la acción se coloca en la parte superior de la página. Esto anima a los visitantes a hacer clic en este de inmediato. Para obtener más información sobre los botones de encabezado, visita Cómo crear un encabezado de sitio.

Squarespace_7.1_header_button.jpg

Botones de banner

Un botón de banner destaca en tu fondo o imagen de banner. Si quieres que tus visitantes realicen una acción específica al llegar a tu sitio, agrega un botón de banner difícil de pasar por alto.

Si tu sitio está en la versión 7.1, agrega una imagen de fondo a una sección de bloques y luego agrega un bloque de botón. Si tu sitio está en la versión 7.0, las opciones de tus botones de banner dependen de tu plantilla.

Banner_image_button_on_Brine.png

Botones de pie de página

Un pie de página es la sección que se encuentra en la parte inferior de tu sitio. A menudo, incluye detalles sobre el sitio o el negocio. Agrega un botón al pie de página para ayudar a que los visitantes encuentren información importante o hagan una acción específica después de haber explorado el contenido principal. Para obtener más información, visita Cómo editar pies de página.

Squarespace_version_7.1_footer_button.jpg

Botones de diseño inteligente

Para promover diferentes llamadas a la acción, vincular a diferentes proyectos o presentar a tu equipo, usa un diseño inteligente, que organiza los conjuntos de contenido en columnas y filas. Cada elemento de un diseño inteligente puede tener un botón o bien, puedes agregar un botón para toda la sección, ya sea por encima o por debajo de los elementos. Para obtener más información, visita Diseños inteligentes.

Auto_layout_item_buttons_and_section_button.png

Botones de bloque de formulario y de newsletter

Para animar a los visitantes a que se comuniquen contigo o se suscriban a tu newsletter, agrega un bloque de formulario o bloque de newsletter. En forma predeterminada, ambos bloques incluyen un botón EnviarRegistrarse, pero puedes personalizar el texto. Para obtener más información, consulta Bloques de formularios o Bloques de newsletter.

Button_4.png

Botones Commerce y donación

Cuando tus visitantes compran productos o donan dinero, los botones de Commerce y donación les ayudan a completar el proceso:

Botones de bloque de imagen

La mayoría de los diseños de bloque de imagen en el editor clásico pueden mostrar enlaces de clickthrough como un botón en la imagen, o a un lado o debajo de esta, dependiendo del diseño. Usa este método para incluir una imagen con tu enlace. Si estás usando Editor dinámico, coloca un bloque de botón con tu bloque de imagen para reproducir estos diseños. Para obtener más información, visita Bloques de imágenes.

Botones de mensajes emergentes con promociones

Puedes crear una ventana emergente que aparezca cuando los visitantes lleguen a tu sitio y agregarle hasta dos botones. Las ventanas emergentes promocionales se pueden personalizar para que coincidan con tu sitio y la llamada a la acción que les añadas. Para obtener más información, consulta Cómo crear una ventana emergente promocional.

Botones Guardar de Pinterest

Puedes agregar botones Guardar de Pinterest a ciertas imágenes de tu sitio para que los visitantes puedan compartir tu contenido en Pinterest. A medida que se compartan las imágenes, más visitantes descubrirán tu sitio. Para obtener más información, visita Cómo agregar botones Guardar de Pinterest.

Botones en la versión 7.0

Si tu sitio está en la versión 7.0, también puedes agregar botones con estas opciones:

Modificar el estilo de los botones

Puedes personalizar tus botones para que coincidan con el aspecto general de tu sitio. Por ejemplo, con la mayoría de los botones, puedes cambiar:

  • Color de Fondo
  • Fuente
  • Forma
  • Tamaño

Para garantizar el máximo control sobre el aspecto de los botones, recomendamos mantener el texto de los botones con menos de 25 caracteres, ya que todos los botones cambian de tamaño y forma para adaptarse al texto.

Tus opciones de estilo dependen de la versión de tu sitio. Para obtener más información, visita Modificar el estilo de los botones.

Hacer un seguimiento de los clics de los botones en Analytics

En analytics de botones y formularios, puedes ver con qué frecuencia los visitantes hacen clic en los botones relacionados con el contenido. Usando la información de este panel, puedes comparar qué botones son más efectivos y comprender cómo los cambios de estilo o posición afectan los clics de los botones a lo largo del tiempo.

En el análisis del embudo de ventas, puedes revisar cuántos clientes han hecho clic en el botón Agregar al carrito de tus productos.

Footer Image
  • Recibe ayuda de nuestra comunidad

  • Recibe la ayuda de nuestra comunidad para personalizaciones avanzadas.

  • Contrata a un Squarespace Expert

  • Destácate en línea con la ayuda de un diseñador o desarrollador con experiencia.