Ga naar de hoofdinhoud
9 minuten leestijd (1806 woorden)

Hoe een WordPress afbeelding te uploaden vanaf de frontend met een plugin

Hoe-een-WordPress-afbeelding-te-uploaden-vanaf-de-frontend-met-een-plugin

Het uploaden van afbeeldingen is een van de belangrijkste dingen als we het hebben over een website, omdat de afbeeldingen in principe de stijl van een site geven zonder afbeeldingen kan een site te oud lijken of niet het aantal klanten/gebruikers krijgen dat we graag willen.

Afgezien hiervan kan het uw gebruikers de mogelijkheid geven om afbeeldingen te uploaden in de frontend, wat u vele voordelen kan opleveren, zoals het toestaan dat ze documenten of elke afbeelding die ze willen gebruiken, downloaden, bijvoorbeeld voor een profiel.

In dit bericht gaan we een paar plugins evalueren waarmee we kunnen bereiken wat we willen doen.

Zeg vaarwel tegen rommelige mediabibliotheek.

WP Media Folder laat je bestanden categoriseren, mappen synchroniseren met cloudopslag, ongelofelijke galleries maken en zelfs afbeeldingen vervangen zonder links te verbreken.
Optimaliseer vandaag nog je mediaworkflow

DOWNLOAD DE PLUGIN NU

Hoe een WordPress afbeelding te uploaden vanaf de frontend met een plugin

Hier zullen we verschillende manieren bespreken om WordPress-afbeeldingen te uploaden met verschillende soorten plugins.

Upload bestanden in de Frontend met behulp van een formulier-plugin

Een van de snelste en meest toegankelijke manieren is het gebruik van een formulierplugin, dit is handig wanneer we bijvoorbeeld een contactformulier moeten maken waarbij we de gebruiker vragen om een document of nuttige informatie in de vorm van een afbeelding te uploaden.

Er zijn veel plugins die het mogelijk maken om formulieren te maken met een veld voor het uploaden van bestanden, een daarvan is Contact Form 7, waarmee je gratis bestanden kunt uploaden naar je site in de frontend.

Dus om formulieren te gebruiken om uw gebruikers in staat te stellen om bestanden te uploaden in de frontend, moeten we eerst het formulier maken, dus na het installeren van de plugin, ga naar Contact > Nieuw toevoegen.

In dit scherm heb je enkele HTML-tags met de shortcode voor elk veld erin, standaard wordt een formulier gemaakt met de basisvelden.

Terwijl we een veld voor het uploaden van bestanden willen toevoegen, klikt u op de plaats waar u het veld wilt toevoegen en klikt u vervolgens op het bestand in de beschikbare knoppen/opties.

Dit opent een pop-up waarin u limieten kunt instellen voor het uploaden van uw bestanden, voeg alle limieten toe die u wilt, en klik tenslotte op invoeglabel

Dit voegt de shortcode toe voor het veld in de formulierinhoud.

Nu kunt u uw formulier naar wens aanpassen, andere velden toevoegen of HTML en CSS toevoegen als u dat wilt, aangezien het formulier al die soorten aanpassingen toestaat.

Wanneer alles klaar is, kunt u een titel toevoegen en op Opslaan klikken.

Dit zal een shortcode genereren die u kunt gebruiken om het formulier in uw bericht of pagina in te sluiten, kopiëren en vervolgens het blok gebruiken dat beschikbaar is in uw pagina-editor voor het toevoegen van een shortcode, in dit geval zullen we zien hoe u het kunt toevoegen met de Gutenberg Editor.

Nu moet je het publiceren en je zult het formulier met de velden die je hebt toegevoegd en de knop voor het uploaden van bestanden kunnen zien.

Het enige wat je hoeft te doen is op Bestand kiezen klikken en het bestand, in dit geval je afbeelding, selecteren uit je mappen op je PC.

Na het klikken op Verzenden, zou het klaar moeten zijn en zou de afbeelding nu op je site moeten staan.

Op deze manier kunnen je gebruikers afbeeldingen uploaden naar je site, samen met andere informatie die we nodig hebben, zoals de naam of e-mail van de persoon die heeft geüpload met behulp van een formulier, echt eenvoudig en functioneel.

De WordPress-bestandsuploadplugin gebruiken

Nu we de normale "oude" manier hebben gezien, laten we eens kijken hoe we een afbeelding kunnen uploaden met behulp van deze plugin die ons in staat stelt om een bestandsuploadoptie in elke post of pagina in te sluiten zonder dat we andere informatie hoeven in te vullen of een formulier hoeven te maken.

Allereerst moeten we de "WordPress File Upload"-plugin hebben geïnstalleerd, want deze geeft ons alle opties die nodig zijn om de bestandsuploadoptie te maken.

Nadat we deze plugin op onze site hebben geactiveerd, moeten we in staat zijn om een menuoptie te zien die beschikbaar is om alle bestanden te controleren die we ermee uploaden.

Om het te gebruiken, hoeven we alleen maar een shortcode [wordpress_file_upload] toe te voegen waar we het willen weergeven, in dit geval hebben we een bericht met wat voorbereide informatie waar we de shortcode hebben toegevoegd, zodat u kunt controleren hoe het eruit zou zien in de Gutenberg Editor en de frontend.

Gutenberg Editor

Frontend

Nu ons uploadformulier is toegevoegd, hoef je alleen maar op 'Bestand selecteren' te klikken om je pc-bestanden te verkennen en ten slotte op Bestand uploaden te klikken.

Door op deze knop te klikken, kan je gebruiker een afbeelding of bestand uploaden naar je site, en het beste deel hiervan is dat we kunnen selecteren waar op de server we de afbeelding willen uploaden rechtstreeks onder de plugin instellingen, evenals hoe het eruit ziet en vele andere instellingen voor het formulier.

