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

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.

Abgesehen davon, dass Ihren Benutzern die Möglichkeit gegeben wird, Bilder im Frontend hochzuladen, könnten Sie viele Vorteile haben, wie zum Beispiel, dass sie Dokumente oder Bilder herunterladen können, die sie zum Beispiel für ein Profil verwenden möchten.

In diesem Beitrag werden wir einige Plugins bewerten, die es uns ermöglichen, das zu erreichen, was wir tun möchten.

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

Hier werden wir verschiedene Möglichkeiten diskutieren, um WordPress-Bilder mit verschiedenen Arten von Plugins hochzuladen.

Dateien im Frontend mithilfe eines Formular-Plugins hochladen

Eine der schnellsten und zugänglichsten Möglichkeiten ist die Verwendung eines Formular-Plugins. Dies ist nützlich, wenn wir beispielsweise ein Kontaktformular erstellen müssen, bei dem der Benutzer ein Dokument oder nützliche Informationen mithilfe eines Bildes hochladen muss.

Es gibt viele Plugins, die es ermöglichen, Formulare mit einem Dateiupload-Feld zu erstellen. Eines davon ist Contact Form 7, das es ermöglicht, Dateien auf Ihrer Website im Frontend kostenlos hochzuladen.

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

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

Wenn wir ein Dateiupload-Feld 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.

Dies öffnet ein Popup, in dem Sie die Grenzwerte für Ihren Datei-Upload festlegen können, fügen Sie alle Grenzwerte hinzu, die Sie möchten, und klicken Sie schließlich auf Tag einfügen.

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

Jetzt können Sie Ihr Formular so viel wie gewünscht anpassen, weitere Felder hinzufügen oder HTML und auch CSS hinzufügen, wenn Sie möchten, da das Formular alle Arten von Anpassungen zulässt.

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

Dadurch wird ein Shortcode generiert, den Sie verwenden können, um das Formular in Ihren Beitrag oder Ihre Seite einzubetten, zu kopieren und dann den im Seiteneditor verfügbaren Block zum Hinzufügen eines Shortcodes zu verwenden. In diesem Fall werden wir sehen, wie man es mit dem Gutenberg-Editor hinzufügt.

Jetzt müssen Sie es veröffentlichen und Sie werden in der Lage sein, das Formular mit den Feldern, die Sie hinzugefügt haben, und der Datei-Upload-Schaltfläche zu sehen.

Alles, was Sie tun müssen, ist auf "Datei wählen" zu klicken und die Datei, in diesem Fall Ihr Bild, aus Ihren Ordnern auf Ihrem PC auszuwählen.

Nachdem Sie auf "Senden" geklickt haben, sollte es fertig sein und das Bild sollte jetzt auf Ihrer Website sein.

Auf diese Weise können Ihre Benutzer Bilder auf Ihre Website hochladen, zusammen mit anderen Informationen, die wir benötigen könnten, wie den Namen oder die E-Mail-Adresse der Person, die das Formular verwendet hat, wirklich einfach und funktional.

Verwenden des WordPress-Datei-Upload-Plugins

Nachdem wir uns nun die normale "alte" Methode angesehen haben, wollen wir sehen, wie man ein Bild hochladen kann, aber mit Hilfe dieses Plugins, das es uns ermöglicht, eine Dateiupload-Option in jeden Beitrag oder jede Seite einzubetten, ohne dass wir weitere Informationen eingeben oder ein Formular erstellen müssen.

Zunächst müssen wir das "WordPress File Upload"-Plugin installiert haben, da dies uns alle Optionen gibt, die benötigt werden, um die Dateiupload-Option zu erstellen.

Nachdem wir dieses Plugin auf unserer Website aktiviert haben, sollten wir eine Menüoption sehen können, 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] hinzufügen, wo wir es anzeigen möchten. In diesem Fall haben wir einen Beitrag mit einigen vorbereiteten Informationen, wo wir den Shortcode hinzugefügt haben, damit Sie überprüfen können, wie es im Gutenberg-Editor und im Frontend aussieht.

Gutenberg-Editor

Frontend

Nachdem unser Upload-Formular hinzugefügt wurde, müssen Sie nur 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, und das Beste daran ist, dass wir auswählen können, wo auf dem Server wir das Bild direkt unter den Plugin-Einstellungen hochladen möchten, sowie wie es aussieht und viele andere Einstellungen für das Formular.

Der Hauptort, an dem wir die Uploads überprüfen können, ist die Option "Dateien hochladen" im linken Menü des Admin-Dashboards. Dies ist die Hauptseite für das Plugin, auf der alle hochgeladenen Dateien angezeigt werden.

