{"id":105,"date":"2026-03-30T11:54:21","date_gmt":"2026-03-30T11:54:21","guid":{"rendered":"https:\/\/dehulpstudent.nl\/?page_id=105"},"modified":"2026-03-30T13:11:36","modified_gmt":"2026-03-30T13:11:36","slug":"contact-formulier","status":"publish","type":"page","link":"https:\/\/dehulpstudent.nl\/index.php\/contact-formulier\/","title":{"rendered":"Contact Formulier"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"105\" class=\"elementor elementor-105\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e9edd3f e-flex e-con-boxed e-con e-parent\" data-id=\"e9edd3f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-256f55a elementor-widget elementor-widget-html\" data-id=\"256f55a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"nl\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Contact | De Hulpstudent<\/title>\r\n    \r\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\r\n\r\n    <script>\r\n        tailwind.config = {\r\n            theme: {\r\n                extend: {\r\n                    colors: {\r\n                        primary: '#036d8f', \r\n                        accent: '#C59400',  \r\n                        light: '#f8fafc',\r\n                        dark: '#1e293b'\r\n                    },\r\n                    fontFamily: {\r\n                        sans: ['Inter', 'Arial', 'sans-serif'],\r\n                    }\r\n                }\r\n            }\r\n        }\r\n    <\/script>\r\n    <style>\r\n        body { background-color: #f8fafc; color: #334155; }\r\n        \/* Focus styling voor extra duidelijkheid bij senioren *\/\r\n        input:focus, textarea:focus, select:focus {\r\n            outline: none;\r\n            box-shadow: 0 0 0 3px rgba(3, 109, 143, 0.3);\r\n            border-color: #036d8f;\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body class=\"antialiased font-sans scroll-smooth\">\r\n\r\n    <!-- Navigatie -->\r\n    <nav class=\"bg-white shadow-sm border-b-4 border-primary sticky top-0 z-50\">\r\n        <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n            <div class=\"flex justify-between items-center h-20\">\r\n                <a href=\"\/\" class=\"flex items-center gap-3 hover:opacity-80 transition-opacity\">\r\n                    <div class=\"bg-primary text-white p-2 rounded-lg\"><i class=\"fa-solid fa-arrow-left\"><\/i><\/div>\r\n                    <span class=\"font-bold text-xl text-primary tracking-tight\">Terug naar home<\/span>\r\n                <\/a>\r\n                <div class=\"hidden md:flex items-center gap-8\">\r\n                    <a href=\"tel:0644889940\" class=\"font-bold text-primary hover:text-accent transition-colors\">\r\n                        <i class=\"fa-solid fa-phone mr-1\"><\/i> 06 4488 9940\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/nav>\r\n\r\n    <!-- Header Sectie -->\r\n    <header class=\"bg-primary text-white py-12 lg:py-16 border-b border-blue-800\">\r\n        <div class=\"max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 text-center\">\r\n            <h1 class=\"text-3xl md:text-5xl font-extrabold mb-4\">Hoe kunnen wij u helpen?<\/h1>\r\n            <p class=\"text-lg md:text-xl text-blue-100 max-w-2xl mx-auto\">Vul hieronder kort uw gegevens in. Wij nemen zo snel mogelijk contact op om uw probleem te bespreken en eventueel een afspraak in te plannen.<\/p>\r\n        <\/div>\r\n    <\/header>\r\n\r\n    <!-- Contact Sectie -->\r\n    <main class=\"py-12 lg:py-20\">\r\n        <div class=\"max-w-6xl mx-auto px-4 sm:px-6 lg:px-8\">\r\n            <div class=\"flex flex-col lg:flex-row gap-0 bg-white rounded-3xl shadow-xl border border-gray-100 overflow-hidden\">\r\n                \r\n                <!-- Linkerkant: Het Formulier (Nu als eerste) -->\r\n                <div class=\"lg:w-3\/5 p-8 lg:p-12 border-b lg:border-b-0 lg:border-r border-gray-100\">\r\n                    <h2 class=\"text-2xl font-bold text-dark mb-6\">Stuur ons een uitgebreid bericht<\/h2>\r\n                    \r\n                    <form action=\"https:\/\/formspree.io\/f\/xeepggzo\" method=\"POST\" class=\"space-y-6\">\r\n                        \r\n                        <!-- Anti-Spam Honeypot -->\r\n                        <input type=\"text\" name=\"_gotcha\" style=\"display:none\" tabindex=\"-1\" autocomplete=\"off\">\r\n\r\n                        <!-- Naam -->\r\n                        <div>\r\n                            <label for=\"naam\" class=\"block text-lg font-bold text-gray-700 mb-2\">Uw naam *<\/label>\r\n                            <input type=\"text\" id=\"naam\" name=\"naam\" required maxlength=\"100\" placeholder=\"Bijv. Dhr. de Vries\" \r\n                                class=\"w-full px-5 py-4 text-lg bg-gray-50 border border-gray-300 rounded-xl transition-all placeholder-gray-400\">\r\n                        <\/div>\r\n\r\n                        <!-- E-mail (Verplicht) -->\r\n                        <div>\r\n                            <label for=\"email\" class=\"block text-lg font-bold text-gray-700 mb-2\">Uw e-mailadres *<\/label>\r\n                            <input type=\"email\" id=\"email\" name=\"email\" required maxlength=\"150\" placeholder=\"uw.naam@email.nl\" \r\n                                class=\"w-full px-5 py-4 text-lg bg-gray-50 border border-gray-300 rounded-xl transition-all placeholder-gray-400\">\r\n                        <\/div>\r\n\r\n                        <!-- Telefoonnummer (Optioneel) -->\r\n                        <div>\r\n                            <label for=\"telefoon\" class=\"block text-lg font-bold text-gray-700 mb-2\">Uw telefoonnummer (Optioneel)<\/label>\r\n                            <input type=\"tel\" id=\"telefoon\" name=\"telefoon\" maxlength=\"20\" placeholder=\"Bijv. 06 1234 5678\" \r\n                                class=\"w-full px-5 py-4 text-lg bg-gray-50 border border-gray-300 rounded-xl transition-all placeholder-gray-400\">\r\n                            <p class=\"text-sm text-gray-500 mt-1\"><i class=\"fa-solid fa-info-circle\"><\/i> Vul dit in als u wilt dat wij u op dit nummer terugbellen.<\/p>\r\n                        <\/div>\r\n\r\n                        <!-- Onderwerp Dropdown -->\r\n                        <div>\r\n                            <label for=\"onderwerp\" class=\"block text-lg font-bold text-gray-700 mb-2\">Waarmee kunnen wij u helpen?<\/label>\r\n                            <select id=\"onderwerp\" name=\"onderwerp\" \r\n                                class=\"w-full px-5 py-4 text-lg bg-gray-50 border border-gray-300 rounded-xl transition-all appearance-none cursor-pointer\">\r\n                                <option value=\"Kies een onderwerp\" disabled selected>Kies een onderwerp...<\/option>\r\n                                <option value=\"Computer of Laptop traag\/kapot\">Computer of Laptop is traag\/kapot<\/option>\r\n                                <option value=\"Problemen met Internet\/WiFi\">Problemen met Internet of WiFi<\/option>\r\n                                <option value=\"Printer werkt niet\">Printer werkt niet<\/option>\r\n                                <option value=\"Hulp met Telefoon of Tablet\">Hulp met Telefoon of Tablet<\/option>\r\n                                <option value=\"Wachtwoorden of Veiligheid\">Wachtwoorden of Veiligheid<\/option>\r\n                                <option value=\"Foto's overzetten\/opslaan\">Foto's overzetten of opslaan<\/option>\r\n                                <option value=\"Iets anders (vul hieronder in)\">Iets anders (vul hieronder in)<\/option>\r\n                            <\/select>\r\n                        <\/div>\r\n\r\n                        <!-- Vrij Tekstvak -->\r\n                        <div>\r\n                            <label for=\"bericht\" class=\"block text-lg font-bold text-gray-700 mb-2\">Korte omschrijving van uw probleem<\/label>\r\n                            <textarea id=\"bericht\" name=\"bericht\" rows=\"4\" maxlength=\"1000\" placeholder=\"Vertel ons kort wat er mis is of wat u wilt leren... (max 1000 tekens)\" \r\n                                class=\"w-full px-5 py-4 text-lg bg-gray-50 border border-gray-300 rounded-xl transition-all placeholder-gray-400 resize-y\"><\/textarea>\r\n                        <\/div>\r\n\r\n                        <!-- Verzend Knop -->\r\n                        <div class=\"pt-4\">\r\n                            <button type=\"submit\" \r\n                                class=\"w-full bg-accent hover:bg-yellow-600 text-white font-bold text-xl px-8 py-5 rounded-xl transition-all shadow-lg hover:shadow-xl flex items-center justify-center gap-3\">\r\n                                <i class=\"fa-regular fa-paper-plane\"><\/i> Verstuur bericht\r\n                            <\/button>\r\n                        <\/div>\r\n                    <\/form>\r\n                <\/div>\r\n\r\n                <!-- Rechterkant: Contact Info & Geruststelling (Nu als tweede) -->\r\n                <div class=\"lg:w-2\/5 bg-blue-50 p-8 lg:p-12\">\r\n                    <h2 class=\"text-2xl font-bold text-dark mb-6\">Direct contact opnemen?<\/h2>\r\n                    <p class=\"text-gray-700 text-lg mb-8\">Belt u liever direct? Geen probleem. Wij zijn voornamelijk bereikbaar in de namiddag, avonden en het weekend.<\/p>\r\n                    \r\n                    <ul class=\"space-y-6 mb-12\">\r\n                        <li class=\"flex items-start gap-4\">\r\n                            <div class=\"bg-white p-3 rounded-xl shadow-sm text-primary\"><i class=\"fa-solid fa-phone text-xl w-6 text-center\"><\/i><\/div>\r\n                            <div>\r\n                                <strong class=\"block text-gray-800 text-lg\">Bel ons op<\/strong>\r\n                                <a href=\"tel:0644889940\" class=\"text-primary font-bold text-xl hover:text-accent transition-colors\">06 4488 9940<\/a>\r\n                            <\/div>\r\n                        <\/li>\r\n                        <li class=\"flex items-start gap-4\">\r\n                            <div class=\"bg-white p-3 rounded-xl shadow-sm text-[#25D366]\"><i class=\"fa-brands fa-whatsapp text-xl w-6 text-center\"><\/i><\/div>\r\n                            <div>\r\n                                <strong class=\"block text-gray-800 text-lg\">Stuur een WhatsApp<\/strong>\r\n                                <a href=\"https:\/\/wa.me\/31644889940\" target=\"_blank\" class=\"text-gray-600 hover:text-green-600 transition-colors\">Klik hier om te appen<\/a>\r\n                            <\/div>\r\n                        <\/li>\r\n                        <li class=\"flex items-start gap-4\">\r\n                            <div class=\"bg-white p-3 rounded-xl shadow-sm text-primary\"><i class=\"fa-solid fa-location-dot text-xl w-6 text-center\"><\/i><\/div>\r\n                            <div>\r\n                                <strong class=\"block text-gray-800 text-lg\">Werkgebied<\/strong>\r\n                                <span class=\"text-gray-600\">Waalwijk en omstreken<\/span>\r\n                            <\/div>\r\n                        <\/li>\r\n                    <\/ul>\r\n\r\n                    <div class=\"bg-white p-6 rounded-2xl border-l-4 border-accent shadow-sm\">\r\n                        <h3 class=\"font-bold text-primary mb-2 flex items-center gap-2\"><i class=\"fa-solid fa-shield-halved\"><\/i> Uw privacy<\/h3>\r\n                        <p class=\"text-sm text-gray-600\">Wij gaan zorgvuldig om met uw gegevens en gebruiken deze alleen om contact met u op te nemen over uw vraag.<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n        <\/div>\r\n    <\/main>\r\n\r\n    <!-- Simpele Footer -->\r\n    <footer class=\"bg-dark text-gray-400 py-8 text-center border-t-4 border-accent\">\r\n        <p>&copy; 2026 De Hulpstudent - Waalwijk<\/p>\r\n    <\/footer>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Contact | De Hulpstudent Terug naar home 06 4488 9940 Hoe kunnen wij u helpen? Vul hieronder kort uw gegevens in. Wij nemen zo snel mogelijk contact op om uw probleem te bespreken en eventueel een afspraak in te plannen. Stuur ons een uitgebreid bericht Uw naam * Uw e-mailadres * Uw telefoonnummer (Optioneel) Vul [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-105","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/pages\/105","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/comments?post=105"}],"version-history":[{"count":10,"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/pages\/105\/revisions"}],"predecessor-version":[{"id":125,"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/pages\/105\/revisions\/125"}],"wp:attachment":[{"href":"https:\/\/dehulpstudent.nl\/index.php\/wp-json\/wp\/v2\/media?parent=105"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}