De belangrijkste plaats waar we de uploads kunnen controleren, is in de optie 'Bestanden uploaden' in het linker menu van het admin dashboard, dit is de hoofd pagina voor de plugin waar alle geüploade bestanden worden weergegeven.

Zoals u kunt zien is dit een gebruiksvriendelijke en functionele plugin die ons in staat stelt afbeeldingen van onze gebruikers te krijgen zonder veel ongemak, afgezien van het plakken van de shortcode in de back-end en het wachten tot de gebruikers het bestand hebben geüpload.

Media per gebruikersrol beheren met WP Media Folder

Zoals we kunnen zien zijn er vele manieren om onze gebruikers afbeeldingen en bestanden te laten uploaden in de frontend, maar het punt in die gevallen is dat de afbeeldingen "willekeurig" kunnen worden geüpload en we geen goede controle hebben over waar deze worden geüpload, geen zorgen! WP Media Folder is ter hulp.

WP Media Folder heeft een speciale tool om de toegang tot uw mediabibliotheek te beheren, dit kan erg handig zijn als u wilt controleren wie afbeeldingen uploadt en waarheen, en ook als u uw gebruikers wilt toestaan om hun eigen media rechtstreeks in de mediabibliotheek te beheren zonder andere rollen/gebruikersmedia te kunnen zien.

Allereerst moeten we WP Media Folderhebben geïnstalleerd, dit is de plugin die ons in staat stelt om alle beschikbare functies te gebruiken om dit te laten werken.

Nu we het hebben geïnstalleerd, moeten we de optie inschakelen om de toegang te beperken, ga hiervoor naar Instellingen > WP Media Folder, en we kunnen de WP Media Folder hoofdconfiguratiepagina zien.

In dit gedeelte navigeert u naar Toegang & Ontwerp > Mediatoegang.

In dit gedeelte zullen we, om de media per gebruikersrol te beperken en automatisch een map te genereren die is gewijd aan elke gebruikersrol, Mediatoegang per gebruiker of Gebruikersrol en Gebruikersrollen selecteren.

We hebben ook meer opties, zoals het selecteren van een padmap of het toestaan dat de rol/gebruiker alle media van andere gebruikers/rollen kan zien.

Nu we de optie hebben ingeschakeld om alleen een gebruikersrol toe te staan hun eigen media te bewerken, laten we zeggen dat we een redacteursrol hebben en we willen dat alle gebruikers onder deze rol hun media voor berichten en pagina's kunnen zien en beheren.

Met de opties die we hebben geselecteerd, zou dit allemaal mogelijk moeten zijn, dus laten we eens kijken, hiervoor hoeven we alleen maar in te loggen als Editor en de media te uploaden zoals ze normaal zouden doen.

Wanneer ingelogd als editor, kun je de mediabibliotheek als volgt zien.

Zoals je kunt zien, zijn er twee secties waar de mediabibliotheek je laat weten dat we ons in een map bevinden met de naam "editor", dus laten we wat media uploaden om te controleren hoe het werkt.

Het proces voor het uploaden zou exact hetzelfde zijn als je normaal gesproken doet, het kan zijn door een frontend upload tool te gebruiken of gewoon door je Media Bibliotheek te gebruiken, alles wat deze gebruikersrol uploadt zal automatisch worden beperkt tot de gebruikersrol.

Een van de voordelen van het gebruik van WP Media Folder is dat deze rol (en alle anderen met toegang tot de wp-admin) mappen kan maken met de +Nieuwe map toevoegen knop.

Nu we wat media en ook een submap hebben toegevoegd aan onze rolmap, moeten we deze als admin kunnen zien onder de Editor-map.

We kunnen bevestigen dat onder de mediabibliotheek een Editor-map is gemaakt en daarbinnen is de map die we hebben gemaakt met behulp van de Editor-rol, en het was net zo eenvoudig als het klikken op een knop!

Nu we de media toegang optie hebben ingeschakeld, wordt er een map gemaakt voor elke rol die toegang heeft tot uw mediabibliotheek en een afbeelding uploadt, en zal in staat zijn om de media al dan niet te delen met andere gebruikers onder dezelfde rol, afhankelijk van de instellingen die u kiest, kunt u ook meer controle hebben over uw media met behulp van filters

Wat een geweldige functie en echt gemakkelijk te gebruiken! Is het niet?

Sta uw gebruikers toe om bestanden op de meest professionele manier te uploaden

In dit bericht konden we zien hoe we onze gebruikers in staat konden stellen om hun afbeeldingen op de meest professionele manier te uploaden en onze site aan te passen aan elk geval, zoals het indienen van een formulier of onze editors in staat stellen om een gedeelde map te maken die alleen zij kunnen zien in de Media Bibliotheek, en dat is niet alles! Met WP Media Folder kunt u nog veel meer doen, zoals uw Media Bibliotheek verbinden met een cloud service, Geweldig! Is het niet?

Lees hier meer over WP Media Folder en de toegangsbeperking hier!

Blijf op de hoogte

Wanneer u zich abonneert op de blog, sturen we u een e-mail wanneer er nieuwe updates op de site zijn, zodat u ze niet mist.

Gerelateerde artikelen

 

Reacties

Nog geen reacties. Wees de eerste om een reactie te plaatsen
Al geregistreerd? Inloggen
Maandag, 9 februari 2026

Captcha afbeelding

An Error Occurred: Whoops, looks like something went wrong.

Sorry, there was a problem we could not recover from.

The server returned a "500 - Whoops, looks like something went wrong."

Help me resolve this