WarpTheme Cleaner Pro - Joomla Template

How to Set Up WarpTheme Cleaner Pro for a Joomla Cleaning Services Website

WarpTheme Cleaner Pro is a Joomla template for cleaning, janitorial, and service company websites where the first screen needs to be clear, the path to a quote request needs to be short, service cards need to be easy to scan, trust elements need to be visible, and the landing page structure needs to stay tidy. In this guide, we will not retell the product page. Instead, we will walk through how to prepare the site, which package to choose, where to find the key settings, how to build the homepage around real services, and how to verify that the template does not break menus, modules, mobile navigation, or performance.

The template is built around a stack of Helix Ultimate, SP Page Builder, and extra WarpTheme elements. That means the site's appearance is controlled not by a single setting, but by several layers: the Joomla template style, the Template Options panels, layouts and sections in SP Page Builder, Joomla modules, menu items, and, when needed, small safe CSS tweaks. If you change those layers randomly, the site quickly turns into a collection of attractive but poorly connected blocks. If you work through them in order, Cleaner can be adapted for apartment cleaning, office cleaning, post-construction cleanup, recurring service, and local service landing pages.

This guide is written for a Joomla administrator, site owner, or developer who already has the template archive and wants to understand the practical setup logic. You will find installation steps, a map of the primary settings, a homepage example, result checks, common issues, and similar alternatives. Exact versions, update dates, and edge cases are moved to the source and notes files so the guide itself does not overload the reader with dates.

What You Need to Understand Before You Start

Cleaner works best not as an all-purpose site builder "for everything," but as a ready-made foundation for a service website focused on getting a contact request quickly. The original demo shows a recognizable flow: a contact bar at the top, then the logo, menu, request button, a large hero section, a service booking form, an "about the company" block, trust logos, workflow steps, and service cards. For a cleaning business, that is a strong structure because visitors usually do not come to read a long company story. They want to confirm three things quickly: does the company offer the service they need, can they submit a request, and does the business look trustworthy enough.

The main goal during implementation is not to leave the demo as-is, but to replace it with a working business model. Cleaning companies often cover different service lines: recurring apartment cleaning, commercial cleaning, deep cleaning, post-renovation cleanup, window washing, upholstery cleaning, office service, and recurring visit plans. Each group needs its own pages, pricing or pricing guidance, result photos, objection-handling answers, and request form. A solid WarpTheme Cleaner Pro setup starts with a service map, not with choosing a button color.

The template is especially useful if you want a fast start from a demo site, visual editing through SP Page Builder, module positions for Joomla blocks, and a flexible header based on Helix Ultimate. It may be less convenient if the project requires a fully custom design from scratch, a complex user account area, unusual booking logic, deep CRM integration, or a fully headless architecture. In those cases, Cleaner can still serve as the starting layer for the public-facing site, but the business logic should be handled with separate extensions.

Who This Template Is Best For

This template makes sense for local service businesses, small franchises, commercial cleaning contractors, post-construction cleanup specialists, recurring apartment cleaning services, and teams that want a polished Joomla website quickly. It provides a clear visual language: a light foundation, blue accents, orange calls to action, large typography, and photos of people at work. That style works well for a service business that needs to communicate cleanliness, order, and a simple booking process at the same time.

Cleaner also works well for a developer who does not want to build standard sections manually and instead wants to hand off a site that already includes homepage logic, service cards, a "how it works" block, and contact areas. The important part is deciding in advance who will maintain the content after launch: a Joomla administrator, a content manager, or a developer. If the client will edit sections in SP Page Builder directly, it is better to leave short instructions and avoid overcomplicating the structure with unnecessary nested rows.

When Cleaner Is Not the Right Starting Point

If the website is built around a product catalog, complex online payments, multi-step booking with staff schedules, or a large user account area, Cleaner does not replace specialized components. The template listing mentions enhanced styling support for HikaShop, but that does not turn the template into a full cleaning order management system. Selling products, subscriptions, or prepaid services requires a separate architecture: an e-commerce component, shipping rules, notifications, statuses, personal data handling, and form protection.

The second limitation is a team with no Joomla experience. Quickstart really does help you get a site that looks like the demo, but it is a complete Joomla website. It cannot be uploaded into an existing project the way a normal template can. If you already have a site with content, users, menus, and extensions, installing Quickstart into that same folder is the wrong choice. For an existing site, you need the template package first, then you configure styles, modules, and pages manually.

Packages, Quickstart, and Standard Installation: Which Path to Choose

