Das Hochladen von Bildern ist eines der wichtigsten Dinge, wenn es um eine Website geht, da die Bilder grundsätzlich das Aussehen einer Seite bestimmen, ohne Bilder könnte eine Seite zu alt aussehen oder nicht so viele Kunden/Nutzer erreichen, wie wir es gerne hätten.

Darüber hinaus bietet die Möglichkeit für Ihre Benutzer, Bilder im Frontend hochzuladen, viele Vorteile, beispielsweise können sie Dokumente oder beliebige Bilder herunterladen, die sie beispielsweise für ein Profil verwenden möchten.

In diesem Beitrag werden wir einige Plugins bewerten, die es uns ermöglichen, unser Ziel zu erreichen.

Wie man ein WordPress-Bild vom Frontend mit einem Plugin hochlädt

Hier werden wir verschiedene Möglichkeiten zum Hochladen von WordPress-Bildern mithilfe verschiedener Plugin-Typen besprechen.

Dateien im Frontend mithilfe eines Formular-Plugins hochladen

Eine der schnellsten und einfachsten Möglichkeiten ist die Verwendung eines Formular-Plugins. Dies ist beispielsweise dann nützlich, wenn wir ein Kontaktformular erstellen müssen, in dem der Benutzer ein Dokument oder andere nützliche Informationen mithilfe eines Bildes hochladen soll.

Es gibt viele Plugins, mit denen man Formulare mit einem Datei-Upload-Feld erstellen kann. Eines davon ist Contact Form 7, mit dem man kostenlos Dateien im Frontend auf die eigene Website hochladen kann.

Um Formulare zu verwenden, mit denen Ihre Benutzer Dateien im Frontend hochladen können, müssen wir zuerst das Formular erstellen. Gehen Sie dazu nach der Installation des Plugins zu Kontakt > Neu hinzufügen .

Auf diesem Bildschirm sehen Sie einige HTML-Tags mit dem Shortcode für jedes Feld darin. Standardmäßig wird ein Formular mit den grundlegenden Feldern erstellt.

Da wir ein Feld zum Hochladen von Dateien hinzufügen möchten, klicken Sie auf die Stelle, an der Sie das Feld hinzufügen möchten, und klicken Sie dann auf die Datei in den verfügbaren Schaltflächen/Optionen.

Dadurch öffnet sich ein Popup, in dem Sie Beschränkungen für Ihren Datei-Upload festlegen können. Fügen Sie alle gewünschten Beschränkungen hinzu und klicken Sie schließlich auf „ Tag einfügen“ .

Dadurch wird der Shortcode für das Feld im Formularinhalt hinzugefügt.

Sie können Ihr Formular nun nach Belieben anpassen, weitere Felder hinzufügen oder, falls gewünscht, auch HTML und CSS einfügen, da das Formular all diese Arten von Anpassungen zulässt.

Wenn alles fertig ist, können Sie einen Titel hinzufügen und auf Speichern .

Dadurch wird ein Shortcode generiert, mit dem Sie das Formular in Ihren Beitrag oder Ihre Seite einbetten können. Kopieren Sie diesen Shortcode und verwenden Sie anschließend den Block zum Hinzufügen eines Shortcodes in Ihrem Seiteneditor. In diesem Beispiel zeigen wir Ihnen, wie Sie ihn mit dem Gutenberg-Editor hinzufügen.

Jetzt müssen Sie es veröffentlichen, dann können Sie das Formular mit den von Ihnen hinzugefügten Feldern und dem Datei-Upload-Button sehen.

Sie müssen lediglich auf „Datei auswählen“ klicken und die Datei, in diesem Fall Ihr Bild, aus Ihren Ordnern auf Ihrem PC auswählen.

Nach dem Klicken auf „Absenden“ sollte der Vorgang abgeschlossen sein und das Bild sollte nun auf Ihrer Website zu sehen sein.

Auf diese Weise können Ihre Nutzer Bilder auf Ihre Website hochladen, zusammen mit einigen anderen Informationen, die wir möglicherweise benötigen, wie zum Beispiel den Namen oder die E-Mail-Adresse der Person, die das Bild hochgeladen hat, über ein Formular – wirklich einfach und funktional.

Verwendung des WordPress-Datei-Upload-Plugins

Nachdem wir nun die normale, "alte" Methode kennengelernt haben, schauen wir uns an, wie man ein Bild hochlädt, aber mithilfe dieses Plugins, mit dem wir eine Datei-Upload-Option in jeden Beitrag oder jede Seite einbetten können, ohne dass wir weitere Informationen eingeben oder überhaupt ein Formular erstellen müssen.

Als erstes benötigen wir das Plugin „WordPress File Upload“, da dieses uns alle Optionen bietet, die wir zum Erstellen der Datei-Upload-Funktion benötigen.

Nachdem wir dieses Plugin auf unserer Website aktiviert haben, sollte eine Menüoption verfügbar sein, mit der wir alle Dateien überprüfen können, die wir damit hochladen.

Um es zu verwenden, müssen wir lediglich einen Shortcode [wordpress_file_upload] an der gewünschten Stelle einfügen. In diesem Fall haben wir einen Beitrag mit vorbereiteten Informationen, in den wir den Shortcode eingefügt haben, damit Sie sehen können, wie es im Gutenberg-Editor und im Frontend aussehen würde.

Gutenberg-Editor

Frontend

Nachdem unser Upload-Formular hinzugefügt wurde, müssen Sie nur noch auf „Datei auswählen“ klicken, um Ihre PC-Dateien zu durchsuchen, und schließlich auf „Datei hochladen“ klicken.

