Skip to main content

Best Practices: Kontaktformular in Callisto (DSGVO)

Hier findest du Best Practices zum Thema DSGVO.

1. Kontaktformular DGSVO-konform in Callisto anpassen

Im Folgenden findet ihr eine Anleitung zur Erweiterung des Kontaktformulars, damit der Endkunde die Datenschutzerklärung akzeptieren muss.

1.1. Das Kontaktformular um zwei weitere Felder erweitern

Unter System » CMS » Formular findet man das Kontaktformular, welches im Standard-Layout in der Kategorie Kontakt aufgerufen wird.

Innerhalb des Formulars werden nun zwei weitere Felder hinzugefügt:

  1. Der erste Feldname (in meinem Beispiel Akzeptiere) bekommt den Typ Auswahlfeld (checkbox) und ist beim Pflichtfeld NEIN gestellt.

  2. Zweiter Feldname Bitte der Datenschutzerklärung zustimmen!, Typ: einzeiliges Eingabefeld und Pflichtfeld JA

CMS Formulare
Bild 1. Kontaktformular um zwei Felder erweitern

Die Zahlen auf der linken Seite des Screenshots sind die IDs der Datenfelder und werden für Schritt 2 benötigt. Beachte: Die IDs fangen bei 0 und nicht bei 1 an.

1.2. Die Kategorie für das Kontaktformular anpassen

Unter Artikel » Kategorien sucht man die genutzte Kategorie für das Kontaktformular, was im Standard-Layout die Kategorie Kontakt ist.

In der Kategorie öffnet man das Tab Beschreibung 1 und stellt Editor auf Syntax-Editor um.

Anschließend muss folgendes Script eingefügt werden:

<script>
$(document).ready(function(){
	var privacyTr = $('.PlentySubmitFormInput[name="FormFields[10]"]');
	var privacyHidden = $('.PlentySubmitFormInput[name="FormFields[11]"]');
	/* Checkbox auf true setzen, falls im Vorfeld schon aktiviert */
	if(privacyHidden.val() != '') privacyTr.attr('checked', true);
	/*-*/
	privacyHidden.parents('tr').first().css('display', 'none'); // Zeile mit Pflichfeld verstecken
	privacyTr.parents('tr').first().find('.PlentySubmitFormLabel').append('<br /><a href="{% Link_PrivacyPolicy() %}" target="_blank">Datenschutzerklärung</a>');
	privacyTr.parents('tr').first().find('.PlentySubmitFormLabel').css('font-weight', 'bold')
	/* Wert der Checkbox auf Pflichfeld übertragen */
	$('form[name=plenty_form]').submit(function() {
	if($(privacyTr[1]).is(':checked')){
		privacyHidden.val('true');
	}else{
		privacyHidden.val('');
	}
});
});
</script>

Dieses Script enthält zwei FormFields, wo sich in den Klammer zwei Zahlen befinden. Diese Zahlen sind die IDs von den Datenfelder aus Schritt 1, welche in dem Screenshot zu erkennen sind.

Wenn das Kontaktformular anders aufgebaut ist, dann muss man dort auch die IDs im Script entsprechend anpassen.

CMS Kategorien
Bild 2. Kategorie für das Kontaktformular anpassen

1.3. Die gemachten Einstellungen im Frontend gegentesten

Kontaktformular im Frontend aufrufen und dort sind nun zwei neue Datenfelder und eine Checkbox:

Frontend 1
Bild 3. Zwei neue Datenfelder und eine Checkbox im Frontend

Füllt man das Formular aus und akzeptiert die Datenschutzerklärung nicht, wird kein Formular abgeschickt. In diesem Fall erscheint eine Fehlermeldung mit dem entsprechenden Hinweis:

Fehlermeldung Frontend
Bild 4. Fehlermeldung im Frontend

Erfüllt der Endkunde alle Bedingungen, wird das Formular verschickt:

Erfolgsmeldung Frontend
Bild 5. Erfolgsmeldung im Frontend
Zum Seitenanfang