Hi there!
To start using our tool on your website, simply copy and paste this code:
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>House Cleaning Cost Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
.calculator {
max-width: 600px;
margin: 0 auto;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
}
.form-group input,
.form-group select {
width: 100%;
padding: 8px;
box-sizing: border-box;
}
.result {
margin-top: 20px;
font-size: 1.2em;
font-weight: bold;
}
.backlink {
margin-top: 20px;
text-align: center;
}
.backlink a {
color: #0066cc;
text-decoration: none;
}
.backlink a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div class=”calculator”>
<h1>House Cleaning Cost Calculator</h1>
<div class=”form-group”>
<label for=”size”>Size of the house (in square feet):</label>
<input type=”number” id=”size” min=”0″>
</div>
<div class=”form-group”>
<label for=”bedrooms”>Number of bedrooms:</label>
<input type=”number” id=”bedrooms” min=”0″>
</div>
<div class=”form-group”>
<label for=”bathrooms”>Number of bathrooms:</label>
<input type=”number” id=”bathrooms” min=”0″>
</div>
<div class=”form-group”>
<label for=”cleaning-type”>Type of cleaning:</label>
<select id=”cleaning-type”>
<option value=”standard”>Standard</option>
<option value=”deep”>Deep</option>
<option value=”move-in-out”>Move-In/Move-Out</option>
</select>
</div>
<div class=”form-group”>
<label for=”additional-services”>Additional services (check all that apply):</label>
<label><input type=”checkbox” id=”fridge” value=”20″> Clean inside fridge (+$20)</label>
<label><input type=”checkbox” id=”oven” value=”25″> Clean inside oven (+$25)</label>
<label><input type=”checkbox” id=”windows” value=”30″> Clean windows (+$30)</label>
</div>
<button onclick=”calculate()”>Calculate</button>
<div class=”result” id=”result”></div>
<div class=”backlink”>
<a href=”https://wildbroomcleaning.com” target=”_blank”>House Cleaning</a>
</div>
</div>
<script>
function calculate() {
const size = parseFloat(document.getElementById(‘size’).value) || 0;
const bedrooms = parseInt(document.getElementById(‘bedrooms’).value) || 0;
const bathrooms = parseInt(document.getElementById(‘bathrooms’).value) || 0;
const cleaningType = document.getElementById(‘cleaning-type’).value;
let basePrice = size * 0.1 + bedrooms * 10 + bathrooms * 15;
switch (cleaningType) {
case ‘deep’:
basePrice *= 1.5;
break;
case ‘move-in-out’:
basePrice *= 2;
break;
}
const additionalServices = document.querySelectorAll(‘#additional-services input[type=”checkbox”]:checked’);
let additionalCost = 0;
additionalServices.forEach(service => {
additionalCost += parseFloat(service.value);
});
const totalPrice = basePrice + additionalCost;
document.getElementById(‘result’).innerText = ‘Estimated Cost: $’ + totalPrice.toFixed(2);
}
</script>
</body>
</html>