WarpTheme gives you two practical installation scenarios. The first is the standard template package. It is installed into an existing Joomla site through System - Extensions - Install, after which the template is assigned as the default style or linked to selected menu items. This option is appropriate when the site already exists and has its own structure, articles, users, extensions, and database. It does not bring in demo content automatically, but it also does not disrupt the existing project.

The second scenario is Quickstart. In WarpTheme documentation, it is described as a full Joomla demo package: the CMS, the template, extensions, configuration, and demo data. Quickstart is installed as a new website and must run in a clean environment with a separate database. Quickstart cannot be installed inside an existing Joomla site as an extension. It is not a template zip file, but a complete site that must be unpacked and restored through the full installation process.

When to Choose Quickstart

Quickstart is useful if you are building a new site and want a structure close to the demo. It speeds up the work: you can see ready-made pages, blocks, module positions, template settings, styles, and content examples. For a beginner, it is also a training tool: you can open a demo page, see which module or SP Page Builder section controls a specific fragment, and then replace the images and text with your own.

But Quickstart requires discipline. Before installation, prepare a clean folder, a separate database, and access to your hosting control panel. Right after restoration, replace the demo user, verify administrator permissions, configure email, enable backups, and remove any demo content the site does not need. Do not leave placeholder services, sample testimonials, or someone else's partner logos in place. On a service website, that is not a minor issue: visitors quickly notice when a page looks like a template instead of a real company.

When to Choose the Standard Template Package

The standard package is what you need if you already have a Joomla site. Installing it is similar to installing other extensions: upload the zip file, wait for the successful installation message, then open System - Site Template Styles, select the Cleaner style, and assign it. If the site is large, do not make the template the default style immediately. First, attach it to a test menu item or a hidden page so you can check the header, module positions, content styles, and conflicts with the current extensions.

When you install only the template, demo pages do not appear automatically. That is normal. You will need to build the homepage in SP Page Builder or recreate the necessary blocks manually, publish modules in positions, configure the menu, and review article styling. This path is slower, but it is safer for a live site.

What to Check Before Uploading the Archive

Before installation, review three groups of requirements: server, Joomla, and content. For the server, look at the PHP version, PHP modules, memory limits, file permissions, and database access. For Joomla, check core currency, backups, third-party extension compatibility, and rollback options. For content, prepare the service list, logo, contacts, photos, hero copy, legal pages, and menu map.

• Create a backup. Before replacing a template or installing Quickstart, you need a way to restore the site to its original state.
• Check file permissions. WarpTheme documentation specifically mentions permission issues that can prevent the extension from installing or the settings from being saved.
• Define the main lead flow. This could be a contact form, the contact component, a dedicated forms component, or a phone link.
• Prepare service images. Cleaner depends heavily on visual cleanliness, so poor photos quickly ruin the impression.
• Decide whether you need a store. If you use HikaShop for service packages or products, validate it separately instead of assuming style support means the store is fully configured.

Installation and the First Joomla Check

If you are working with the standard package, open the Joomla admin panel and go to System - Extensions - Install. Select the template archive and click Upload & Install. After installation, go to System - Site Template Styles, open the Cleaner style, and assign it as the default or link it to a test menu item. WarpTheme documentation includes a separate step for the Template Options button, because that is where the Helix Ultimate panels for the logo, header, layout, menu, typography, code, and advanced settings are opened.

If you are working with Quickstart, do not use the extension installation screen. Unpack the package into a clean site folder, create a database, and go through the restoration process as you would for a complete Joomla site. During installation, enter the database details, configure the super user, check the temporary and log paths, and then remove the installation directory. After logging into the admin panel, the first things to do are replace the credentials, review the global configuration, enable working email, and confirm that the frontend opens without errors.

First Validation After Installation

Do not start changing every color and section right away. First, make sure the template loaded correctly, the menu works, the page shows no PHP warnings, and the style is assigned to the menu item you are testing. Open the homepage in an incognito window, then in the admin panel check which template style is assigned to that menu item. If the site appears without CSS, check the cache, file permissions, SCSS compilation, and possible conflicts with optimization extensions.

Practical check: after installation, open one frontend page, one category page, one Joomla article, the contact page, and the search results page. This will show you more quickly whether the template only works on the demo page or also styles the CMS's standard views correctly.

UIkit Assets and Extra Elements

