Cambiar los colores de tu sitio web

Los sitios web en MybookingCloud están confeccionados usando el tema Mybooking Theme para WordPress y el diseñador de páginas Elementor, por está razón debás hacer los ajustes de color en dos partes.

  1. Paleta de colores de Mybooking
  2. Paleta de colores de Elementor
  3. Cambiar el color de la navegación
  4. Los colores de la cabecera
  5. Ajustar los colores del footer

Paleta de colores de Mybooking

Mybooking Theme cuenta con una paleta de colores predeterminados que nos ayudan a personalizar algunas partes del tema como los botones , la navegación, el pie de página y otros elementos destacados. Estos ajustes se controlan en los apartados correspondientes del panel Personalizar donde encontramos la paleta principal.

Para cambiar los colores de paleta principal vamos a Apariencia > Personalizar > Mybooking Theme > Colores:

La paleta de colores de Mybooking Theme

El color primario se corresponde con el color de branding. Usaremos este ajuste para definir el color principal de los botones de los formularios, las tarjetas del catálogo, los resultados de la búsqueda y los pasos del proceso de reservas:

Las variaciones controlan el color al pasar el cursor para algunos botones como el del selector de fechas y el aspecto de los steps. El color secundario controla el aspecto del mensaje destacado en la página de resultados:

En la configuración general, también puedes hacer ajustes secundarios como el color del fondo de la página, el color de los titulares y el del cuerpo del texto. A menos que lo necesites, puedes dejar esos colores por defecto pues ya están ajustados para que tu sitio web se legible.


Paleta de colores de Elementor

Cuando cambies los colores en la paleta de de Mybooking Theme observarás que algunos elementos de la página no varían, esto se debe a que estos están diseñado usando el plugin Elementor.

Este plugin nos permite hacer diseños profesionales en nuestro sitio web y añade herramientas extra y una pantalla de edición desde la que, entre otras cosas, podemos controlar los colores.

Para ajustar los colores de la paleta de Elementor haz lo siguiente:

  1. En el menú Páginas de tu WordPress selecciona una página y haz clic en Editar con Elementor
  2. En la esquina superior izquierda de la pantalla de edición, haz clic en el icono con tres rayas horizontales.
  3. Haz clic en Ajustes del sitio y a continuación en Colores globales
  4. Para modificar un color haz clic sobre el e inserta el código HEX o escoge uno en el selector


Cambiar el color de la navegación

Mybooking Theme te permite cambiar el color de los elementos del menú principal situado en la parte superior de las páginas de tu sitio web y también el aspecto de estos al pasar el ratón por encima o cuando están activos.

Para modificar los colores de la navegación ves a Apariencia > Personalizar > Mybooking Theme > Navegación:

En esta sección también se puede configurar el color del menú en dispositivos móviles y el de los elementos desplegables si tenemos secciones anidadas en nuestra navegación.

Si has activado la opción Navegación transparente para que el menú aparezca sobre la foto de la cabecera de la página de inicio, el color fondo no se mostrará en la página principal pero sí en el resto de sitio web.


Los colores de la cabecera

En este apartado puedes configurar el color de los textos que aparecen sobre la fotografía de fondo de la cabecera para adaptarlos a las características de la imagen escogida.

Ves a Apariencia > Personalizar > Mybooking Theme > Cabecera y haz scroll hasta abajo de la sección:


Para configurar el color del texto, los enlaces o el fondo del footer de tu web, ves a Apariencia > Personalizar > Mybooking Theme > Pie de página:

En este apartado también puedes ajustar los colores de la zona de créditos situada bajo el footer:


Preguntas frecuentes


¿Cómo puedo cambiar los colores de las páginas del proceso de reservas?

En este momento la única manera de cambiar los colores es usando código CSS e insertarlo en Apariencia > Personalizar > CSS adicional. Si no sabes cómo hacerlo puedes contratar a un diseñador web o adquirir nuestra bolsa de horas para que lo ajustemos por ti.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us