Lodgy - Hotel, Hostel or Guesthouse Template is a dynamic template with stunning modern design that will allow you to showcase your hotel's facilities and make room or suite booking a breeze. Payment processing for bookings is powered by Stripe.
Features
Fully Responsive Pages
Admin Dashboard
Admin can handle bookings and contact messages made by customers.
Fully Integrated Database
Services are showcased extensively
Gallery Images can be enlarged to form a slideshow.
Stripe integration to accept card payments from users for bookings.
Payments: See the documentation on how to set Stripe Payments in Bubble App.
Data Structure
Booking
This contains all information related to bookings made by customers. This ranges from the customers personal information to the customers booking information.
Gallery
This contains all images of your hotel which you might want to showcase to your customers.
Room
This contains all information about a room or suite such as name and image of the room, price and some additional details you might want your customers to know.
Services
Your hotel might have services you might want your customers to know about. This data type contains information about your hotels' services.
Pages
index
This is the landing page of the Hotel Template. It gives an overview of your hotel while still directing your customers to other pages, most especially the booking page.
about-us
This page tells your customers about your hotel, your story and values as well as showcase some members of staff at your hotel.
services
This page showcases all the services you render at your hotel.
rooms
This page displays a grid view of all rooms and suites at your hotel. It displays the price and any additional information you might have about a room or suite.
gallery
This page displays all images in the gallery data type. Images are also clickable to enlarge to a slideshow for better viewing.
contact
This page displays the hotels basic information such as address, phone number, email address etc. There is also a form in which your customers can fill to make a special request or complaint. There is also a map view of your hotel location.
booking
This page enables your customers to book a room or suite and even pay for it using stripe. Each room has a fixed price. This price(inclusive of VAT) is then multiplied by the number of nights the customer wishes to spend at the hotel to give a total fee. Such a fee can either be paid online or at the hotel. The booking details are then stored in the database and can be retrieved in the dashboard.
Things to Note
Navigation
Navigation is straight forward on all pages. The booking link becomes visible when the the Book Now Reusable Group is not visible due to the current scrolling position.
Dashboard
The dashboard is a one-page component which allows for easy editing or deleting of some content on the template. The hotel template dashboard contains mainly editing and deleting of all components found in the database. Data such as bookings can also be viewed and handled.
Dashboard Login
The username and password for the Dashboard is “admin”. This password is the default for the template. It is therefore advised that before deploying the application the username and password is changed.
1.
Remove the initial content from the login popup in the dashboard from the username and password inputs.
2.
Double click the Login button and Click Start/Edit workflow.
3.
The workflow handling the password pops up. You can then input your preferred password only in the area in the white rectangle designated in the figure above. After doing this, you should try to login in with the new password.
Setting up Stripe Payment
This template uses stripe to process payment for booking on the hotel template
Stripe Setup:
Go to stripe.com, create an account. You will be allowed to access your dashboard once you have successfully verified your email address and activated your account.
Retrieve 3 keys from the Stripe dashboard. They can be found on the Developers page or the Account(Settings) page. Those 3 keys are:
1.
Publishable Key (Starts with a 'pk' and is found in the developers page).
2.
Secret Key (Starts with an 'sk' and is found in the developers page)
3.
Client ID (Starts with a 'ca' and is found in the developers page)
Replace the copied API keys with the already existing API keys in the Stripe and Stripe.js plugin.
Custom HTML styles
In some cases, users with the Hobby plan (due to plan limitation of custom headers used in template) may experience visual flaws in the custom HTML styles of the index page. To fix this, please do the following:
1.
Find in the index page within its properties window the Page HTML Header parameter and copy its value:
2. Create a new HTML element and place it on the index page (wherever you want):
3. Paste the code you've copied from the Headers into this HTML element on the page: