Personalización del tema en Mybooking Theme

Mybooking theme posee una gran flexibilidad a la hora de personalizar estilos y contenidos ya que esta pensado para una gran variedad de negocios vinculados con la reserva y el alquiler de productos o servicios.


En este articulo vamos a ver como personalizar la web con la imagen corporativa de tu negocio:

  1. Identidad del sitio: logotipo, título, descripción
  2. Colores
  3. Tipografía

Identidad del sitio

Para añadir el logotipo de tu negocio, el titulo o la descripción de tu sitio web tienes que ir a Apariencia > Personalización > Identidad del sitio y completar cada uno de los campos. Esta es una funcionalidad de Wordpress disponible en todos los temas. Al hacerlo el tema de Mybooking recogerá estos datos y los incluirá en sus páginas. Para más información de cómo hacerlo puedes consultar el siguiente artículo.

Colores

Para definir los colores en el tema tenemos que actuar sobre diferentes áreas:

  1. Paleta de colores predeterminados
  2. Colores en la barra superior global
  3. Colores en la navegación
  4. Colores en la cabecera
  5. Colores en el selector / buscador
  6. Colores en el pie de página

Paleta de colores predeterminados

Mybooking Theme cuenta con una paleta de colores predeterminados para personalizar las partes más relevantes del tema cómo son los botones, la navegación, el pie de página así como otros elementos destacados.

Estos ajustes se controlan en los apartados correspondientes del panel Personalizar. Para cambiar los colores de paleta principal hay que ir a Apariencia > Personalizar > Mybooking Theme > Colores

El color primario se corresponde con el color de branding. Usaremos este ajuste para definir el color principal de los botones en los formularios, las tarjetas del catálogo, los resultados de la búsqueda etc. Las variaciones definen el color que se mostrará al pasar el cursor sobre los botones o los estados de diferentes elementos, por ejemplo los pasos del proceso de reserva.

El color secundario controla el aspecto del mensaje destacado en la página de resultados y todos los elementos de resalte en las páginas.

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 o el del cuerpo del texto. Si no tienes necesidad de modificarlos puedes dejar los colores por defecto puesto que ya están pensados para que tu sitio web sea legible.


Colores en la barra superior global

Ejemplo de barra superior

En Mybooking theme puedes definir los colores de la barras que se encuentran sobre el menú. Para que te hagas una idea de su estructura flexible y los contenidos que puedes añadir de cara a comprender mejor como configurar los colores hemos preparado este articulo.

Los colores se definen en Apariencia > Personalizar > Mybooking Theme > Barra superior y puedes definirlo para la barra superior y la barra de notificaciones:

  • Color de fondo (hay dos opciones y el color utilizado depende de la configuración de fondo transparente del menú principal, es decir si se aplica el menú sin fondo sobre la imagen o con un fondo de color)
  • Color de texto
  • Color de los enlaces normales y resaltados

Colores en la navegación

Ejemplo de menú de navegación

Mybooking Theme te permite cambiar el color de los elementos del menú de navegación y también el aspecto de estos según su estado o al pasar el ratón por encima.

Para modificar los colores de la navegación hay que ir a Apariencia > Personalizar > Mybooking Theme > Navegación

Puedes definir:

  • Color de fondo del menú
  • Color de los enlaces y enlaces activos
  • Color del elemento desplegado (en menús con dos niveles)
  • Color del botón y de los enlaces para el menú en dispositivos móviles

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 (salvo en terminales móviles). Sí lo hará en el resto de sitio web.


Colores en la cabecera

La cabecera es la parte que tiene más relevancia en la home page e incluye una imagen estática, un carrousel o un video con texto superpuesto, así como un selector,

Para configurar el color del fondo de la cabecera bajo la imagen o el color de los textos que aparecen sobre la fotografía para adaptarlos a las características de la imagen o el contenido escogido tienes que ir a Apariencia > Personalizar > Mybooking Theme > Cabecera y hacer scroll hasta el fondo de la sección.

Colores en el selector / buscador

El selector o buscador aparece en la zona de la cabecera y también se pueden personalizar sus colores. Solo tienes que ir a Apariencia > Personalizar > Mybooking Theme > Formularios de reserva.

Si no aparece el listado de Mybooking Theme es porque no hay definido un selector o buscador en tu web y por lo tanto no es necesaria la configuración.

Puedes definir:

  • Color del fondo con transparencia y sin ella
  • Color del texto de los nombres de los campos
  • Color del fondo del selector que aparece en las páginas del proceso al clicar sobre el botón editar
  • Color del texto de los nombres de los campos en este último

Para configurar el color del texto, los enlaces o el fondo del footer de tu web, tienes que ir 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 pie de página.


Tipografía

Mybooking Theme carga un listado de tipografías disponibles en Google Fonts de manera automática lo que te ofrece más de cien fuentes para elegir. Para cambiar la tipografía tienes que ir a Apariencia > Personalizar > Mybooking Theme > Tipografía

En los desplegables puedes escoger una fuente tipográfica para el cuerpo de texto y si quieres otra diferente para los titulares. Por defecto Mybooking Theme está configurado con la fuente Inter.

Ajuste Afecta a
Fuente del cuerpo del texto Párrafos y menús de navegación
Fuente de los titulares Titulares y botones
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