InicioDocModificar los templates de Mybooking

Modificar los templates de Mybooking

El proceso de reservas de Mybooking, tanto en el plugin como en el tema oficial, se implementa con un set de plantillas que se encargan de renderizar cada una de las páginas y componentes del proceso. Dichas plantillas pueden ser sobreescritas ya sea en un child theme como en un tema propio que estemos desarrollando.


Introducción

El plugin de Mybooking está construido siguiendo la misma filosofía que Woocommerce: ofrece una serie de templates que conformna el sistema de reservas los cuales se pueden modificar con solo incluir una carpeta con el nombre mybooking-templates en la raíz del tema activo, donde copiamos los templates que deseamos sobreescribir:

Mybooking Theme cuenta con su propio set de templates adaptados

Además, Mybooking proporciona un mecanismo extra para aquellos casos en los que, por las características del proyecto, construir un tema hijo no es posible o recomendable. En este caso podemos crear la carpeta mybooking-templates en el wp-content de nuestra instancia de WordPress y copiar allí los archivos.

Carpeta de templates en wp-content

Este sistema doble permite personalizar el proceso de reservas tanto en proyectos basados en Mybooking Theme como en integraciones de temas comerciales o proyectos más sencillos donde solo queremos modificar uno o dos de los templates.

Aconsejamos trabajar sobre un child theme siempre que sea posible y dejar la opción de a carpeta en la raíz de la instancia como último recurso.

Cómo funciona

Mybooking Reservation Engine contiene una serie de templates que representan cada paso y componente del sistema de reservas, desde el selector de fechas hasta el formulario de contacto. Existen dos tipo de templates: los que presentan los componentes y micro templates y los que muestran las vistas públicas del proceso. Estos últimos son los que se facilitan la interacción al usuario y se implementan por medio de shortcodes:

Esquema básico de un shortcode de Mybooking

Cuando instalas y activas nuestro plugin y configuras el sistema de reservas las vistas que aparecen en el frontend son generadas por las plantillas del plugin, pero cuando se detecta otra carpeta mybooking-templates en el tema activo los templates duplicados que existan tendrán preferencia sobre su original en el plugin:

Jerarquia de templates en Mybooking

Modificar un template

Los templates están escritos en HTML y contienen fragmentos de JavaScript que hacen las llamadas al API de Mybooking. Puedes modificar la estructura de cada documento y añadir o suprimir API calls según los requisitos del proyecto.

Para modificar un template tan solo hay que copiarlo y guardar el duplicado en la carpeta mybooking-templates de nuestro tema con el mismo nombre que el original.

Documentación del API de Mybooking ->


Listado de templates

Al contrario que en la estructura de ficheros, aquí se muestran los templates ordenados por categorías para facilitar la explicación.

Selectores de fechas

mybooking-plugin-selector-widget.phpContenedor para el formulario de selección de fechas
mybooking-plugin-selector-widget-tmpl.phpLlamadas al API y layout para el selector de fechas
mybooking-plugin-selector-wizard-container.phpContenedor para el modal del selector optimizado
mybooking-plugin-selector-wizard-widget.phpContenedor para el formulario de selección optimizado
mybooking-plugin-selector-wizard-widget-tmpl.phpLlamadas al API y layout para el selector de fechas optimizado
mybooking-plugin-transfer-selector-widget.phpContenedor para el selector de fechas para transfer
mybooking-plugin-transfer-selector-widget-tmpl.phpLlamadas al API y layout para el selector de fechas de transfer
mybooking-plugin-transfer-modify-reservation.phpContenedor para el modificador de fechas para transfer
mybooking-plugin-transfer-modify-reservation-tmpl.phpLlamadas al API y layout para el modificador para transfer
mybooking-plugin-modify-reservation.phpContenedor para el modificador de fechas
mybooking-plugin-modify-reservation-tmpl.phpLlamadas al API y layout para el modificador de fechas