WarpTheme documentation states that when you install only the template package on an existing site, you may need the System - Extra Addon Assets plugin for additional SP Page Builder elements. It is not required just to display the template itself, but for the correct operation of extra add-ons that rely on UIkit assets. At the same time, WarpTheme specifically warns that if you are using a WarpTheme template, the option to load the UIkit Framework in that plugin should usually remain disabled, because the template already includes UIkit. This is an important detail: duplicate library loading often does not show up immediately, but later as strange animations, broken galleries, or style conflicts.

After enabling the plugin, open a page in SP Page Builder, add a simple element from the Extra Add-ons set, save it, and check the frontend. If the element does not display or looks unstyled, do not start editing CSS blindly. First verify that the plugin is enabled, the Joomla cache is cleared, aggressive CSS/JS optimization is not active, and there are no JavaScript errors in the browser console.

Settings Map After Installation: From Logo to Mobile Menu

The Template Options panels in Helix Ultimate are the central place where the administrator connects the template's appearance to the real website. In WarpTheme, they are grouped into Basic, Presets, Layout, Menu, Typography, Blog, Custom Code, and Advanced. With Cleaner, it helps to move through them not in tab order, but by impact on the user journey: brand, header, request flow, homepage, mobile navigation, performance, and only then smaller decorative refinements.

Logo, Favicon, and Contact Elements

Start with Basic - Logo. In the demo, you can see the compact "Cleaner" logo at the top of the site. On a real project, upload your own logo, set the height, and check how it looks in both the regular and mobile headers. If the logo is wide, do not just shrink it until it becomes unreadable. A better approach is to prepare a separate mobile version: a short mark, a compact wordmark, or a simplified version without the tagline.

In Basic - Contact Info, verify the phone, email, and address fields. On a cleaning services website, the contact bar should not be purely decorative. If the top panel shows a phone number, it should match the number in the form, footer, and contact page. If the company works in multiple cities, do not overload the header with every address. It is better to create a "Cities" menu item or a separate service area page.

Header and Request Button

In Basic - Header, Helix offers prepared header layouts. For Cleaner, the goal is to preserve a simple logic: the logo on the left, the menu nearby, quick access to search or contact, and a visible request button. If you change the layout, test not only on desktop, but also at tablet widths. Sometimes the header looks fine on a large monitor, but at intermediate widths the menu wraps, the request button gets squeezed, and the logo takes up too much space.

The Navbar setting can make the header sticky while scrolling. For a service website, that is useful if the request button stays available. But the sticky header should not cover anchor links or the first heading of a section. After enabling sticky mode, click the menu items that lead to page blocks and check whether the top of the block is hidden under the header.

Presets and Colors

In Presets, you can choose a prebuilt color scheme or move to a more flexible setup. In the original Cleaner visual reference, the design relies on a light background, a blue primary accent, and orange action elements. For a cleaning business, that is a clear combination: blue supports a sense of reliability, orange highlights the button, and white space reinforces cleanliness. Do not change every color at once. Start by replacing the main accent, then check buttons, links, icons, active menu states, and the request form.

If you enable SCSS changes, keep the documentation warning in mind: automatic compilation should be used intentionally and disabled in production once the site is stable. After changing the preset, clear the cache, open the site in another browser, and confirm that the new styles apply not only on the homepage, but also on Joomla articles.

Typography and Localization

In Typography, you set the fonts for body text, navigation, and headings. For a Russian-language site, Cyrillic support is especially important. WarpTheme documentation reminds you that not all Google Fonts support the required characters. If the selected font looks good in the English demo but renders Russian letters poorly, it is better to choose another font or a system typeface. Beautiful Latin characters do not guarantee good Cyrillic support.

Check typography on real text: long service names, the phone number, the address, the menu item "Post-Renovation Cleaning," the heading "Commercial Cleaning for Offices and Retail Spaces." If a line breaks a card or a button becomes too wide, the problem is not the text. The problem is that the design was never tested in the site's actual language.

Cleaner Homepage: Turning the Demo into a Working Lead Flow

The strongest part of Cleaner is the homepage structure. But the demo blocks should not remain just attractive sections. They need to be tied to the real visitor journey: understand the service, trust the company, choose the cleaning type, see an example price or service terms, submit a request, and get confirmation. If the user sees only a generic slogan and a set of identical cards, the template is not doing its job.

Hero Section and Booking Form

At the top of the demo, there is a large offer and a Book a Service form. On a real site, that form should be as short as possible. For the initial contact, you usually only need the name, phone number, service type, and area or ZIP code. If you ask for square footage, date, address, soil level, number of rooms, and extra services right away, some visitors will leave. It is better to collect the minimum and confirm the details after the call or in the next step.