Wie Sie sehen, ein einfaches und funktionales Plugin, das es uns ermöglicht, Bilder von unseren Nutzern zu erhalten, ohne größere Unannehmlichkeiten, als den Shortcode im Backend einzufügen und darauf zu warten, dass die Nutzer die Datei hochladen.

Medien pro Benutzerrolle mithilfe von WP Media Folder verwalten

Wie wir sehen können, gibt es viele Möglichkeiten, unseren Benutzern zu erlauben, Bilder und Dateien im Frontend hochzuladen, aber das Problem bei diesen Fällen ist, dass die Bilder "zufällig" hochgeladen werden könnten und wir keine genaue Kontrolle darüber haben, wo diese hochgeladen werden, keine Sorge! WP Media Folder zur Rettung.

WP Media Folder verfügt über ein spezielles Tool zur Verwaltung des Zugriffs auf Ihre Mediathek. Dies kann sehr hilfreich sein, wenn Sie steuern möchten, wer Bilder hochlädt und wohin, sowie wenn Sie Ihren Benutzern erlauben möchten, ihre eigenen Medien direkt in der Mediathek zu verwalten, ohne andere Rollen/Benutzer-Medien sehen zu können.

Zunächst müssen wir WP Media Folderinstalliert haben, dies ist das Plugin, das es uns ermöglicht, alle verfügbaren Funktionen zu nutzen, um dies zu ermöglichen.

Jetzt, da wir es installiert haben, müssen wir die Option zum Einschränken des Zugriffs aktivieren. Gehen Sie hierzu zu Einstellungen > WP Media Folder und wir werden die WP Media Folder-Hauptkonfigurationsseite sehen können.

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

In diesem Abschnitt werden wir, um die Medien pro Benutzerrolle zu begrenzen und automatisch einen Ordner für jede Benutzerrolle zu erstellen, Medienzugriff nach Benutzer oder Benutzerrolle und Benutzerrollen.

Wir haben auch weitere Optionen wie das Auswählen eines Pfadordners oder das Zulassen, dass die Rolle/der Benutzer alle anderen Benutzer/Rollenmedien sehen kann.

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

Mit den Optionen, die wir ausgewählt haben, sollte all dies möglich sein, also lasst uns sehen. Dafür müssen wir uns einfach als Redakteur anmelden und die Medien wie gewohnt hochladen.

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

Wie Sie sehen, gibt es zwei Abschnitte, in denen die Mediathek Ihnen mitteilt, dass wir uns in einem Ordner namens "editor" befinden, also laden wir einige Medien hoch, um zu sehen, wie es funktionieren würde.

Der Upload-Prozess wäre genau derselbe wie Sie es normalerweise tun, es könnte ein Frontend-Upload-Tool oder einfach Ihre Mediathek sein, alles, was diese Benutzerrolle hochlädt, wird automatisch für die Benutzerrolle beschränkt.

Einer der Vorteile bei der Verwendung von WP Media Folder ist, dass diese Rolle (und alle anderen mit Zugriff auf wp-admin) in der Lage sein wird, Ordner mit der + Neuer Ordner-Schaltfläche zu erstellen.

Wir können bestätigen, dass unter der Mediathek ein Editor-Ordner erstellt wurde und darin befindet sich der Ordner, den wir mithilfe der Editor-Rolle erstellt haben, und es war so einfach wie das Klicken auf eine Schaltfläche!

Nun, da wir die Zugriffsoption für Medien aktiviert haben, wird für jede Rolle, die auf Ihre Mediathek zugreift und ein Bild hochlädt, ein Ordner erstellt, und je nach den von Ihnen gewählten Einstellungen können die Medien mit anderen Benutzern unter derselben Rolle geteilt werden oder nicht. Sie können auch mehr Kontrolle über Ihre Medien mithilfe von Filtern haben.

Was für eine großartige Funktion und wirklich einfach zu bedienen! Nicht wahr?

Ermöglichen Sie Ihren Benutzern, Dateien auf professionellste Weise hochzuladen

In diesem Beitrag konnten wir sehen, wie man unseren Benutzern ermöglicht, ihre Bilder auf professionellste Weise hochzuladen und unsere Website an jeden Fall anzupassen, wie z.B. das einfache Absenden eines Formulars oder auch das Erstellen eines freigegebenen Ordners durch unsere Redakteure, den nur sie in der Mediathek sehen können, und das ist noch nicht alles! Mit WP Media Folder können Sie weitere Dinge tun, wie z.B. das Verbinden Ihrer Mediathek mit einem Cloud-Dienst, Großartig! Nicht wahr?

Weitere Informationen zu WP Media Folder und der Zugriffsbeschränkung hier!