We usually use Bootstrap as a CSS Frameword for developing webapps and we wanted to use it on WordPress. We started creating a child theme from Understrap, but finally we decided to create our own theme, so we can fully customize it.
Theme Name: MyBooking
Theme URI: https://github.com/mybooking-es/mybooking
Contributors: MyBooking Team - hectorasencio marcelreig juanmiqueo
Requires at least: WordPress 5.2
Version: 2.0.1
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: e-commerce
See changelog
MyBooking is a simple theme but allow to customize the colors and offers three templates to easy build a company website.
- Boostrap integration 4.4
- Font Awesome integration 5.0
These are the main components of the theme:
It is shown at top of any pages. It is only visible if a widget is added to the Top Notification Widget Area.
It can be used to show notification messages.
It is shown at top, below the notification area and above the navigation menu.
It shows the contact information and has a widget area at right, where any widget like social media links can be placed.
The footer has 4 widgets areas, so different information can we placed there.
MyBooking theme defines three templates:
- MyBooking Home to create the home page with a background image, video or slide.
- MyBooking Contact to create the contact page with map and contact form.
- MyBooking Empty to use Elementor or any Page Builder.
It is an special template used to build the homepage.
The home template has the following areas that are rendered in the following order
- The header
- MyBooking Home Template Top widgets
- Content
- Mybooking Home Template Center widgets
- News
- MyBooking Home Template Bottom widgets
In the customizer > Home Page you can configure which of this components will be shown
The header can be configured in the customizer: MyBooking Theme > Header
It renders a background that can be made by a photo, a video or a carrousel. In two the background two widget areas are available, mybooking_home_derecha (at right) and mybooking_home_izquierda (at left).
The layout can also be configured in the customizer. It means the width porcentage of the widgets areas and if the must be placed in columns or in rows.
It allows to place some widgets between the header and the content.
Where the page content is placed
There are up to three widgets areas that can used below the content. They are shown in a row.
The last three posts are show
Below the news another widget area that can be used to render extra information.
It is a basic template to create a contact page. It shows the map with the location of the company office. Moreover, it has a widget area where any contact form can be placed. It can be integrated with any plugin that offers a contact form as a widget.
It is a template used to create landing pages with the page featured image at full width an a widget area to include any required widget.
It is an empty template that can be used with any page builder to create custom contents. It does not show the page title.
Colors, typography and layout can be configured in the customizer. It allows to customize the aspect of the website.
- Go into your WP admin backend
- Upload mybooking.zip
- Go to "Appearance -> Themes"
- Activate Mybooking WordPress Theme
- node v.12.13.0
- gulp v.4.0.2
- yarn v.1.22.19
- Make sure you have installed Node.js and Gulp and Yarn on your computer globally
- Open your terminal and browse to the location of the Mybooking WordPress Theme
- Run
$ yarn
- To build styles run
$ gulp styles - To build scripts run
$ gulp scripts
Browsersync settings is setup in a gulpenv.json file. This file is not hold in Version Control. Please create it on the root folder of the theme and configure the proxy depending on your development environment.
{
"browserSyncOptions": {
"proxy": "localhost:8888/mybooking",
"notify": false
}
}NOTE: Localhost port depends of your local server configuration.
MyBooking WordPress Theme, Copyright 2020 mybooking.es. Mybooking is distributed under the terms of the GNU GPL.
See license
This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 2 of the License, or (at your option) any later version.
This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
Mybooking is derived from Understrap, Copyright 2013-2018 Holger Koenemann. Understrap theme is distributed under license GPL V2