Be sure to check which component or module controls the form. If it is only a demo placeholder, replace it with a working Joomla form or a component that sends emails, stores requests, and supports anti-spam protection. After configuration, submit a test request from the frontend. Check the admin email, the customer email, the admin-side record, and the form behavior when a required field is missing.

Service Cards

The service section in the demo shows several cleaning categories. On a real site, the important part is not just changing the names, but making the cards meaningfully different. "Apartment Cleaning," "House Cleaning," and "Deep Cleaning" may sound similar, but for the client they signal different expectations. Each card should include a short description, a starting price cue or a link to details, a photo, a clear button, and ideally a matching landing page.

If the company offers many services, do not place all of them on the homepage. Show the 3 to 6 main categories and move the rest into a separate catalog or a dropdown menu. The homepage should help the visitor choose a direction, not replace the entire price list.

Trust Blocks and Client Logos

The demo includes a logo strip and company description sections. That format works well, but only if the content is real. If you do not have recognizable clients, do not fake trust with random logos. It is better to show real certifications, team photos, testimonials from a verifiable source, service areas, a return-visit guarantee, or the quality control process. On a service website, trust is built through specifics, not through the number of gray logos.

Workflow Steps

A "three steps" block is useful only if it reflects the real process. For example: submit a request, confirm scope and timing, accept the completed work after cleaning. If you offer a pre-visit inspection, online estimate, contract, or recurring subscription, the steps should be different. Do not be afraid to change the demo structure. The template gives you a visual framework, not a required scenario.

Service Content Map: How Not to Leave the Template as a Set of Demo Blocks

After installing Cleaner, many users start with visual details: they change the button color, rearrange cards, or try a different header layout. That is understandable, because the template looks finished right away. But for a cleaning company website, the real value only appears when the design is connected to a specific service map. If the map is not thought through, the visitor sees a nice-looking site but cannot tell whether the company is right for their actual task.

Start by splitting services into primary and supporting categories. Primary services are the ones that deserve dedicated landing pages: apartment cleaning, office cleaning, deep cleaning, post-renovation cleanup, commercial service. Supporting services include window washing, carpet cleaning, kitchen cleaning, bathroom sanitation, trash removal, an additional technician, and evening visits. On the homepage, it is enough to show the main directions and 2 to 3 supporting signals, while moving the details inside the service pages.

Each Service Page Should Stand on Its Own

Do not make the homepage the only place where the useful information lives. A visitor may arrive from search directly on a "Post-Renovation Cleaning" or "Office Cleaning" page. That page should answer the same core questions: what is included, what is not included, how the scope is estimated, when a pre-inspection is needed, how to submit a request, what materials the team uses, how long a typical job takes, and how the result is checked. Cleaner can provide a consistent style for cards, buttons, and blocks, but the meaning of the page still has to be assembled manually.

For a service page, a structure with a short intro block, a task list, result photos, a "what is included" section, a request form, FAQ, and a short trust block works well. If you use SP Page Builder, save several sections as reusable patterns: a CTA block, "what is included" cards, testimonials, and a service area section. That way, the content manager can build new pages faster without breaking the site's overall style.

Prices and Guidance Without False Precision

In the Cleaner demo, service cards show starting prices. On a real site, that technique is useful if the company can genuinely provide an honest baseline. If the final cost depends on square footage, soil level, urgency, area, furniture, and extra work, do not promise an exact price where none exists. It is better to say "estimate after confirming square footage" or "pricing provided after request," while also giving one clear factor in the card: size, property type, frequency, or urgency.

If you publish pricing, keep it in one format. Do not mix "starting at," "approximately," "on request," "special offer," and long conditions inside the same card grid. With Cleaner, visual order matters: mixed price formats break the rhythm and look random. If the conditions are complicated, create a separate "Pricing" page and leave only a short cue on the homepage.

Testimonials, Guarantees, and Proof of Quality

A cleaning website sells trust almost as much as it sells the service itself. Cleaner has room for logos and trust blocks, but they need to be filled carefully. One real testimonial with the customer's name and work context is better than ten generic quotes. A team photo or a real result photo is better than a set of unknown logos. A short explanation of the guarantee is better than a generic "we are the best" claim.