Durch Klicken auf diese Schaltfläche kann Ihr Benutzer ein Bild oder eine Datei auf Ihre Website hochladen. Das Beste daran ist, dass wir direkt in den Plugin-Einstellungen auswählen können, wo auf dem Server das Bild hochgeladen werden soll, sowie dessen Aussehen und viele weitere Einstellungen für das Formular festlegen können.

Die Uploads können Sie hauptsächlich über die Option „Dateien hochladen“ im linken Menü des Admin-Dashboards einsehen. Dies ist die Hauptseite des Plugins, auf der alle hochgeladenen Dateien angezeigt werden.

Wie Sie sehen, handelt es sich um ein einfaches und funktionales Plugin, mit dem wir Bilder von unseren Nutzern erhalten können, ohne dass der Aufwand größer ist als das Einfügen des Shortcodes im Backend und das Warten auf den Upload der Datei durch die Nutzer.

Medienverwaltung pro Benutzerrolle mithilfe WP Media Folder

Wie wir sehen, gibt es viele Möglichkeiten, unseren Nutzern das Hochladen von Bildern und Dateien im Frontend zu ermöglichen. Das Problem dabei ist jedoch, dass die Bilder „zufällig“ hochgeladen werden könnten und wir keine genaue Kontrolle darüber hätten, wo sie landen. Aber keine Sorge! WP Media Folder ist die Lösung.

WP Media Folder verfügt über ein spezielles Tool zur Verwaltung des Zugriffs auf Ihre Medienbibliothek. Dies kann sehr hilfreich sein, wenn Sie kontrollieren möchten, wer Bilder wo hochlädt, und wenn Sie Ihren Benutzern ermöglichen möchten, ihre eigenen Medien direkt in der Medienbibliothek zu verwalten, ohne dass sie die Medien anderer Rollen/Benutzer sehen können.

Als erstes muss das Plugin WP Media Folderinstalliert sein. Nur so können wir alle verfügbaren Funktionen nutzen, um dies zu realisieren.

Nachdem wir es installiert haben, müssen wir die Option zur Zugriffsbeschränkung aktivieren. Gehen Sie dazu zu Einstellungen > WP Media Folder , und Sie können die Hauptkonfigurationsseite WP Media Folder

In diesem Abschnitt navigieren Sie zu Zugriff & Design > Medienzugriff .

Um in diesem Abschnitt die Medien pro Benutzerrolle einzuschränken und automatisch einen Ordner für jede Benutzerrolle zu generieren, wählen wir „Medienzugriff nach Benutzer oder Benutzerrolle“ und „Benutzerrollen“ .

Wir bieten außerdem weitere Optionen an, wie die Auswahl eines Pfadordners oder die Möglichkeit, der Rolle/dem Benutzer zu erlauben, alle Medien anderer Benutzer/Rollen zu sehen.

Nachdem wir die Option aktiviert haben, nur einer Benutzerrolle das Bearbeiten ihrer eigenen Medien zu erlauben, nehmen wir an, wir haben eine Redakteursrolle und möchten, dass alle Benutzer unter dieser Rolle ihre Medien für Beiträge und Seiten sehen und verwalten können.

Mit den von uns ausgewählten Optionen sollte all dies möglich sein. Mal sehen, dazu müssen wir uns lediglich als Redakteur anmelden und die Medien wie gewohnt hochladen.

Wenn Sie als Redakteur angemeldet sind, können Sie die Medienbibliothek wie folgt sehen.

Wie Sie sehen können, gibt es zwei Abschnitte, in denen die Medienbibliothek Ihnen mitteilt, dass wir uns in einem Ordner namens „Editor“ befinden. Laden wir also einige Medien hoch, um zu überprüfen, wie es funktionieren würde.

Der Upload-Vorgang ist genau derselbe wie gewohnt, entweder über ein Frontend-Upload-Tool oder einfach über Ihre Medienbibliothek. Alle Uploads dieser Benutzerrolle werden automatisch auf diese Benutzerrolle beschränkt.

Einer der Vorteile der Verwendung von WP Media Folder +Neuen Ordner hinzufügen erstellen kann .

Wir können bestätigen, dass unter der Medienbibliothek ein Editor- Ordner erstellt wurde, der den Ordner enthält, den wir mit der Editor-Rolle erstellt haben – und das war so einfach wie ein Klick auf eine Schaltfläche!

Nachdem wir die Medienzugriffsoption , wird für jede Rolle, die auf Ihre Medienbibliothek zugreift und ein Bild hochlädt, ein Ordner erstellt. Je nach den von Ihnen gewählten Einstellungen können Sie die Medien mit anderen Benutzern derselben Rolle teilen oder nicht. Mithilfe von Filtern haben Sie außerdem mehr Kontrolle über Ihre Medien .

Was für eine tolle Funktion und wirklich einfach zu bedienen! Nicht wahr?

Ermöglichen Sie Ihren Nutzern das Hochladen von Dateien auf professionellste Weise

In diesem Beitrag haben wir gesehen, wie wir unseren Nutzern das Hochladen ihrer Bilder auf professionellste Weise ermöglichen und unsere Website an jeden Anwendungsfall anpassen können – sei es durch das einfache Absenden eines Formulars oder durch die Möglichkeit für unsere Redakteure, einen freigegebenen Ordner in der Mediathek zu erstellen, auf den nur sie Zugriff haben. Und das ist noch nicht alles! Mit WP Media Folder können Sie noch vieles mehr tun, zum Beispiel Ihre Mediathek mit einem Cloud-Dienst . Fantastisch, oder?

Mehr Informationen zum WP Media Folder und den Zugriffsbeschränkungen hier !