KI-Zusammenfassung
Möchten Sie Benutzern erlauben, Dateien auf Ihrer Website hochzuladen? Die Funktion "Datei-Upload" in WPForms ermöglicht es Ihnen, Dateien und Medien ganz einfach über Ihre Online-Formulare zu sammeln.
Diese Anleitung zeigt Ihnen, wie Sie das Feld "Datei-Upload" in WPForms verwenden.
- Erstellen eines Formulars für Datei-Uploads
- Zulässige Dateitypen für den Upload
- Festlegen der maximalen Dateigröße für Uploads
- Wahl zwischen "Modern" und "Klassisch" Stilen
- Hochladen mehrerer Dateien
- Einbeziehung von Datei-Upload-Links in Benachrichtigungen
- Anhänge zu Formular-Benachrichtigungs-E-Mails
- Speichern von hochgeladenen Dateien
- Beschränken des Dateizugriffs
- Aktivieren der Kameraaufnahme
- Komprimieren von hochgeladenen Dateien
- Häufig gestellte Fragen
Bevor Sie beginnen, stellen Sie sicher, dass WPForms auf Ihrer WordPress-Website installiert und aktiviert ist. Sobald Sie Ihre Lizenz überprüfen, können Sie entweder ein neues Formular erstellen oder ein bestehendes bearbeiten.
Erstellen eines Formulars für Datei-Uploads
Nachdem Sie den Formular-Builder geöffnet haben, fügen Sie Ihrer Formular ein Feld für Datei-Uploads hinzu. Sie können Felder zu Ihrer Formular hinzufügen, indem Sie auf den Feldnamen auf der linken Seite des Formular-Builders klicken oder indem Sie das Feld per Drag & Drop an die gewünschte Stelle im Vorschaufenster ziehen.
Zulässige Dateitypen für den Upload
Sicherheit hat für uns bei WPForms höchste Priorität. Standardmäßig erlauben wir nur Uploads von sicheren Dateitypen (die gleichen, die von WordPress Core erlaubt sind). Diese sind:
- Bilder wie .png, .gif, .jpg
- Dokumente wie .doc, .xls, .ppt, .pdf
- Audio wie .wav, .mp3, .mp4
- Video wie .mpg, .mov, .wmv
Hinzufügen von zulässigen Dateitypen
Wenn Ihre Formulare zusätzliche Dateitypen unterstützen sollen, lesen Sie unbedingt unser Tutorial, wie Sie Benutzern erlauben, zusätzliche Dateitypen hochzuladen.
Beschränken von Dateitypen
Um einzuschränken, welche Dateierweiterungen Sie für eine bestimmte Formular zulassen möchten, klicken Sie im Formular-Builder auf das Feld Datei-Upload. Anschließend können Sie im Bereich Feldoptionen die gewünschten Erweiterungen (durch Kommas getrennt) im Feld Zulässige Dateierweiterungen angeben.
Dadurch wird verhindert, dass Dateien mit anderen Erweiterungen auf Ihre Formulare hochgeladen werden.
Festlegen der maximalen Dateigröße für Uploads
Standardmäßig ist die maximale Dateigröße für Ihre Formulare auf das von Ihrem Server festgelegte Limit beschränkt. Um die vom Server definierte Obergrenze für Ihre Formulare zu ermitteln, klicken Sie im Formular-Builder auf das Feld Datei-Upload.
Klicken Sie dann neben der Einstellung Max. Dateigröße mit der Maus auf das Symbol des Fragezeichens (?), um die maximale Dateigröße anzuzeigen, die Ihr Server verarbeiten kann.
Wenn Sie die maximale Dateigröße für Ihre Formulare weiter einschränken möchten, können Sie dies tun, indem Sie eine Zahl im Feld Max. Dateigröße angeben.
Hinweis: Wenn Sie die maximale Upload-Größe für Ihre Website erhöhen möchten, müssen Sie sich an Ihren Hosting-Provider wenden, um herauszufinden, ob dies möglich ist. Weitere Details finden Sie im Tutorial von WPBeginner zum Erhöhen der maximalen Dateiuploadgröße in WordPress.
Wahl zwischen den Stilen „Modern“ und „Klassisch“
Das Feld „Datei-Upload“ enthält zwei Stiloptionen, aus denen Sie wählen können: Klassisch und Modern.
Um diese Optionen anzuzeigen, müssen Sie den Formular-Builder öffnen und auf das Feld Datei-Upload im Vorschaufenster klicken, um dessen Feldoptionen anzuzeigen. Klicken Sie dann auf die Registerkarte Erweitert, um zusätzliche Einstellungen anzuzeigen.
Die erweiterten Optionen umfassen ein Dropdown-Menü Stil, in dem Sie zwischen Modern und Klassisch wählen können.
Moderner Stil
Der moderne Stil des Feldes „Datei-Upload“ zeigt eine Drag-and-Drop-Box an. Wenn ein Besucher Ihr Formular verwendet, kann er entweder auf dieses Feld klicken, um Dateien von seinem Gerät auszuwählen, oder er kann Dateien von seinem Desktop in die Box ziehen.
Dieser Stil ermöglicht es Benutzern auch, mehrere Dateien in ein einziges Feld für Datei-Uploads hochzuladen.
Der moderne Stil verwendet AJAX-Uploads zur Verarbeitung von Datei-Uploads. Dies ist hilfreich, da das Hochladen von Dateien, insbesondere großer Dateien, viele Ressourcen des Hosting-Servers Ihrer Website beanspruchen und letztendlich zu einer Verzögerung nach dem Absenden Ihres Formulars führen kann.
AJAX-Uploads starten jedoch den Upload-Prozess, damit Ihre Formulare schneller abgesendet werden können.
Klassischer Stil
Der klassische Stil des Feldes „Datei-Upload“ zeigt eine Schaltfläche „Datei auswählen“ an. Ähnlich wie beim modernen Stil können Benutzer Dateien entweder auf diese Schaltfläche ziehen oder auf die Schaltfläche klicken, um Dateien von ihren Geräten auszuwählen.
Der klassische Stil unterstützt jedoch nicht den Upload mehrerer Dateien in ein einziges Feld für Datei-Uploads.
Hinweis: Möchten Sie das Erscheinungsbild Ihrer Schaltfläche für Datei-Uploads an das Branding Ihres Unternehmens anpassen? In unserer Entwicklerdokumentation finden Sie Schritt-für-Schritt-Anleitungen zum Ändern des Schaltflächenstils für moderne und klassische Upload-Felder.
Hochladen mehrerer Dateien
Damit Ihre Benutzer mehrere Dateien auf einmal hochladen können, müssen Sie sicherstellen, dass Ihr Feld für Datei-Uploads so konfiguriert ist, dass dies zulässig ist. Klicken Sie dazu auf das Feld Datei-Upload, um dessen Feldoptionen zu öffnen.
Stellen Sie dann im Tab Erweitert das Dropdown-Menü Stil auf Modern ein, falls dies noch nicht geschehen ist.
Dieser Stil ist erforderlich, bevor Sie Benutzern erlauben können, mehr als eine Datei in dieses Feld hochzuladen.
Kehren Sie zum Tab Allgemeine Feldoptionen zurück und suchen Sie die Einstellung Maximale Dateianzahl. Standardmäßig ist dieser Wert auf 1 gesetzt, aber Sie können ihn nach Bedarf erhöhen.
Hinweis: Wenn Sie sich nicht sicher sind, ob die Hosting-Umgebung Ihrer Website die Anzahl der von Ihnen gewünschten Uploads ordnungsgemäß verarbeiten kann, führen Sie unbedingt vor dem Start Ihres Formulars einige Tests durch. Sie können sich auch an den Hosting-Provider Ihrer Website wenden, um dessen Rat zu Uploads einzuholen.
Einbeziehung von Datei-Upload-Links in Benachrichtigungen
Sie können die {all_fields} oder {field_id} Smart Tags verwenden, um hochgeladene Dateien in Ihre Benachrichtigungs-E-Mails einzuschließen.
Wenn Sie dies tun, enthalten Ihre E-Mail-Benachrichtigungen Links zu den hochgeladenen Dateien.
Auf diese Weise können Sie die Datei schnell anzeigen oder herunterladen, ohne sich bei Ihrem WordPress-Dashboard anmelden zu müssen.
Hinweis: Benötigen Sie Hilfe beim Einrichten Ihrer E-Mail-Benachrichtigungen? Sehen Sie sich unser Tutorial zur Konfiguration Ihrer Benachrichtigungseinstellungen für weitere Anleitungen an.
Anhänge zu Formular-Benachrichtigungs-E-Mails
WPForms ermöglicht es Ihnen, die über Ihr Online-Formular hochgeladenen Dateien als Anhänge zu erhalten. Diese Anhänge bieten eine zusätzliche Sicherungsebene für Ihre Dateien. Das bedeutet, selbst wenn die Dateien später aus WordPress gelöscht werden, können Sie immer noch darauf zugreifen.
Um dies zu aktivieren, müssen Sie zum Abschnitt Erweitert der Formular-Benachrichtigungseinstellungen gehen und die Option Dateianhang aktivieren auf Ein stellen.
Hinweis: Diese Funktion ist standardmäßig deaktiviert. Sie müssen sie manuell aktivieren, um Dateianhänge in Ihren Benachrichtigungs-E-Mails zu erhalten.
Um mehr über diese Funktion zu erfahren, lesen Sie unseren Leitfaden zu Dateianhängen.
Speichern von hochgeladenen Dateien
Standardmäßig werden von Benutzern hochgeladene Dateien im Upload-Verzeichnis Ihrer Website im WPForms-Ordner gespeichert.
Wenn Sie Ihre Dateien jedoch lieber in die WordPress-Mediathek hochladen möchten, navigieren Sie zur Registerkarte Erweitert im Bereich Feldoptionen und aktivieren Sie die Option Datei in WordPress-Mediathek speichern.
Unabhängig davon, wo Sie Ihre Dateien speichern, können Sie sie immer in den Einträgen für Ihr Formular abrufen, indem Sie auf den Link der Datei innerhalb eines einzelnen Eintrags klicken.
Hinweis: Das Löschen eines Formulareintrags entfernt auch alle Dateien, die in diesem Eintrag hochgeladen wurden. Es ist immer eine gute Idee, wichtige Dateien an einem separaten Ort zu speichern.
Wenn Sie möchten, können Sie eine hochgeladene Datei auch aus einem bestimmten Eintrag löschen, indem Sie den Eintrag bearbeiten. Klicken Sie einfach auf das rote Papierkorbsymbol neben dem Link der Datei.
Hinweis: Wenn Sie Ihr Datei-Upload-Feld so konfiguriert haben, dass Uploads in der Mediathek gespeichert werden, müssen Sie die Datei aus der Mediathek löschen.
Nachdem Sie die Dateien gelöscht haben, die Sie aus dem Eintrag entfernen möchten, klicken Sie auf die Schaltfläche Aktualisieren, um Ihre Änderungen zu speichern.
Beschränken des Dateizugriffs
Das Feld Datei-Upload ermöglicht es Ihnen zu steuern, wer auf hochgeladene Dateien zugreifen kann, indem Sie den Zugriff auf bestimmte WordPress-Benutzer beschränken oder einen Passwortschutz hinzufügen. Klicken Sie dazu auf das Feld Datei-Upload, um dessen Feldoptionen zu öffnen.
Schalten Sie dann auf der Registerkarte Erweitert den Schalter Dateizugriffsbeschränkungen aktivieren ein.
Nach der Aktivierung können Sie zwischen benutzerspezifischen Einschränkungen oder einem Passwortschutz wählen. Ausführliche Informationen zur Konfiguration dieser Einstellungen finden Sie in unserem Leitfaden zum Einschränken des Zugriffs auf hochgeladene Dateien.
Aktivieren der Kameraaufnahme
Zusätzlich zum Hochladen von Dateien von ihrem Gerät können Sie Benutzern auch erlauben, Fotos oder Videos direkt im Feld für den Datei-Upload aufzunehmen.
Um diese Option zu aktivieren, öffnen Sie den Tab Erweitert im Bereich Feldoptionen und schalten Sie die Einstellung Kamera aktivieren ein.
Nach der Aktivierung können Sie das Format (Foto oder Video) festlegen und die Zeitbegrenzung anpassen, wenn Sie Video wählen.
Auf der Frontend-Seite sehen die Benutzer im Upload-Feld den aktualisierten Text: „Datei ziehen und ablegen, Datei zum Hochladen auswählen oder mit der Kamera aufnehmen.“ Sie können entweder wie gewohnt eine Datei hochladen oder auf den Kamera-Link klicken, um ein neues Foto aufzunehmen oder ein Video aufzunehmen.
Ausführliche Informationen zur Verwendung der Kameraoption finden Sie in unserem Leitfaden zur Verwendung des Kamerafelds.
Komprimieren von hochgeladenen Dateien
WPForms komprimiert keine Dateien, die auf Ihre Website hochgeladen werden. Wenn Sie Ihre Dateien jedoch in der WordPress-Mediathek speichern, komprimiert WordPress Ihre Bilder automatisch.
Hinweis: Wenn Sie Ihre Bilder optimieren möchten, bevor Sie sie auf Ihre Website hochladen, lesen Sie das Tutorial von WPBeginner, wie Sie Bilder einfach optimieren, um die Leistung Ihrer Website zu verbessern.
Häufig gestellte Fragen
Dies sind einige der häufigsten Fragen zum Feld für den Datei-Upload.
Ich möchte Benutzern erlauben, große Dateien in meinem Formular hochzuladen, aber es funktioniert nicht. Welche Optionen habe ich?
Bei Verwendung des modernen Stils für Datei-Uploads lädt WPForms Dateien automatisch in „Chunks“ hoch. Dies verbessert die Effizienz des Uploads und hilft Ihnen, einige vom Server festgelegte Einschränkungen (einschließlich Server-Timeouts) zu vermeiden.
Dies hilft bei den meisten Problemen mit großen Uploads in einem Formular, aber es ist wichtig zu beachten, dass die maximale Dateigröße immer noch durch Ihren Server über eine Einstellung namens MAX_FILE_UPLOAD begrenzt wird. Das bedeutet, dass Sie keine Datei hochladen können, die größer als 10 MB ist, wenn Ihr Server eine Dateigrößenbeschränkung von 10 MB hat.
Wenn Sie die Dateigrößenbeschränkungen für Uploads auf Ihrem Server anpassen möchten, wenden Sie sich bitte an Ihren Hosting-Anbieter. Weitere Informationen finden Sie im Tutorial von WPBeginner zur Erhöhung der maximalen Dateigröße für Uploads in WordPress.
Cloudflare-Benutzer sollten beachten, dass die Upload-Limits je nach Planart festgelegt werden. Die aktuellen Limits sind wie folgt:
- Kostenlos und Pro: 100 MB
- Geschäftlich: 200 MB
- Enterprise: 500 MB (kontaktieren Sie den Support für Anpassungen)
Weitere Informationen finden Sie unter Cloudflare Upload-Größenbeschränkungen.
Ich lade keine große Datei hoch, aber der Datei-Upload-Prozess friert ein und wird nie abgeschlossen. Woran könnte das liegen?
Fehlkonfigurationen in der SSL-Verbindung Ihrer Website können verhindern, dass Dateien ordnungsgemäß hochgeladen werden.
Zum Beispiel können Sie dieses Problem haben, wenn Ihre Website über eine unsichere (HTTP) Verbindung geladen wird, aber Website-Assets wie hochgeladene Dateien über eine sichere (HTTPS) Verbindung (oder umgekehrt) geladen werden. Dies verursacht einen Mixed-Content-Fehler und verhindert, dass Dateien in Ihren Formularen hochgeladen werden.
Der Host Ihrer Website kann Ihre SSL-Konfigurationen einfach aktualisieren. Wenden Sie sich also an ihn, wenn Sie auf diesen Fehler stoßen. Möglicherweise möchten Sie auch den Leitfaden von WPBeginner zur Fehlerbehebung bei SSL-Problemen in WordPress lesen.
Warum werden hochgeladene Dateien in Benachrichtigungs-E-Mails als Links und nicht als Anhänge angezeigt?
Dateianhang ist für Ihr Formular deaktiviert. Sie müssen ihn in der Erweitert-Option der Formular-Benachrichtigungseinstellungen aktivieren. Weitere Informationen finden Sie in unserem Leitfaden zum Aktivieren von Dateianhängen.
Das Anhängen von Dateien an E-Mail-Benachrichtigungen ist standardmäßig deaktiviert, da dies oft die Zustellbarkeit von E-Mails beeinträchtigen kann. Wenn ein E-Mail-Dienstanbieter beispielsweise nur eine maximale Dateigröße von 10 MB zulässt, ein Benutzer jedoch eine Datei mit mehr als 10 MB hochlädt, wird die E-Mail nicht zugestellt.
Warum funktionieren meine Datei-Uploads in den mobilen Browsern von Facebook und Instagram auf Android-Geräten nicht?
Einige In-App-Browser unterstützen derzeit keine Datei-Uploads. Die bemerkenswertesten Beispiele hierfür sind die Browser von Facebook und Instagram.
Die gute Nachricht ist, dass wir ein Plugin entwickelt haben, das dieses Problem für unsere Benutzer behebt. Sie können das Plugin Escape Facebook/Instagram In-App Browsers herunterladen, indem Sie auf die Schaltfläche unten klicken:
Laden Sie das Plugin Escape Facebook/Instagram In-App Browsers herunter
Nachdem Sie das Plugin heruntergeladen haben, müssen Sie es nur noch auf Ihrer Website installieren und aktivieren.
Mein Formular wird nicht gesendet und enthält ein Feld für Datei-Uploads. Was könnte falsch sein?
Wenn Ihr Formular nach dem Hinzufügen eines Datei-Upload-Feldes nicht mehr gesendet wird oder hängt, hängt das Problem normalerweise mit Dateigrößenbeschränkungen, SSL-Fehlkonfigurationen oder einem JavaScript-Konflikt zusammen. Versuchen Sie, das Formular ohne Anhängen einer Datei zu senden – wenn es durchgeht, ist das Datei-Upload-Feld die Ursache. Überprüfen Sie von dort aus die maximalen Dateigrößenbeschränkungen Ihres Servers, lesen Sie die Tipps zur SSL-Fehlerbehebung in der obigen FAQ und testen Sie auf Plugin-Konflikte.
Datei-Uploads funktionieren in Safari nicht. Wie kann ich das beheben?
Safari kann manchmal Probleme mit dem modernen (Drag-and-Drop) Upload-Stil haben, insbesondere mit HEIC-Bildern oder wenn Datenschutzeinstellungen Cross-Origin-Anfragen blockieren, die für AJAX-Uploads erforderlich sind. Wenn Benutzer Probleme beim Hochladen von Dateien in Safari melden, versuchen Sie, das Datei-Upload-Feld im Erweitert-Tab auf den Klassisch-Stil umzuschalten, um zu sehen, ob das Problem behoben wird. Wenn das Problem weiterhin besteht, testen Sie auf Plugin-Konflikte – Safari reagiert empfindlicher auf JavaScript-Konflikte als andere Browser.
Das ist alles! Sie wissen jetzt, wie Sie das Datei-Upload-Feld in WPForms verwenden.
Als Nächstes möchten Sie lernen, wie Sie basierend darauf, wie Benutzer Ihr Formular ausfüllen, verschiedene E-Mail-Benachrichtigungen senden? Lesen Sie hier, wie Sie bedingte Formularbenachrichtigungen in WPForms erstellen für ein vollständiges Tutorial.