If you show testimonials, add context: what service was provided, what type of property it was, and what the customer checked after the cleaning. If you show organization logos, make sure you have the right to use them. If you show certifications or insurance, do not hide them behind tiny gray icons. The Cleaner visual style lets you integrate this kind of proof neatly into the trust section, but the content itself still has to be verifiable.

Internal Linking Between Services

On a Joomla site, do not forget internal connections. A "Commercial Cleaning" card can link to a detailed page, and within that page you can link to "Office Cleaning," "Retail Space Cleaning," and "Recurring Service." That helps the user avoid going back to the menu, and at the same time makes the site structure clearer for search. Cleaner does not build this logic automatically: you need to plan the links in the menu, modules, articles, and SP Page Builder sections.

A good structure looks like this: the homepage gives an overview of services, each core service has its own page, related services are shown nearby, and the contacts and request form remain available at the end of every page. If the site is multilingual, mirror that structure for each language and verify the language switcher. WarpTheme changelog entries mention multilingual override improvements, but the actual language setup still depends on your Joomla configuration.

Layout, Module Positions, and Menu in a Joomla Template

Cleaner inherits an important Helix Ultimate trait: the site layout is built through sections, rows, columns, and module positions. WarpTheme documentation explains that templates provide a set of available positions, and Layout Builder lets you assign positions to columns and display modules in the right areas. This is critical in Joomla because part of the content often lives not in SP Page Builder, but in modules: menus, contacts, breadcrumbs, banners, search, the language switcher, a form, an article list, or an HTML block.

If you use Quickstart, many positions are already configured. Your job is to understand which module is published where, not to delete everything at once. If you install the standard package on an existing site, you need to map the old positions to the new ones manually. Otherwise, after switching templates, some modules will disappear from the frontend even though they remain enabled in the admin panel.

How to Work with Module Positions

Open Content - Site Modules or the corresponding modules section in your Joomla version and filter the published modules. For each important module, check the position, menu assignment, and access level. Then open Template Options - Layout and make sure that position is actually rendered in the layout. That handoff point is where mistakes often happen: the module is published, but the position is not inserted into the layout or is attached to a different template style.

For a cleaning services site, you usually need positions for the top contact bar, the main menu, the request form or request button, a trust block, the footer, extra CTA blocks, and possibly the language switcher. If you add a new position, the documentation describes the path through templateDetails.xml and then assigning the position in Layout Builder. That step is better handled by a developer or administrator who understands template updates. For most sites, the existing positions and HTML modules are enough.

Menu and Mega Menu

The Menu panel in Helix Ultimate lets you manage the menu, styles, positions, and Mega Menu. For Cleaner, Mega Menu is not always necessary. If the company has 4 to 6 services, a simple menu is usually easier to read: "Services," "Pricing," "About," "Testimonials," "Contact." If the site covers many categories, Mega Menu can work as a clean service map: residential cleaning, commercial cleaning, post-renovation cleanup, extra services, service areas. Do not turn Mega Menu into a showcase of every link on the site. It should shorten the path, not make the choice harder.

For the mobile menu, test the Offcanvas, Modal, and Dropdown modes. On a service site, the user often needs to see the phone number and request button quickly. If you choose a visually attractive but long full-screen mode, make sure the contacts are not pushed below the first screen of the menu. Also check the maximum menu depth setting: overly deep nesting works poorly on mobile.

Assigning the Style to Menu Items

Joomla lets you assign different template styles to different menu items. That is useful if the homepage needs one header variant and internal pages need another. But this flexibility is also a common source of errors. If a page suddenly opens with a different logo, a different menu, or without the required position, check Menu Item - Details - Template Style. In its documentation for the "Default Layout file is not exists" issue, WarpTheme directly links some of these errors to incorrectly assigned menu styles after a template was removed or changed.

Performance, SEO, Accessibility, and Privacy Without Risky Promises

A template alone does not guarantee a fast site or strong search visibility. It provides structure, styles, and baseline capabilities, but the final result depends on images, extensions, hosting, cache, content, and how Joomla is configured. That is why, after the visual setup of Cleaner, you still need to do a technical review.

CSS and JavaScript Optimization

In Advanced - Compression, WarpTheme documents CSS and JavaScript compression and merging. This can reduce the number of requests, but optimization should be enabled carefully. The documentation specifically warns against using CSS compression from Template Options at the same time as another optimization extension such as JCH Optimize. The practical rule is simple: one layer should be responsible for CSS compression, not two competing mechanisms.

