Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Modificar el estilo de los botones

Utiliza estilos del sitio para editar el aspecto de los botones del sitio. Puedes cambiar el color, la forma y el estilo del texto, lo que es una gran forma de adaptar las llamadas a la acción al diseño gráfico de tu sitio. Para ayudarte a crear un aspecto coherente, los cambios de estilo que hagas en los botones afectan a la mayoría de los botones del sitio.

Antes de comenzar

El estilo de los botones del sitio depende de la versión del sitio.  

Consulta Modificar el estilo de los botones de todo el sitio para editar estos botones:

  • Botones Añadir al carrito
  • Bloques de Botón
  • Botones del Bloque de donación
  • Botones Enviar del bloque de formulario
  • Botón Bloque de registro de miembros

Consulta Modificar el estilo de otros botones para editar estos botones:

  • Botones del Bloque de boletín
  • Icono del carrito de compras

Consulta Modificar el estilo de los botones de todo el sitio para editar estos botones:

  • Botones Añadir al carrito
  • Bloques de Botón
  • Botones del Bloque de donación
  • Botones Enviar del bloque de formulario
  • Botones del Bloque de boletín
  • Botón Bloque de registro de miembros

Consulta Modificar el estilo de otros botones para editar estos botones:

  • Botones de página de portada
  • Bloques de imágenes
  • Icono del carrito de compras
  • Banner específico de la plantilla o botones de navegación

Para modificar el estilo del ícono del carrito de compras, visita Visualización del ícono del carrito de compras. Si tu carrito no aparece, consulta nuestros consejos de solución de problemas.

Modificar el estilo de los botones de todo el sitio

El estilo de los botones para todo el sitio depende de la versión del sitio.

Para aplicar estilo a los botones del sitio, abre estilos del sitio y haz clic en Botones. En algunos casos, los ajustes no afectan a todos los botones de tu sitio. Por ejemplo, para conservar el diseño de bloque de newsletter, el ajuste Relleno no afectará a los botones del bloque de newsletter.

Los botones tienen los mismos colores y las mismas fuentes que tu sitio.

Para editar el aspecto de la mayoría de los botones de tu sitio: 

  1. En el panel de Páginas,  una página que use botones.
  2. En el Menú de Inicio, haz clic en Diseño y, luego, en Estilos del sitio.
  3. Desplázate hacia abajo hasta Botones. Para los bloques de botón, la sección se denominará Bloque de botón (pequeño), (Mediano) o (Grande).

Utiliza los siguientes retoques:

  • Estilo del botón: elige Sólido,Contorno oRelieve.
  • Forma de botón: elige cuadrado, redondeado o píldora.
  • Color del botón: Cambia el color de fondo del botón.
  • Color del texto del botón: Modifica el color del texto.
  • Fuente del botón: cambia la fuente. No se puede cambiar el tamaño del texto para los botones del bloque de formulario o del bloque de newsletter.
Consejo: Para el estilo Delineado, el texto se muestra automáticamente como blanco o negro cuando se posiciona el cursor sobre él, según el Color del botón.

Modificar el estilo de otros botones

La forma en que se modifica el estilo de otros botones en el sitio depende de la versión del sitio.

Los bloques de botones y los bloques con botones incorporados, como los bloques de boletín, tienen opciones de estilo adicionales:

  1. Haz clic en Editar para dicha página.
  2. Haz clic en el bloque y, a continuación, en el ícono de lápiz para cambiar el texto y la alineación. También puedes ajustar el tamaño de los bloques de botones.

Hay unos pocos tipos de botones que tienen opciones de estilo distintas:

Cambiar el texto del botón

Para crear tus propias llamadas a la acción, puedes cambiar el texto precargado para la mayoría de los botones de tu sitio.

Bloque de formulario y Bloque de boletín

Para editar el botón de envío en los bloques de formulario y newsletter:

  1. Haz doble clic en el bloque para abrir el editor.
  2. En la pestaña Contenido, edita el texto en el campo Texto de botón.

Botón Añadir al carrito

Para editar el botón de agregar al carrito de un producto:

  1. Haz doble clic en el producto para abrir el editor de productos.
  2. Haz clic en Botón personalizado y, a continuación, activa Etiqueta de botón personalizada.
  3. Edita el texto en el campo Etiqueta.
  4. Haz clic en Aplicar.

Bloque de Botón

Para editar el texto de un bloque de botones:

  1. Haz clic en Editar en la página y, a continuación, haz clic en el botón para editar el texto directamente.
  2. Como alternativa, puedes abrir el editor de bloques y editar el campo Texto.

Botones de navegación (solo versión 7.0)

En las familias Brine y Bedford, cambia el texto del botón de navegación del encabezado actualizando su título de navegación.

Color alternativo del botón

Los colores de los botones funcionan de manera diferente dependiendo de la versión del sitio

Aparece un color alternativo en los botones cuando pasas el cursor sobre estos, dependiendo de su estilo.

Para establecer el estilo del botón, edita los estilos de botón de todo el sitio y, a continuación, haz clic en Estilo. En el menú desplegable, selecciona Sólido o Contorno.

  • Si seleccionas Sólido, el color de fondo del botón permanece igual al pasar el cursor sobre él.
  • Si seleccionas Contorno, el color de fondo alternativo se muestra al pasar el cursor. El color alternativo depende de la configuración de colordel sitio.

Según tu plantilla y la configuración de tu sitio, tal vez veas un ajuste Alternativo o (Superposición) en la sección estilos del sitio de tu botón. Estas opciones aparecen para los botones que se muestran sobre los siguientes elementos:

  • Imágenes de fondo, como banners de la sección Índice
  • Áreas de fondo con colores diferentes del fondo principal, como pies de página o pre-pie de página.

Usa esta opción para destacar los botones sobre estos fondos únicos. Según el estilo de tu botón, es posible que veas otros ajustes Alternativos y de (Superposición).

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 45 de 446
Modificar el estilo de los botones