*The calculator and checkout forms change according to how your account is set up: Hourly pricing vs. Standardized pricing
Both pricing types have different calculators and checkout forms for you to use/show on your website. See the preview at the bottom of this article.*
Installing our calculator and booking form consists of 3 things:
- Calculator form - this is the customer facing form at the front of your website. It gives customers immediate pricing (standardized/hourly) based on their selection.
a. The pricing, frequencies, and number of bedrooms and bathrooms are determined through our Pricing module.
b. Active Subscriptions will show up on this form and the maximum number of bedrooms and bathrooms will show up here as well. - Booking page URL - the URL/destination of your checkout page. This links your calculator to the checkout page - it is required to be filled out. Example: https://www.maidtoglow.com/book
- Checkout (Booking) form - this is the main form used to collect customer information such. This will be the "checkout" page for your website, customers will go here to finish booking.
Every booking that comes through your newly integrated online checkout process will be fully reflected in MMIO.
Go to Settings -> Booking forms & Communications -> Booking forms
- Click into the Calculator, checkout, quote pages block
Customizing & Installing the Calculator form
Before installing the calculator form you have the option to make a few edits:
- You can edit the button colors - choose from the Main color selection
- You can edit the font colors - choose from the Font color selection
- You can edit the font size - choose from the Font size selection
- You can preview the changes to the calculator form below that
Booking calculator Installation:
- To install the calculator form follow the 3 steps outlined below the preview window
- Our embed forms work on most websites (Wordpress, Wix, Squarespace, Webflow, Shopify, custom websites)
- Please reach out to us if you are having trouble installing our embed forms - we can install it for you: hello@modernmaid.io
- Make sure to 'Save' your work at the bottom of the page
Setting up your Booking Page URL
In order to connect your calculator form to your checkout page you need to fill out this field in MMIO.
- This is the URL or destination of your checkout page - based on your website. Example: www.maidtoglow.com/book is the URL for the checkout page for Maid to Glow.
- Make sure to paste/write your URL in this area
- Make sure to 'Save' your work at the bottom of the page
Customizing & Installing the Checkout (booking) form
Before installing the checkout form you have the option to make a few edits:
- You can add 'Additional information' text fields to the checkout form
- You can edit the button and branding colors - choose from the Main color selection (under the 'Additional information' boxes
- You can create 2 different types of custom fields that will appear at the bottom of either the 'Services and extras' and/or 'Contact details'
Previewing changes made to the booking page
- You can preview the changes you've made to the checkout form in the 'Preview' section
Booking (checkout page) Installation:
- To install the booking (checkout) page form follow the 3 steps outlined below the preview window
- Our embed forms work on most websites (Wordpress, Wix, Squarespace, Webflow, Shopify, custom websites)
- Paste the code anywhere between the tag on the page of your website that you want it to appear on (usually done as the checkout, the final page a customers goes on). The tag is a standard tag across any website builder platform and is found in the CSS code
- Please reach out to us if you are having trouble installing our embed forms - we can install it for you: hello@modernmaid.io
- Make sure to 'Save' your work at the bottom of the page
Hourly Calculator Form
If you are using Hourly pricing then your Calculator Form will look like this:
Hourly Checkout Form
If you are using Hourly pricing then your Checkout form will include the hours for purchase and the rate:
Need help with this? We can do it for you! Just ask by emailing us at hello@modernmaid.io