• Trustpilot 4.8/5
Log ind

Payroll

Udregn hurtigt og nemt din Zenegy Payroll pris og opdag hvordan du kan spare penge

Zenegy Payroll & HR er en ny måde at tænke og arbejde med løn på. For første gang er fokus på jeres tid, jeres produktivitet og struktur.

*{ box-sizing: border-box; } .payroll-prisberegner-root { font-family: ‘roboto’, Arial, sans-serif; background: #f7f9fc; margin: 0; padding: 2rem; display: flex; justify-content: center; align-items: flex-start; } #prevBtn { margin-right: 10px; border: 1px solid #a9b0bf; background: transparent; color: #a9b0bf; } #nextBtn.with-margin { margin-left: 10px; } #invoices{ accent-color: #CF4E95; } #stepContainer { text-align: center; } .contactdetails { display: flex; flex-direction: row; width: 100%; justify-content: center; align-items: center; gap: 1rem; } .contactdetails > div { display: flex; flex-direction: column; gap: 1rem; width: 50%; } .contactdetails > div input { width: 200px; height: 40px; padding: 0.5rem; font-size: 1rem; } #firstName::placeholder, #lastName::placeholder, #email::placeholder, #phone::placeholder { color: #a9b0bf; font-weight: 500; } #countryCode { margin-bottom: 15px; padding: 0px; } #firstName, #lastName, #email { width: 100%; margin: 0; margin-bottom: 15px; height: 40px; color: #aeb7c9; } #phone { width: 70%; margin: 0; margin-left: 15px; margin-bottom: 15px; height: 40px; color: #aeb7c9; } #phoneContainer { display: flex; } .container { max-width: 600px; width: 100%; background: white; padding: 2rem; border-radius: 16px; box-shadow: 0 4px 20px rgba(0,0,0,0.1); } .payroll-prisberegner-root h2 { margin: 0 0 0.5rem 0; font-size: 28px; color: #1d2951; font-weight: 700; } .payroll-prisberegner-root p { color: #a9b0bf; margin-bottom: 2rem; margin-top: 6px; font-weight: 500; font-size: 14px; } .progress { color: #CF4E95; font-weight: 500; font-size: 0.9rem; margin-bottom: 1rem; } select, input[type=”text”], input[type=”email”], input[type=”tel”], input[type=”number”] { width: 30%; padding: 0.4em 0.8em; margin: 0 auto; border-radius: 32px; border: 1px solid #d1d5db; font-size: 1rem; border: 2px solid #CF4E95; display: flex; color: #CF4E95; font-weight: 600; } .yes-no-buttons { display: flex; justify-content: center; gap: 1rem; margin-top: 1rem; } .choice-btn.active { background-color: #CF4E95; color: white; } button.choice-btn { padding: 0.5rem 1.2rem; border-radius: 20px; border: 2px solid #CF4E95; background: white; color: #CF4E95; font-weight: bold; cursor: pointer; } input[type=”range”] { width: 100%; margin-bottom: 0.5rem; } .range-value { font-weight: bold; text-align: center; color: #111827; margin-bottom: 1.5rem; } .toggle-switch { display: flex; justify-content: center; margin-bottom: 2rem; } .toggle-switch input[type=”checkbox”] { appearance: none; width: 48px; height: 28px; background-color: #d1d5db; border-radius: 999px; position: relative; outline: none; cursor: pointer; transition: background-color 0.2s; } .toggle-switch input[type=”checkbox”]::before { content: ”; position: absolute; width: 20px; height: 20px; background: white; border-radius: 50%; top: 4px; left: 4px; transition: transform 0.2s ease; } .toggle-switch input[type=”checkbox”]:checked { background-color: #CF4E95; } .toggle-switch input[type=”checkbox”]:checked::before { transform: translateX(20px); } .navigation { display: flex; justify-content: center; align-items: center; gap: 10px; } #prevBtn, #nextBtn { margin-top: 20px; min-width: 120px; } button { padding: 0.9rem 1.5rem; border: none; border-radius: 30px; background: black; color: white; font-size: 1rem; cursor: pointer; font-weight: bold; transition: background 0.2s ease; } button:hover { background: #CF4E95; color: #fff; } button[disabled] { background: #ccc; cursor: not-allowed; } .result-line { display: flex; justify-content: space-between; margin-bottom: 0.75rem; font-size: 1rem; color: #111827; } .result-line span:nth-of-type(1) { width: 350px; text-align: left; color: #867676; } .result-line span:nth-of-type(2) { font-weight: 600; } .result-highlight { text-align: center; margin-top: 2rem; } .result-highlight span { color: #CF4E95; font-size: 1.6rem; font-weight: bold; } label { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.9rem; color: #4b5563; text-align: left; } label input[type=”checkbox”] { transform: scale(1.2); } @media (max-width: 700px) { .contactdetails{ flex-direction: column; } .contactdetails > div { width: 100%; } select, input[type=”text”], input[type=”email”], input[type=”tel”] { width: 80%; } .result-line span:nth-of-type(1){ width:225px; } .result-line span:nth-of-type(2){ width:auto; text-align: right; } }

let currentStep = 0; const answers = { businessType: “”, invoices: 0, wantsAutomation: null, firstName: “”, lastName: “”, email: “”, phone: “”, acceptedTerms: false }; const businessTypes = [ “Auto & Leasing”, “Administrative tjenesteydelser og hjælpetjenester”, “Konstruktion og ingeniør”, “Byg og håndværk”, “Detailhandel og butik”, “El- og vandforsyning”, “Engros virksomhed”, “Hotel og restauration”, “Information og kommunikation”, “IT og software”, “Konsulentydelser”, “Kultur og sport”, “Køb, salg og leje af ejendomme”, “Landbrug og fiskeri”, “Frisør, massør og andre liberale fag”, “Medicin, sundhed og læger, inkl. veterinær”, “Offentlig forvaltning og forsvar”, “Pengeinstitut- og finansvirksomheder”, “Produktionsvirksomhed”, “Råstofindvinding”, “Reklame og marketing”, “Revision eller eksternt bogholderi”, “Transport og godshåndtering”, “Undervisning”, “Værksteder og mekanikere”, “Andet, eller findes ikke på listen” ]; const steps = [ { title: “Hvilken slags virksomhed har du?”, subtitle: “(Eksempel: café, frisør, håndværker, konsulent osv.)”, render: () => ` Vælg fra listen ${businessTypes.map(b => `${b}`).join(“”)} ` }, { title: “Hvor mange lønsedler laver i pr. mdr?”, subtitle: “(Et gør på hvor mange lønsedler i laver om måneden)”, render: () => ` ` }, { title: “Bruger du en ekstern bogholder eller revisor til håndtering af løn?”, subtitle: “(Så slipper du for selv at huske det)”, render: () => `

` }, { title: “Indtast dit navn og detaljer”, subtitle: “Du får prisen på skærmen i næste trin.”, render: () => `

🇩🇰 +45 🇸🇪 +46 🇳🇴 +47 🇬🇧 +44 🇺🇸 +1

` } ];//#CF4E95 function renderStep() { const btn = document.getElementById(“nextBtn”); const step = steps[currentStep]; document.getElementById(“stepContainer”).innerHTML = `

Spørgsmål ${currentStep + 1} ud af 4

${step.title}

${step.subtitle}

${step.render()} `; document.getElementById(“prevBtn”).style.display = currentStep === 0 ? “none” : “inline-block”; document.getElementById(“nextBtn”).textContent = currentStep === steps.length – 1 ? “Se prisen” : “Næste →”; const nextBtn = document.getElementById(“nextBtn”); nextBtn.classList.toggle(“with-margin”, currentStep !== 0); setupValidationHandlers(); validateStep(); } function validateEmail(email) { const emailPattern = /^[^s@]+@[^s@]+.[^s@]+$/; return emailPattern.test(email); } function validatePhoneNumberByCountry(code, number) { const cleaned = number.replace(/D/g, ”); if (code === “+45”) { return cleaned.length === 8; } const minLengths = { “+46”: 9, “+47”: 8, “+44”: 10, “+1”: 10 }; return cleaned.length >= (minLengths[code] || 8);} function validateStep() { const btn = document.getElementById(“nextBtn”); if (currentStep === 2) { const btns = document.querySelectorAll(“.choice-btn”); btns.forEach(btn => { btn.addEventListener(“click”, () => { const value = btn.dataset.value === “true”; answers.wantsAutomation = value; btns.forEach(b => b.classList.remove(“active”)); btn.classList.add(“active”); validateStep(); }); }); } if (currentStep === 0) { const selected = document.getElementById(“businessType”).value; btn.disabled = !selected; return !!selected; } if (currentStep === 2) { const isValid = typeof answers.wantsAutomation === “boolean”; btn.disabled = !isValid; return isValid; } if (currentStep === 3) { const firstName = document.getElementById(“firstName”).value.trim(); const lastName = document.getElementById(“lastName”).value.trim(); const email = document.getElementById(“email”).value.trim(); const phone = document.getElementById(“phone”).value.trim(); const termsAccepted = document.getElementById(“terms”).checked; const isEmailValid = validateEmail(email); const countryCode = document.getElementById(“countryCode”).value; const isPhoneValid = validatePhoneNumberByCountry(countryCode, phone); const isValid = firstName && lastName && isEmailValid && isPhoneValid && termsAccepted; btn.disabled = !isValid; return isValid; } btn.disabled = false; return true; } function setupValidationHandlers() { const btn = document.getElementById(“nextBtn”); if (currentStep === 2) { const btns = document.querySelectorAll(“.choice-btn”); btns.forEach(btn => { btn.addEventListener(“click”, () => { const value = btn.dataset.value === “true”; answers.wantsAutomation = value; btns.forEach(b => b.classList.remove(“active”)); btn.classList.add(“active”); validateStep(); }); }); } if (currentStep === 0) { document.getElementById(“businessType”).addEventListener(“change”, validateStep); } if (currentStep === 2) { const isValid = typeof answers.wantsAutomation === “boolean”; btn.disabled = !isValid; return isValid; } if (currentStep === 3) { [“firstName”, “lastName”, “email”, “phone”, “terms”].forEach(id => { const el = document.getElementById(id); el.addEventListener(“input”, validateStep); el.addEventListener(“change”, validateStep); }); } } function collectInput() { console.log(“Collected answers:”, answers); const btn = document.getElementById(“nextBtn”); if (currentStep === 0) answers.businessType = document.getElementById(“businessType”).value; if (currentStep === 1) answers.invoices = +document.getElementById(“invoices”).value; // step 2 value already stored via button click if (currentStep === 2) { const isValid = typeof answers.wantsAutomation === “boolean”; btn.disabled = !isValid; return isValid; } if (currentStep === 3) { answers.firstName = document.getElementById(“firstName”).value.trim(); answers.lastName = document.getElementById(“lastName”).value.trim(); answers.email = document.getElementById(“email”).value.trim(); const countryCode = document.getElementById(“countryCode”).value; const rawPhone = document.getElementById(“phone”).value.trim(); answers.phone = `${countryCode}${rawPhone}`; answers.acceptedTerms = document.getElementById(“terms”).checked; } } function nextStep() { if (!validateStep()) return; collectInput(); if (currentStep < steps.length – 1) { currentStep++; renderStep(); } else { showResult(); } } function prevStep() { if (currentStep > 0) { currentStep–; renderStep(); } } function showResult() { const { invoices, wantsAutomation } = answers; const subscription = 100; const invoiceCost = invoices * 25; const total = subscription + invoiceCost; document.getElementById(“stepContainer”).innerHTML = `

Din pris

Zenegy Payroll abonnement:kr. 100,-

Pris for lønsedlerkr. ${invoiceCost},-

Din samlede pris:
kr. ${total},- pr. måned

`; const form = new FormData(); form.append(‘action’, ‘send_to_hubspot’); form.append(‘firstname’, answers.firstName); form.append(‘lastname’, answers.lastName); form.append(’email’, answers.email); form.append(‘phonenumber’, answers.phone); // already includes country code form.append(‘invoices’, invoices); form.append(‘usesAdmin’, wantsAutomation); form.append(‘total_payroll’, total); form.append(‘businessType_payroll’, answers.businessType); fetch(‘/wp-admin/admin-ajax.php’, { method: ‘POST’, body: form }) .then(res => res.json()) .then(data => { console.log(‘HubSpot result:’, data); }) .catch(err => { console.error(‘Submission error:’, err); }); document.querySelector(“.navigation”).style.display = “none”; } renderStep();

Payroll er en del af Zenegy Financial Suite

Zenegy er en Financial Suite

Vi dækker alle behov indenfor løn, regnskab, tidsregistrering mm.

Fremtidens økonomisystem.

Udgiftshåndtering
uden friktion.

Løn og HR i en
smart løsning.

Tidsregistrering på den nemme måde.

For revisorer
og bogholdere.

Vi er online:
Mandag - Fredag 9.00-16.00*