Test optimization step by step. First enable Joomla cache or server-side cache, then check the site. Next enable CSS compression and test again. Then JavaScript optimization, if needed. If the form, mobile menu, slider, or gallery breaks after enabling a setting, roll back the last change and look for the conflict. Do not turn on every performance feature at once right before launch.

Images and the Hero Section

Cleaner depends heavily on large photography from a visual standpoint. That is good for trust, but risky for speed. Prepare images in advance: proper dimensions, web-friendly format, clear alt text, and no unnecessary weight. The hero section should not load a huge photo at full camera resolution. If SP Page Builder or a module lets you replace the image with an optimized version, do that before launching ads or getting indexed.

For SEO, meta tags are not the only factor. Review heading structure on internal pages, readable URLs, the contact page, local phrases, real testimonials, schema markup if it is added by a separate extension, and mobile performance. Do not assume a template change will fix weak content on its own. The template helps present the service, but the content is still what matters most.

Fonts and Personal Data

If the site operates in a region with strict privacy requirements, separately review external font loading, analytics, maps, and videos. WarpTheme typography documentation mentions Google Fonts selection and the option to avoid external loading in favor of system or local fonts. For a cleaning services site, this matters even more because the request form collects contact data. The privacy policy, consent to data processing, and form spam protection should not be decorative checkboxes. They need to be real parts of the website.

Updates and Ongoing Maintenance After Launch

The template lifecycle does not end on publication day. WarpTheme Cleaner has a changelog, and the documentation describes updating the template and Helix Ultimate through Joomla's standard mechanisms. In real work, it is important to separate two kinds of changes: vendor updates and your local customizations. If those layers are mixed together, every update becomes a risk to the design or page stability.

Create a simple maintenance map. It should include where the backup is stored, who updates Joomla, who updates the template, where custom.css is located, which pages are built in SP Page Builder, which modules are critical for requests, and which extensions handle the form, cache, and optimization. This map does not need to be a complex document. One file or one knowledge base page is enough as long as it clearly states what should not be changed and what must be tested after an update.

How to Update Without Losing Customization

WarpTheme documentation says that, when updating the template package, you usually do not need to uninstall the previous version first: the new package is installed through System - Extensions - Install, and the files are updated. That is convenient, but it does not remove the need for a backup. Before updating, back up the site and database, especially if you changed custom.css, added positions, modified the layout, or connected extra extensions.

After the update, do not check only the homepage. Open the request page, the form, internal service pages, the mobile menu, the contact page, and one standard Joomla article. If CSS/JS compression is enabled, clear the cache and run the check again. If local CSS is used, make sure the file is still in place and does not conflict with the new template styles.

What to Do with Client Changes

Clients often edit text directly in the visual builder and accidentally change spacing, colors, or the section structure. To prevent that, leave them clear responsibility boundaries. For example: they can change text, photos, and links inside service cards; they should not remove containers, change CTA classes, disable the form, edit global styles, or modify compression settings. If the client has access to SP Page Builder, create copies of important pages or saved sections so they can be restored without rolling back the entire site.

It is also useful to create a test page called "Section Draft." That page can be used to try new service blocks, testimonials, promotional offers, and seasonal banners. Once a block is approved, it gets moved to the homepage. That way, the live page does not turn into a lab, and Cleaner keeps its clean rhythm.

A Mini Audit Every Few Months

Periodically review the things that usually fail quietly: forms still send emails, the phone number is clickable, the map is not blocked, photos have not disappeared, SSL still works, the policy page opens, the cache is not serving an outdated version, the menu does not contain empty links, and the admin panel shows no critical update warnings. On a service site, a single broken form can cost you real leads.

Also review the service pages separately. If the company added a new service, changed its coverage area, or updated its evaluation process, that should appear on the website. Cleaner helps present information well, but outdated content still weakens trust. A cleaning services site should function as a living reference for the company's services, not as a one-time storefront left behind after template installation.

Safe Enhancements Without Editing the Template Core

WarpTheme documents two safe paths for small changes: the Custom Code panel and separate custom.css, custom.js, or custom.scss files in the template directory. At the same time, the documentation explicitly advises against editing template.css and compiled CSS files, because those changes can be lost during recompilation or updates. So any small styling adjustments should be made in a way that allows them to be disabled quickly.

A Small CSS Tweak for the Request Button

For example, in the demo the request button is noticeable, but on your site the main CTA may get lost next to the menu items. The safest approach is to add a class to the target button in SP Page Builder or an HTML module, for example cleaner-main-cta, and style it in custom.css. This does not change the template core and is easy to roll back by removing the class or the CSS block.

