Introducing CleanCloud's Website Builder
Create a tailored website for your business with ease. CleanCloud's new Website Builder offers customizable templates and robust design tools to help you establish an online presence.
Accessing the Website Builder
Navigate: Go to Settings → Admin → Hosted Website.
ⓘ If you’ve used the older Free Hosted Website feature, access it at this link. However, we recommend switching to the new builder for improved functionality.
Website Setup
Hosted Website Wizard: The setup wizard guides you through key settings.
Basic Settings: Add your website name, address, contact info, and social links.
Analytics: Integrate Google Analytics, Google Tag Manager, and Meta Facebook Pixel.
Template: Choose between the Default or Basic templates.
Appearance: Customize colors, fonts, and design elements.
📌 Note: All settings can be edited later.
Maintenance Mode
Maintenance Mode allows you to temporarily hide your website from public view while you’re working on it or preparing it for launch.
When enabled, visitors will see a simple page displaying your logo, a short message, and your contact details—all automatically pulled from your Website Builder settings.
You can use this feature to:
Safely make updates without showing unfinished content
Display a “Coming Soon” page while you build your site
Ensure visitors can still contact you even when the site is offline
To turn Maintenance Mode on or off, go to your Website Builder and toggle the Maintenance Mode switch in the Settings section.
Customizing Your Website
This is the space where you can personalize your website, choose templates, add content, and make any other adjustments you need. Below, we will outline some of the fundamental steps.
1. Website Settings
Name, Description, Keywords | Choose a catchy name for your website, provide a brief description, and add keywords to improve search engine visibility. |
Price Settings | Select the currency symbol and format for displaying prices. |
Contact Information | Add your email address and phone number for visitors to reach you easily. |
Logo | Upload your logo to brand your website and make it recognizable. |
Favicon | Upload a favicon to appear in browser tabs, reinforcing your brand identity. This would usually be a smaller size of your logo that's recognizable. |
Cookie Policy | You can enable the cookie modal for your hosted website. |
Social Links | Connect your website to your social media profiles by adding links to platforms like Facebook, Instagram, and X (formerly Twitter). |
App Links | If you have a mobile app, provide links to the Apple App Store and Google Play Store for visitors to download. |
Analytics | Add Google Analytics and Meta Analytics links to track visitor behaviour and monitor website performance. |
Domain | Connect your custom domain to your CleanCloud-hosted website for a branded web presence. |
🪄 Tip: Please visit our helpful guide to help you connect your domain.
2. Pages
Adding New Page: By following these steps, you can easily add new pages to your CleanCloud-hosted website and optimise them for search engines and external sharing.
Open the left-side toolbar and select 'Pages'.
Tap on '+ New Page'.
3. Setting Page Details
Set the page title, page URL, and parent page (if creating sub-pages).
If you want to direct customers to an external website or blog page, untick 'Automatically create URL from the page name' and replace 'Page URL' with the full external link.
Choose where to display the page: in the top menu, footer menu, or both.
4. SEO Section
Each new page creation includes an SEO section:
Page Title: The title is displayed in search engine results and on social media when shared.
Page Description: A brief summary of the page content.
Page Keywords: Terms related to the page content for search engine optimisation.
Image for External Sharing: An image that will be displayed when the page is shared on external websites or social media platforms.
Enter the relevant information for the SEO section.
Tap on 'Save', and a new blank page will be created with the specified settings.
🪄 Tip: We have used 600x314 px sizing for the sharing image. This will vary on each external website where this link will be shared.
Editing New Page
By following these steps, you can easily edit and customize the content of your new page in CleanCloud, making it tailored to your needs and preferences.
1. Toggle on 'Edit Page' ON to enter editing mode.
2. To add content to your website:
Tap on ’+ Add block’.
You’ll see a list of block categories. Selecting a category will open a secondary list with specific block types.
You can hover over the items in the secondary list to preview each block before adding it.
3. You can combine blocks by selecting 'Text column blocks', which splits the view into 1 to 5 columns, allowing for versatile content arrangement.
Example Pages
Subscription
Contact Page
🔍 This page was created with the 'Text column blocks' > '2 col'. You can then combine the number of blocks together (e.g. text, contact form).
Pricing Page
About Us Page
🔍 This page was created with the 'Text column blocks' > '3 col'. You can then combine the number of blocks together (e.g. icons, text).
Home Page
🔍 This page was created with the 'Hero left block'.
Hide Blocks on Mobile
You have the ability to hide specific blocks - such as images, text, or sections - when your website is viewed on mobile devices.
This is useful for optimizing the mobile experience by removing elements that may not display well or aren’t necessary on smaller screens.
To hide an item on mobile:
Hover over the block you want to hide (e.g., a photo or text section).
Go to Settings > Box.
Find the Hide on mobile option and set it to Yes.
Once enabled, that block will be hidden from view when your site is visited on a phone or small screen.
This helps create a cleaner, faster, and more user-friendly mobile layout.
Contact Forms & Custom Fields
Contact Forms let visitors reach out to you directly from your website. They’re quick to set up and easy to customize to fit your needs.
Adding a Contact Form
To add a Contact Form to your page:
Tap on + Add Block.
Select Contact Form from the block options.
The form will be added to your page, ready for customization.
Contact Form Settings
Once the form is added, you can fine-tune it to suit your preferences:
Deliver To – Choose the email address where form submissions will be delivered.
E-mail Subject – Customize the subject line of the notification email.
Success Message – Set the message visitors will see after successfully submitting the form.
To access these settings, just hover over the form, then select Settings.
Adding Custom Fields
Need more than just name and email? You can add custom fields to collect the info you need.
To add a custom field:
Tap on the Contact Form, then go to Settings.
Type in the Field Name (label shown to visitors).
Enter a Placeholder (e.g. “Your message here…”).
Select whether the field is required.
Tap on the blue +, then OK.
Your custom field will now appear on the form.
You can select from short and long text, dropdowns, tick boxes and check boxes.
This makes it easy to tailor your form to your business - whether you’re collecting phone numbers, booking details, or other specific information.
Navbar: Contact Info & Mobile Display Options
The Navbar at the top of your website can display important contact information, including:
Email address
Phone number
Opening hours
Business address
This ensures your visitors can easily get in touch, especially from mobile devices.
How to Adjust Navbar Display on Mobile
Hover over the Navbar on your website.
Click on Navbar Settings.
Go to the Top Line section.
Find Display on Mobile, then select your preferred layout:
Full, Compact, Ultra Compact, or None.
Mobile Display Options
You can choose how the navbar appears on mobile to best suit your design and user experience needs. There are four display modes:
Full Navbar
Each detail (email, phone, hours, address) appears in its own row.
Great for clarity and visibility.
Compact
Opening hours are shown in a single row.
The rest are shown as tappable icons (e.g. tap the phone icon to call directly).
Ultra Compact
All icons appear in one row - minimal and sleek.
Each icon is interactive and leads to a relevant action (e.g., open maps, call, send email).
None
Hides the navbar entirely on mobile devices.
These options help you keep your site both functional and beautifully optimized for smaller screens.
Announcement Bar
The Announcement Bar appears at the top of your website and is a great way to highlight special offers, promotions, or important updates for your customers.
How to enable and customize the Announcement Bar
Navigate to Hosted Website.
Click the Settings menu on the left-hand side.
Select Global Blocks, then choose Announcement Bar.
Toggle the Show bar option and enter your message. You can customize the background color, text color, and font to match your branding.
This feature helps keep your visitors informed and engaged - perfect for announcing limited-time deals, holiday hours, or new services.
Popup Banner
The Popup Banner appears in the center of your website as an overlay and is a great way to highlight special offers, promotions, or important updates for your customers.
How to enable and customize the Popup banner
Navigate to Hosted Website.
Click the Settings menu on the left-hand side.
Select Global Blocks, then choose Popup banner.
Toggle the Show popup banner option.
Popup Banner Settings
Show Delay
Choose how many seconds after a visitor opens your website the popup will appear.
Display Frequency
Choose how often the popup is shown to each visitor.
Every Visit Until Closed (Recommended for important announcements)
The popup will appear every time a visitor loads a page until they close it using the X button. Once closed, it will stay hidden for that visitor unless the popup is updated or their browser data is cleared.Once Per Session
The popup will only appear once during the visitor’s current browser session. If they refresh the page, it will not appear again. It will show again when they start a new browser session.Once Per Day
The popup will appear once every 24 hours for each visitor.
Note: If a visitor closes the popup using the X button, it will remain hidden regardless of the display frequency setting until the popup is updated or the visitor clears their browser data.
Banner Size
Choose the size of your popup banner.
We recommend Fit Height to Content, as the popup will automatically resize to match the content inside.
Editing the Popup
To edit your popup, turn Edit Page On. The popup will also be visible while you’re editing the website so you can make changes in real time.
If the popup is blocking your view while editing, simply click the X in the top-right corner to close it. You can continue editing and reopen it whenever needed.
Editing your popup works just like editing any other page on your website, so all the usual editing tools are available.
You can add and arrange blocks, edit content, access block settings, and customise the popup in the same way you would when editing a page.
Footer
The footer appears at the bottom of your website and can be used to display useful links, contact information, social media links and additional menus.
Editing Your Footer
Editing your footer works in the same way as editing the rest of your website.
Turn Edit Page On, scroll down to the footer and tap Settings. From here, you can choose what you’d like to display and customise the available options.
Secondary Footer Menu
You can add a secondary menu to organise your footer into additional columns. This is useful for grouping pages together and keeping your main navigation simple.
For example, you could create a column for:
Legal – Privacy Policy, Terms & Conditions, Cookie Policy, etc.
Service Areas – Ideal if you have separate pages for the different locations or areas you serve.
Useful Links – Any other pages you’d like to group together.
To add a secondary menu, go to your Footer Settings and set Show Secondary Footer to Yes.
You can also choose the title that appears above the menu, such as Legal, Service Areas or Useful Links.
Adding Pages to the Secondary Footer Menu
To choose which pages appear in this menu:
Go to Pages.
Edit the page you want to add.
Find Show in Menus.
Select Secondary Menu Footer.
To change the order of these pages, go to Pages → Secondary Footer Menu and arrange them in your preferred order, just as you would with your main navigation or standard footer menu.
Social Links
If you’ve already added your social media links to your website, you can also choose to display them in the footer.
Go to your Footer Settings to enable social links. You can also customise the title that appears above them.
Contact Information
You can also display your contact information directly in the footer.
This can be enabled from your Footer Settings, where you can also customise the title that appears above the contact details.
Online Booking Tool: Multi Store
If your business offers Pickup & Delivery, the Online Booking Tool is automatically enabled on your website. This tool allows customers to place orders directly through your site.
If you operate multiple store locations, you can use a single website to manage them all. Customers will see a dropdown menu, letting them choose which store they want to book from.
How to Set Up Multi Store Booking
To enable the Multi Store feature:
Go to the page that contains your Online Booking Tool.
Hover over the booking tool and click Settings.
Under Type, select Multi Store.
Tap + Add Store.
Enter: Store Name (how it will appear in the dropdown) and Store ID (found in your CleanCloud account under Settings > Admin)
Repeat this step to add multiple store locations.
What Customers See
Once set up, your customers will:
See a dropdown menu at the top of the booking tool.
Choose the store location they wish to order from.
Continue booking as usual with all the correct store-specific settings applied.
This feature helps streamline operations while giving your customers a smooth, location-aware experience—all from a single website.
Privacy, Terms & Cookie Policy
1. Privacy Policy & Terms
Kindly note that the Privacy Policy and Terms & Conditions must be provided by yourself and then implemented into the relevant pages.
2. Cookie Modal
 |
Cookie Policy is now part of the Settings in your hosted website.
|
FAQs and Additional Help
Explore FAQs for CleanCloud's Website Builder, your go-to resource for crafting a personalized online presence for your laundry business.
🤓 Learn more: Visit our Website Builder Landing Page for inspiration.
🛟 Need more help?
Explore our Help Center articles for answers. Contact us for further assistance.