Proceso de reservas para renting

mybooking-plugin-choose-product.phpContenedor para la página de escoger producto
mybooking-plugin-choose-product-tmpl.phpLlamadas al API y layout para escoger producto
mybooking-plugin-complete.phpContenedor para la página de completar la reserva
mybooking-plugin-complete-tmpl.phpLlamadas al API y layout para completar reserva
mybooking-plugin-summary.phpContenedor para la página de resumen de la reserva
mybooking-plugin-summary-tmpl.phpLlamadas al API y layout para el resumen de la reserva
mybooking-plugin-reservation.phpContenedor para la página de mi reserva
mybooking-plugin-reservation-tmpl.phpLlamadas al API y layout para la página mi reserva
mybooking-plugin-products.phpCatálogo de productos para renting
mybooking-plugin-routes-product.phpPágina de producto de renting
mybooking-plugin-product-widget.phpContenedor para el calendario único de producto de renting
mybooking-plugin-product-widget-tmpl.phpCalendario único de producto de renting
mybooking-plugin-products-search.phpContenedor para el buscador de producto de renting
mybooking-plugin-products-search-tmpl.phpLlamadas al API y layout para el buscador

Proceso de reservas para renting

mybooking-plugin-activities.phpCatálogo de productos para actividades
mybooking-plugin-activities-shopping-cart.phpContenedor para la página de completar la reserva
mybooking-plugin-activities-shopping-cart-tmpl.phpLlamadas al API y layout para completar reserva
mybooking-plugin-activities-summary.phpContenedor para la página de resumen de la reserva
mybooking-plugin-activities-summary-tmpl.phpLlamadas al API y layout para el resumen de la reserva
mybooking-plugin-activities-order.phpContenedor para la página de la reserva
mybooking-plugin-activities-order-tmpl.phpLlamadas al API y layout para la página de reserva
mybooking-plugin-routes-activity.phpPágina de producto de actividades
mybooking-plugin-activities-activity-widget.phpContenedor para calendario único de producto de actividades
mybooking-plugin-activities-activity-widget-tmpl.phpCalendario único de producto de renting
mybooking-plugin-activities-search.phpContenedor para el buscador de producto de actividades
mybooking-plugin-activities-search-tmpl.phpLlamadas al API y layout para el buscador

Proceso de reservas para transfer

mybooking-plugin-transfer-choose-vehicle.phpContenedor para la página de escoger producto
mybooking-plugin-transfer-choose-vehicle-tmpl.phpLlamadas al API y layout para escoger producto
mybooking-plugin-transfer-checkout.phpContenedor para la página de completar la reserva
mybooking-plugin-transfer-checkout-tmpl.phpLlamadas al API y layout para completar reserva
mybooking-plugin-transfer-summary.phpContenedor para la página de resumen de la reserva
mybooking-plugin-transfer-summary-tmpl.phpLlamadas al API y layout para el resumen de la reserva
mybooking-plugin-transfer-reservation.phpContenedor para la página de la reserva
mybooking-plugin-transfer-reservation-tmpl.phpLlamadas al API y layout para la página de reserva

Globales

mybooking-plugin-profile-change-password.phpAPI y layout para el formulario de cambiar password
mybooking-plugin-profile-password-forgotten.phpAPI y layout para el formulario de recuperar password
mybooking-plugin-contact-widget.phpLlamadas al API y layout para el formulario de contacto

Módulos

mybooking-plugin-cookies-notice.phpAPI y layout para el aviso de cookies
mybooking-plugin-content-slider.phpAPI y layout para el CPT carrusel de contenido
mybooking-plugin-product-slider.phpAPI y layout para el CPT carrusel de producto DEPRECATED
mybooking-plugin-promotions-popup.phpAPI y layout para el CPT aviso emergente
mybooking-plugin-testimonials.phpAPI y layout para el CPT carrusel de testimonios

Arriba