Bildauswahl-Beschriftungen mit WPForms ausblenden

Einleitung

Möchten Sie die Bildauswahl-Beschriftungen bei den Formularfeldern Multiple Choice und Checkbox ausblenden? Die Option, Bilder für diese Felder anstelle von reinen Beschriftungen anzuzeigen, ist eine großartige Möglichkeit, die Aufmerksamkeit Ihrer Besucher zu gewinnen. Aber vielleicht möchten Sie die Bilder für sich selbst sprechen lassen und die Beschriftungen entfernen, die unter diesen Bildern erscheinen? Mit einem kleinen CSS-Snippet können Sie die Beschriftungen für diese Bilder ganz einfach ausblenden, und in diesem Tutorial zeigen wir Ihnen genau, wie das geht!

Erstellen Ihres Formulars

Zuerst erstellen wir ein neues Formular und fügen unsere Felder hinzu. Da wir bereits wissen, dass wir Bilder für unser Checkbox-Feld verwenden möchten, fügen wir dieses Feld und die dazugehörigen Bilder hinzu.

Wenn Sie Hilfe beim Erstellen Ihres Formulars benötigen, sehen Sie sich bitte diesen hilfreichen Leitfaden an. Wenn Sie außerdem Hilfe beim Einrichten eines Feldes mit Bildauswahlen benötigen, lesen Sie bitte diese Dokumentation.

Hinzufügen von CSS zum Ausblenden von Bildauswahl-Beschriftungen

Nachdem das Formular erstellt wurde, können Sie die Beschriftungen unter den Bildern sehen.

Da wir diese Beschriftungen ausblenden möchten, werden wir etwas CSS hinzufügen, um sie auszublenden.

Wenn Sie Hilfe beim Hinzufügen von CSS zu Ihrer Website benötigen, sehen Sie sich bitte dieses Tutorial an.

Kopieren Sie einfach dieses CSS und fügen Sie es auf Ihrer Website ein.

form.wpforms-form .wpforms-field-container ul.wpforms-image-choices span.wpforms-image-choices-label {
    display: none;
}

Dieses CSS blendet nicht nur die Beschriftungen aus, die unter den Bildern erscheinen, sondern entfernt auch jeglichen Rand (Abstand), der automatisch unter den Bildern angewendet wird.

Möchten Sie auch den Leerraum entfernen, der um die Bildauswahlen herum platziert ist? Schauen Sie sich unseren Artikel über Entfernen von Leerraum um Bildauswahlen an.