Utilizar gradientes de color como fondos

Los gradientes de color como fondos crean un efecto bonito y ofrecen un aspecto mucho más dinámico que los fondos monocromos. Por supuesto, también puedes combinar ambas opciones de diseño para fondos en tu tienda al mismo tiempo. Para más información, consulta Editar el diseño de fondo de elementos de contenido.

Cómo fijar un fondo de gradiente

Una vez ya hayas añadido un elemento de contenido a la página, podrás fijar un gradiente de color como fondo. Todos los cambios se mostrarán directamente en el área de vista previa del Editor.

  1. Selecciona el elemento de contenido o pasa el ratón por encima. Verás una barra azul en la parte superior del elemento de contenido.
  2. En la barra azul, selecciona BackgroundIcon.png.
  3. Selecciona la opción Fondo de gradiente.
  4. Selecciona si quieres usar 2 colores o 3 colores.
  5. Si quieres cambiar la dirección del gradiente, selecciona el enlace Cambiar la dirección del color.
  6. Escoge los colores que quieres utilizar para tu gradiente seleccionado los cuadros de colores:
    • Selecciona tu color deseado en la paleta de colores circle-1.png.
    • También puedes seleccionar uno de los colores predefinidos circle-2.png. Estos siempre incluyen los colores básicos negro y blanco. Además, podrás ver los colores de la tienda seleccionados actualmente aquí.
    • Para escoger un tono de color exacto, también puedes introducir un código de color hexadecimal en el campo de entrada circle-3.png.
      Si quieres utilizar un color específico para tu tienda, puedes utilizar un selector de color para identificar el código hexadecimal correspondiente. De este modo puedes seleccionar rápidamente el tono exacto. Los selectores de color están disponibles de forma gratuita en diversos sitios web y como extensiones para los navegadores más populares.
    • Ten en cuenta que el enlace Restablecer restaura el color predeterminado de tu plantilla, no el color que habías seleccionado previamente (si es que tenías otro color seleccionado).SelectColour_Gradient_EN.png
  7. En Orientación, selecciona si quieres tener un gradiente en horizontal HorizontalOrientation.png, en vertical VerticalOrientation.png o en diagonal DiagonallOrientation.png.
  8. Si quieres restaurar el diseño de fondo predeterminado para este elemento de contenido, selecciona el enlace Restablecer en la vista Editar el diseño de fondo.
    Ten en cuenta que esto restaurará el color predeterminado de tu plantilla, no el color que habías seleccionado previamente (en caso de haberlo hecho). Si quieres mantener el color que tenías seleccionado cuando empezaste a editar, deberás cancelar el proceso seleccionado Cancelar.
  9. Selecciona Guardar.

Has fijado un gradiente de color como diseño de fondo. Para fijar un fondo de gradiente para otros elementos de contenido o para editar un gradiente de color de nuevo, repite los pasos anteriores. Los cambios se aplicarán directamente en tu tienda.

Consejos para las diferentes opciones de gradientes

  • Para crear diferentes efectos, puedes escoger por ejemplo la opción de 3 colores pero fijar el mismo color para dos de ellos.
  • Si usas colores similares, crearás un efecto más sutil, mientras que con colores muy diferentes obtendrás un efecto mucho más dramático.
  • Si quieres crear una transición más suave, puedes fijar un fondo monocromo para el primer elemento de contenido y fijar un fondo de gradiente en vertical únicamente para el segundo elemento de contenido empezando con el color del primer elemento. Puede verse así: Example_Smoother transition_EN.png

Información

Para más consejos, consulta Editar el diseño de fondo de elementos de contenido.

¿Fue útil este artículo?