.cleaner-main-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 22px;
  border-radius: 4px;
  font-weight: 700;
}

.cleaner-main-cta:focus-visible {
  outline: 3px solid rgba(255, 160, 20, 0.45);
  outline-offset: 3px;
}

After adding it, test the button on the homepage, on an internal service page, and at mobile widths. If the color comes from the template preset, do not hard-code it unless necessary. Let the CSS handle only size, focus, and readability. The rollback is simple: remove the button class or delete the block from custom.css.

Local Fonts and Cyrillic Support

If the selected font renders Russian letters poorly or you do not want to load it from an external server, use the local font file approach. WarpTheme documentation shows an example of adding @font-face through custom.scss and a fonts folder. In a real project, choose a font with solid Cyrillic support, load only the weights you actually need, and review the license. Do not connect five weights "just in case" if the site only uses regular and bold text.

Joomla Language Overrides

If you need to change Joomla system labels, form messages, or extension button text, look for language overrides first instead of editing PHP files. For a template-based site, this matters even more: an update may replace the files, while language overrides tend to survive more predictably. The approach is simple: find the language constant, create an override in Joomla, clear the cache, and check the frontend. If the string belongs to a third-party form component, review that component's documentation separately.

Practical Example: Building the Homepage for a Cleaning Company

Imagine a company that provides apartment cleaning, office cleaning, and post-renovation cleanup. The goal is to build a homepage where a visitor understands the offer in 20 to 30 seconds, sees the main services, submits a request, and can move to detailed pages. We use Cleaner as the visual base, but replace the demo logic with a working structure.

Goal

You need to create a homepage with a clear value proposition, a request form, three core services, a workflow block, trust signals, and a footer with contact details. The menu should lead to services, pricing, testimonials, and contact information. On mobile, the phone number and request option should remain available without making the user hunt through the page.

Preparation

Before editing, prepare the logo, 3 to 5 service photos, a short list of advantages, a working email for requests, the phone number, the address or service areas, privacy policy text, and the real names of the services. In Joomla, create or verify the menu items Home, Services, Pricing, About, Contact. If the site is in Russian, those menu item labels should be in Russian, while the technical interface labels in the admin panel stay in English or follow the installed Joomla language.

Setup Steps

1. Open System - Site Template Styles, select the Cleaner style, and go to Template Options.
2. In Basic - Logo, upload the logo, favicon, and a separate mobile logo if the main one is too wide.
3. In Basic - Header, choose a header layout where the logo, menu, and request button do not conflict at tablet widths.
4. In Basic - Contact Info, add the phone number and email, then verify exactly where they appear.
5. In Presets, keep the original blue-and-orange logic or carefully replace the accent with the company's brand color.
6. Open the homepage in SP Page Builder and replace the hero section: heading, subheading, CTA, and photo.
7. Replace the request form with a working form module or component, submit a test request, and verify the email flow.
8. In the services section, keep the three main categories, add links to the detailed pages, and remove irrelevant demo cards.
9. In the workflow block, describe the real process: request, scope clarification, cleaning, result check.
10. Check the mobile menu in Basic - Mobile and confirm that the user can see the phone number or request button without extra navigation.

Result Check

Open the frontend without being logged in. Click every request button, submit a test form, verify the service card links, open the menu at mobile width, scroll to the footer, and make sure the contact details match. Then open an individual service page and confirm that an important block does not depend entirely on the homepage. If a visitor lands from search directly on the "Post-Renovation Cleaning" page, they should still see a CTA, contact information, and a clear path to submitting a request.

A Detail People Commonly Miss

The demo page may feel cohesive because all the images and text were selected by one designer. Once you replace the content, the site often loses its rhythm: one card has a short title, another has a long one, a third uses a vertical photo, a fourth has different lighting. The solution is not to restore the demo copy. The solution is to normalize the content into one format: consistent heading length, a unified photo style, similar CTAs, proper spacing, and the same tone across descriptions.

Final Check Before Publishing

Before opening the site to visitors or launching ads, run a short but strict review. It helps catch errors that are easy to miss when editing one attractive page.

Test the site like a normal user: not from the admin panel, not in SP Page Builder edit mode, and not only on a wide monitor. Open the page on a phone, tap the phone number, try submitting the form with an error, navigate through the menu, return to the homepage, and open the contact page. If the path to the request still feels clear after that, the template is configured correctly.

