Jak zrobić Formularz zgodny z RODO na mojej stronie w WordPress

    Formularz kontaktowy zgodny z RODO i zabezpieczony reCaptchą.


    img

    Dowiesz się: Jak zainstalować i skonfigurować formularz kontaktowy zgodny z RODO na swojej stronie WordPress. Jak dodać zabezpieczenie przed BOT-ami (reCaptcha).

    Dla systemu operacyjnego:

    Instalacja wtyczki

    Potrzebujemy do tego popularnej wtyczki do formularzy kontaktowych zwanej Contact Form 7.

    Instalujemy ją z oficjalnego repozytorium.
    Wtyczki->Dodaj nową

    Contact Form 7

    Po czym aktywujemy wtyczkę, klikając przycisk Włącz.

    Konfiguracja formularza

    Następnie pojawi nam się nowa pozycja w Menu bocznym -> Formularze.

    Tworzymy nowy formularz Formularze->Dodaj nowy

    Nadajemy nazwę formularza np. “Mój Formularz Kontaktowy”.

    Tworzenie nowego formularza

    Następnie w pole formularza w okienku poniżej wklejamy następujący kod.

    <label> Imię i nazwisko (wymagane)
        [text* imie-nazwisko] </label>
    
    <label> Telefon (wymagane)
        [tel* telefon] </label>
    
    <label> Twój email (wymagane)
        [email* adres-email] </label>
    
    <label> Temat
        [text* temat] </label>
    
    <label> Treść wiadomości
        [textarea tekst] </label>
    
    [acceptance zgoda-rodo]
    Administratorem Państwa danych osobowych jest XXXX, tel: +48 XXX XXX XXX, e-mail: XXX@XXX.XX. Państwa dane będą przetwarzane w celu obsługi wysłanego zapytania i tak długo, jak to konieczne do obsługi tego zapytania. Mają Państwo prawo do dostępu do swoich danych, ich sprostowania, usunięcia, ograniczenia przetwarzania, wniesienia sprzeciwu wobec przetwarzania oraz przeniesienia danych. Mogą Państwo również wnieść skargę do organu nadzorczego. Podanie danych jest dobrowolne, ale niezbędne do obsługi zapytania. Podstawa prawna: przetwarzanie jest niezbędne do podjęcia działań na żądanie osoby, której dane dotyczą, przed zawarciem umowy.
    
    [submit "Wyślij"]

     

    Informacja:
    Jest to podstawowy kod formularza z podświetloną w linii 17  z bazową regułką wyrażania zgody RODO. Zawsze należy zasięgnąć opinii prawnej czy treść zgody odpowiada własnej sytuacji prawnej.

    Oczywiście miejsca XXX wypełniamy własnymi danymi (Podmiot, telefon, e-mail – czyli np. specjalną w tym celu utworzoną skrzynkę email – ado@mojadomena.pl)

    Wersja dla Bootstrap

    Jeśli Wasz motyw korzysta z frameworka Bootstrap – możecie użyć poniższego kodu.

    <div class="row">
        <div class="col-lg-6 col-sm-12">
            <div class="form-group">
                <label> [text* imie-nazwisko placeholder "Imię i Nazwisko"] </label>
            </div>
        </div>
        <div class="col-lg-6 col-sm-12">
            <div class="form-group">
                <label> [email* adres-email placeholder "Adres E-mail"] </label>
            </div>
        </div>
        <div class="col-lg-6 col-sm-12">
            <div class="form-group">
                <label> [text* temat placeholder "Temat"] </label>
            </div>
        </div>    
        <div class="col-lg-6 col-sm-12">
            <div class="form-group">
                [tel* telefon placeholder "Telefon kontaktowy"]
            </div>
        </div>
        <div class="col-lg-12 col-sm-12">
            <div class="form-group">
                [textarea* tekst placeholder "Wiadomość"]
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group rodo"> [acceptance zgoda-rodo] Administratorem Państwa danych osobowych jest XXXX, tel: +48 XXX XXX XXX, e-mail: XXX@XXX.XX. Państwa dane będą przetwarzane w celu obsługi wysłanego zapytania i tak długo, jak to konieczne do obsługi tego zapytania. Mają Państwo prawo do dostępu do swoich danych, ich sprostowania, usunięcia, ograniczenia przetwarzania, wniesienia sprzeciwu wobec przetwarzania oraz przeniesienia danych. Mogą Państwo również wnieść skargę do organu nadzorczego. Podanie danych jest dobrowolne, ale niezbędne do obsługi zapytania. Podstawa prawna: przetwarzanie jest niezbędne do podjęcia działań na żądanie osoby, której dane dotyczą, przed zawarciem umowy.
            </div>
        </div>
    
    [submit "Wyślij"]
    
    </div>
    
    
    

     

    Następnie przełączamy się na zakładkę E-mail.

    Widnieje tam wykrzyknik (!) z informacją o błędzie.

    Tak, ponieważ używając kodu formularza wprowadziliśmy własne nazwy elementów formularza (zamiast angielskich) takie jak [imie-nazwisko] [telefon] [adres-email] [temat] [tekst] [zgoda-rodo] te elementy należy wprowadzić do ustawień wysyłanego e-maila.

    Ustawienia e-mail. Aktualizacja nazw pół formularza.

    • Odbiorca: tu podajmy swój mail, na który ma przyjść wiadomość do Was
    • Nadawca: tak będzie zaadresowany e-mail w polu ‘Nadawca’
    • Temat: tu podajemy nazwę [temat]  z pola formularza
    • Additional headers: czyli dodatkowe nagłówki to Reply-To: wstawiamy naszą wartość [adres-email]

    I przechodzimy do sekcji Message Body: czyli Ciało Wiadomości

    Tu analogicznie zmieniamy wartości na nasze pola. Możemy posłużyć się gotowym kodem poniżej kopiując i wklejając go w pole.

    Nadawca: [imie-nazwisko] <[adres-email]>
    Temat: [temat]
    
    Telefon: [telefon]
    
    Treść wiadomości:
    [tekst]
    
    Zgoda RODO: [zgoda-rodo]

    Zapisujemy ustawienia naszego formularza, klikając w przycisk Zapisz. Uzyskamy dzięki temu shortcode, który wkleimy w dowolne miejsce na stronie.

    Formularz zapisany. Oto nasz shortcode.

    Nasz shorctode

    Następnie wklejamy nasz shortcode w miejscu, w którym chcemy aby pojawił się formularz. Może być to np. podstrona Kontakt.

    Kod (shortcode) w dowolnym miejscu na stronie

    Jak przystało na każdy shortcode – zostanie on zamieniony na odpowiedni element na froncie strony, w tym przypadku – nasz formularz kontaktowy.

    Widok naszego formularza

    Wersja Bootstrap

    Następnie zajmiemy się zabezpieczeniem naszego formularza przed BOT-ami czyli Google reCaptchą.

    Strony: 1 2

    341 wyświetleń

    Podziel się lub polub!

    Dodaj komentarz

    Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

    three × two =



    Zapraszamy do HitMe.pl


    Twój obecny hosting Cię męczy i ...

    …i nie masz czasu na ciągłe zmiany i szukanie nowych opcji? Wybierz naszą ofertę – znajdziesz u nas pakiet idealnie dopasowany do Twoich potrzeb, a jeśli go nie ma – chętnie przygotujemy indywidualne rozwiązanie, a wszystko to w sposób, który nie obciąży Cię finansowo.