Common Cleaner Issues and Troubleshooting in Joomla

Most issues after template installation are caused not by the design itself, but by the interaction between the Joomla style, menus, modules, cache, file permissions, and extra extensions. Below is a practical troubleshooting flow worth following before you contact support.

The Site Looks Unstyled or Part of the Layout Fell Apart

Symptom: the header is there, but the blocks look like plain HTML, icons do not appear, service cards lose their grid, and the slider or form looks different from the demo.

Possible causes: the cache is serving old files, SCSS did not compile, CSS optimization is conflicting, the required asset plugin for Extra Add-ons is not enabled, or the browser is loading an outdated file version.

What to check: clear the Joomla and browser cache, temporarily disable any third-party CSS/JS optimizer, review Advanced - Compression, make sure two compression layers are not enabled at the same time, and inspect the browser console for file loading errors.

How to fix it: return the optimization settings to a simple state, test the page, and then re-enable performance features one by one. If the issue is related to Extra Add-ons, check the System - Extra Addon Assets plugin and its UIkit settings.

A Module Is Published but Not Visible on the Site

Symptom: the module is enabled in the admin panel but does not appear on the frontend.

Possible causes: the position does not exist in the current style, the position is not rendered in Layout Builder, the module is assigned to the wrong menu items, the access level does not match the current user, or a different template style is being used.

What to check: open the module and review the position, menu assignment, and access. Then open Template Options - Layout and make sure the position exists in the layout. After that, check the style assigned to the menu item.

How to fix it: choose an existing position, publish it in the required layout, or move the module into a position that is already rendered. If the problem appeared after a template switch, save the menu item again to refresh its link to the style.

The "Default Layout file is not exists" Error

Symptom: the page does not render and reports that the default layout file is missing.

Possible cause: in WarpTheme documentation, this situation is tied to special menu items whose template style ID was assigned incorrectly after a template was deleted or changed.

What to check: open the affected menu item, review Template Style, and save the item again. If there are several affected pages, inspect each special menu item that was previously linked to a different template.

How to fix it: assign the current Cleaner style or the default value, save the menu, and clear the cache. If the error remains, check whether the required layout was removed in Template Options - Layout.

Template Settings Will Not Save

Symptom: you change the logo, color, header, or layout, but after saving the changes disappear.

Possible causes: file or directory permission issues, a conflict with a security extension, a hosting limitation, a JavaScript error in the admin panel, or an expired administrator session.

What to check: first, try saving again after logging back into the admin panel. Then review file and directory permissions. WarpTheme documentation recommends using 755 for directories and 644 for files as a reference, but the exact values should match the hosting setup.

How to fix it: do not apply broad permissions "for testing" as a permanent change. Correct the owner and permissions through the hosting panel or support, then try saving again. If the issue affects only one tab, inspect extension conflicts and the browser console.

The Mobile Menu Opens but Is Hard to Use

Symptom: the menu covers the whole screen, the request link is buried too deep, the submenu is too long, or the close button is unclear.

Possible causes: an unsuitable Offcanvas, Modal, or Dropdown mode, a menu structure that is too deep, the wrong breakpoint, or no dedicated mobile logic.

What to check: open Basic - Mobile, review the breakpoint, the menu mode, and the toggle position. Then inspect the menu structure and the maximum submenu depth.

How to fix it: simplify the mobile menu, move the phone number or request option closer to the top level, and test behavior at widths of 360, 768, and 1024 pixels. If the menu got worse after enabling JavaScript compression, disable it temporarily and retest.

When WarpTheme Cleaner Pro Is the Right Choice

WarpTheme Cleaner Pro is worth using if you need a Joomla site for a cleaning or similar service company where a clear homepage, a request form, service cards, visible trust signals, and a manageable header matter. It is especially convenient when launching a new project through Quickstart or when carefully integrating it into an existing site with a well-structured menu and module setup.

Before publishing, check not only the appearance, but also the real user path: arriving on the page, understanding the service, clicking the CTA, submitting the form, receiving the email, moving to the contact details, and viewing the site on a phone. If those steps work without unnecessary friction, the template is doing its job. If you want to continue setup on your own Joomla installation, you can get the Joomla version, prepare a test copy of the site, and go through the installation step by step using this guide.

The key is not to treat Cleaner as a picture that only needs to be uploaded. It is a combination of a template, a framework, a page builder, module positions, and content. The more accurately you connect those layers to the company's real service model, the fewer issues you will face after launch, and the clearer the site will be for visitors.