Easy Digital Downloads is toegewijd aan het leveren van een gebruiksvriendelijk e-commerce systeem voor WordPress-gebruikers. We werken er dagelijks hard aan om dat doel te bereiken. Vanwege de uitbreidbaarheid en de onvermijdelijke variatie in klantbehoeften, blijft veel functionaliteit echter over aan de ontmoedigende taak van maatwerkontwikkeling.
Een van de meest voorkomende behoeften die we zien in ons supportkanaal is een gemakkelijke manier om aangepaste afrekenformulieren te maken. Voor niet-ontwikkelaars is het bouwen van aangepaste formulieren al moeilijk genoeg. Breng e-commerce functionaliteit in beeld en zelfs de doe-het-zelf-menigte worstelt.
Het doel van dit artikel is om elke Easy Digital Downloads-gebruiker, ongeacht het vaardigheidsniveau, te helpen leren hoe aangepaste afrekenformulieren te bouwen zonder *enige* code te schrijven.
Minimaal vereiste plugins
Er zijn minstens vier plugins die samen moeten werken om dit te laten gebeuren. Ik zal ze hieronder uitleggen.
Easy Digital Downloads
Hoewel Easy Digital Downloads zijn eigen kernafrekenfunctionaliteit heeft, ondersteunt het basissysteem slechts één "universeel" afrekenformulier. Zelfs als u het formulier aanpast, zal het nog steeds hetzelfde formulier zijn voor alle transacties, ongeacht wat er in de winkelwagen zit.
Gravity Forms
Gravity Forms is een geavanceerde formulierbouwer voor WordPress. U kunt het gebruiken om alles te maken, van het meest basale contactformulier tot complexe formulieren die elk doel dienen. Met functies zoals conditionele veldlogica, organisatie en presentatie van inzendingen, en ondersteuning voor add-ons, is het ongetwijfeld een van de populairste premium WordPress-plugins op de markt.
Gravity Forms Checkout
Gravity Forms Checkout is de brug tussen Easy Digital Downloads en Gravity Forms. Om meerdere aangepaste afrekenformulieren voor uw producten te maken, is deze Easy Digital Downloads-extensie een noodzakelijk onderdeel van de puzzel.
Gravity Forms Betaal Add-on
Ten slotte vereisen aangepaste afrekenformulieren die via Gravity Forms zijn gemaakt, dat u Gravity Forms add-ons gebruikt om extra functionaliteit aan de formulieren zelf toe te voegen. Dat betekent dat Easy Digital Downloads-betaalpoorten niet werken met Gravity Forms Checkout.
Om betalingen te verwerken, moet u betaalpoorten gebruiken die zijn gebouwd voor Gravity Forms. In dit artikel verwijzen we naar de Gravity Forms PayPal Payments Standard add-on. Er zijn aanvullende opties beschikbaar, zoals Stripe en Authorize.net.
Aangepaste afrekenformulieren maken
Nu u alle vereiste plugins hebt, laten we beginnen. We doorlopen de creatie van een basisafrekenformulier voor een enkel product. Volg de stappen als u er klaar voor bent.
Op dit punt zou u al producten in uw winkel moeten hebben die u wilt verkopen. Houd er rekening mee dat, zelfs als u de bovengenoemde tools hebt geactiveerd of in gebruik hebt, uw Easy Digital Downloads-winkel nog steeds op de oorspronkelijke manier zal functioneren.
Aangepaste afrekenformulieren met Gravity Forms Checkout voegen simpelweg een optie toe. Je producten kunnen nog steeds op de traditionele manier worden gekocht.
Maak nieuwe formulieren met Gravity Forms
Voor het proces van het maken van formulieren, zie het als Easy Digital Downloads dat integreert met Gravity Forms, in plaats van andersom. Met die aanpak is het logisch dat om een nieuw aangepast afrekenformulier te maken, je eerst een nieuw formulier moet maken in Gravity Forms.
Met Gravity Forms geactiveerd, ga naar Formulieren -> Nieuw formulier in je WordPress-dashboard. Je wordt gevraagd om het formulier een titel en een optionele beschrijving te geven. Doe dit en maak het formulier.
Basisvelden toevoegen
In dit stadium heb je een formulierinvoer aangemaakt, maar deze heeft nog geen velden. Het enige wat het heeft is een titel en een beschrijving die standaard automatisch worden weergegeven, hoewel je ze kunt verbergen als je dat wilt.
Je moet minimaal een e-mailadres van je klanten verzamelen. Dus we voegen een e-mailadresveld toe aan ons formulier om te beginnen.
Aan de rechterkant van het scherm zie je verschillende uitklapbare secties met veldgroeperingen. Het E-mailveld bevindt zich in de sectie Geavanceerde velden. Om het E-mailveld aan je formulier toe te voegen, klik je simpelweg op de knop met het label E-mail.
Door op de knop te klikken, wordt het veld aan je formulier (linkerkant van het scherm) toegevoegd met minimale standaardinhoud. Verplaats je cursor over het nieuwe veld en wanneer je de visuele indicator ziet dat je eroverheen zweeft, klik je eenmaal op het veld om de opties te bekijken.
Het E-mailveld is heel eenvoudig en heeft slechts één aanpassing nodig. Onder de sectie Regels, markeer het veld als Vereist. Met deze configuratie zal het afrekenformulier niet worden verzonden zonder een e-mailadres.
Velen van jullie zullen ook velden zoals voor- en achternaam willen toevoegen. We zullen die niet in dit artikel bespreken, maar het proces is erg vergelijkbaar met het toevoegen van het E-mailveld.
Nu we een verplicht e-mailadresveld hebben, laten we nog één veld toevoegen voordat we verder gaan met productgerelateerde velden.
Alleen voor de structuur en om meer vertrouwd te raken met Gravity Forms, voegen we een veld toe aan het formulier dat een Sectie wordt genoemd. Secties zijn een gemakkelijke manier om je formulier op te splitsen in visuele secties die helpen bij de stroom van het invullen van het formulier.
Het Sectieveld bevindt zich in de sectie Standaardvelden. Voeg het toe aan je formulier en vouw het uit om de opties te bekijken.
Op basis van het veldtype en het feit dat we hierna een Productveld zullen toevoegen, beschouwen we dit Sectieveld als een kop voor de weergave van het productveld.
Pas de velden Veldlabel en Beschrijving naar wens aan. Iets als "Productinformatie" als Veldlabel en eventuele kleine details die je wilt onthullen over het product zelf als Beschrijving.
Op elk moment tijdens het creatieproces kunt u de structuur van uw formulier voorvertonen door op de link Voorvertoning te klikken, die zich in het navigatiemenu net boven de formulierbouwer bevindt. Houd er rekening mee dat voor sommige velden u het formulier moet bijwerken om een voorvertoning te kunnen zien.
De voorvertoning van uw formulier is geen weergave van hoe het op de front-end zal worden ontworpen. Gebruik de voorvertoning in plaats daarvan om naar de structuur en functionaliteit te kijken. Op dit moment hebben we niet meer dan een e-mailveld, een sectietitel (label) en een beschrijving.
Als u nog niet bekend bent met Gravity Forms, is wat u tot nu toe hier hebt gedaan hoe u de formulierbouwer zou gebruiken voor elk type formulier dat u maakt, niet alleen met Easy Digital Downloads. Als u niet duidelijk bent over hoe de basisformulierbouwer functioneert, bezoek dan de documentatie van Gravity Forms.
In dit stadium van het proces zou de voorvertoning van uw formulier er ongeveer zo uit moeten zien:
Met de formuliertitel, formulierbeschrijving, e-mailveld en productinformatiesectie op hun plaats, kunnen we een product aan het formulier toevoegen.
Productvelden toevoegen
Onthoud dat dit een extreem eenvoudig formulier is en het doel ervan is om als afrekening voor één specifiek product te dienen. Voor degenen die liever een aangepast afrekenformulier voor een specifiek product hebben in plaats van de knop 'Toevoegen aan winkelwagen' en de traditionele afrekening te gebruiken, zou dit formulier een ideale vervanging zijn.
Dat gezegd hebbende, zullen we het Productveld toevoegen en weergeven aan het formulier voor informatieve doeleinden. De klant wordt geïnformeerd over tot welk product het formulier hem of haar toegang zal verlenen, samen met de prijs.
Aan de rechterkant van het scherm vindt u de sectie Prijsvelden. Selecteer in die sectie een nieuw Productveld door op de knop met het label Product te klikken. Eenmaal toegevoegd, vouwt u het veld uit.
Ik zal een product genaamd "Voorbeeld Product" verkopen, dat al is aangemaakt als een Download-item. Nadat ik de secties Veldlabel en Beschrijving heb ingevuld, zal ik mijn Productveld verbinden met Easy Digital Downloads door "Voorbeeld Product" te selecteren uit het keuzemenu Verbinden met EDD Download.
Verdergaand met de instellingen, zal ik mijn Veldtype instellen op "Enkel Product" met een Prijs van $10. Houd er rekening mee dat omdat ik de volledige controle over het formulier heb, ik de prijs zelf moet instellen. Deze wordt niet uit het Download-item gehaald.
Ten slotte vink ik het vakje Aantalveld uitschakelen aan en stel ik de enige Regels in als Vereist.
Laten we een actuele voorvertoning van mijn aangepaste afrekenformulier bekijken.
Met alleen die velden op hun plaats, hebt u een formulier gemaakt dat klaar is om "Voorbeeld Product" aan uw klanten te verkopen. Het enige wat u nu nog hoeft te doen, is velden toevoegen om de betaling te accepteren.
Let op: het weergeven van het Product-veld is optioneel. Hoewel het veld aanwezig moet zijn om het formulier aan het product te koppelen, kunt u
De reden dat u dit wilt doen, is omdat dit afrekenformulier (via shortcode) kan worden ingesloten op een pagina die al belangrijke informatie over het product geeft, inclusief de prijs. Als dit het geval is, kan het weergeven van het Product-veld in het formulier overbodig en zelfs verwarrend zijn voor de klant.
Vergeet niet dat het veld aanwezig moet zijn.
Op dit punt moet u uw formulier opslaan. De volgende stap vereist dat u andere pagina's bezoekt om betalingsopties te configureren. Zodra dit is voltooid, zullen we terugkeren naar het formulier.
Betalingsvelden toevoegen
Nu kunnen we betalingen van klanten accepteren. Om dat te doen, moeten we het formulier zo instellen dat het ten minste één betaalmethode accepteert. Zoals eerder vermeld, zullen we de PayPal Payments Standard add-on voor Gravity Forms gebruiken om onze betalingen te verwerken.
Afhankelijk van de gekozen betaalpoort, moet u mogelijk wel of geen direct veld aan uw formulier toevoegen. Als u bijvoorbeeld de Stripe add-on gebruikt, voegt deze een Creditcard-veld toe aan de formulierbouwer dat u kunt selecteren zoals u eerder hebt gedaan.
De PayPal Payments Standard add-on doet dit echter niet. In plaats daarvan zou u instructies rechtstreeks van Gravity Forms moeten volgen voor het instellen van uw formulieren om PayPal te gebruiken voor klanttransacties.
In dit artikel zullen we die details niet behandelen. Ze zijn van toepassing op Gravity Forms, of het nu is geïntegreerd met Easy Digital Downloads of niet. U wilt dus de documentatie van Gravity Forms gebruiken om de documenten te vinden die relevant zijn voor uw behoeften.
Voltooi alle vereiste stappen voor het instellen van uw betaalpoorten. Als er een nieuw veld aan het formulier moet worden toegevoegd, doe dit dan volgens dezelfde methoden als hierboven beschreven.
Het toevoegen van het definitieve betalingsbedrag (totaal)
Tijdens het configureren van uw betalingsoptie(s) zou u zijn geïnstrueerd om een Feed aan te maken voor elk type betaling dat u zou accepteren. PayPal Payments Standard-gebruikers zouden deze documentatie hebben bezocht.
Bij het aanmaken van die Feed zou u het Betalingsbedrag voor de Feed hebben moeten instellen. Wat dit betekent is dat elke keer dat uw afrekenformulier wordt ingediend, de klant een bepaald bedrag moet betalen en de Feed moet weten waar u dat bedrag vandaan haalt.
De instelling Betalingsbedrag moet worden ingesteld om gegevens te halen uit een van uw formuliervelden die de totale waarde van het formulier bevat. We hebben dat veld echter nog niet ingesteld. Sla de voortgang van uw Feed op en ga terug naar uw opgeslagen formulier, zodat we het veld kunnen toevoegen.
Selecteer aan de rechterkant van het formulierbouwer-scherm om een Totaal-veld aan uw formulier toe te voegen vanuit de sectie Prijzenvelden. Eenmaal toegevoegd, vouwt u het nieuwe veld uit.
U zult zien dat er niet erg veel instellingen zijn. Het veld is ontworpen om automatisch het formuliertotaal te berekenen op basis van informatie die het verkrijgt uit de andere formuliervelden en mogelijke klantinteractie.
Met dit veld toegevoegd aan uw formulier en uw formulier bijgewerkt, kunt u dit veld nu instellen als het Betalingsbedrag in uw Feed.
Volg de rest van de Gravity Forms-documentatie om uw Feed-instellingen te voltooien en de nieuwe Feed op te slaan.
Uw aangepaste afrekenformulier gebruiken
Nu u een aangepast afrekenformulier hebt gemaakt dat klaar is om betalingen te accepteren, moet u uw formulier weergeven. Gravity Forms maakt dat extreem eenvoudig met de [[gravityform]]-shortcode. Klik op elke pagina, bericht of aangepast berichttype waar u wilt, op de knop Formulier toevoegen om een formulier aan uw inhoud toe te voegen.
Zodra uw pagina is opgeslagen, wordt het formulier aan de voorkant weergegeven en is het klaar om betalingen te accepteren voor welk product u ook hebt geconfigureerd.
Houd er rekening mee dat als PayPal Payments Standard de enige gateway is die u hebt geconfigureerd, er geen PayPal-gerelateerde tekst op het formulier wordt weergegeven (tenzij u aangepaste tekst hebt toegevoegd). Alleen het invullen van het formulier en het indienen zal de klant doorsturen naar PayPal om de betaling te voltooien.
Voorbeelden van voorwaardelijke logica
Het zou onmogelijk zijn om elke mogelijke formulierconfiguratie in dit ene artikel te behandelen. We kunnen echter enkele voorbeelden delen om u op weg te helpen met het slimmer en gebruiksvriendelijker maken van uw formulier.
Laten we een voorbeeldformulier bekijken dat we hier op de Easy Digital Downloads-site gebruiken. Om nieuwe gebruikers te helpen de extensies te kiezen die ze nodig hebben om hun winkels op te zetten en te laten draaien, hebben we het Starterspakket gemaakt. (Update: ons Starterspakket is niet langer live, omdat we wijzigingen hebben aangebracht in onze algemene aankoopopties. U kunt doorlezen alsof het bestaat.)
Dit zelfstandige formulier is niet afhankelijk van de winkelwagenfunctionaliteit.
Opgedeeld in logische secties die extensieselecties bevatten, hoeft een klant alleen de extensies te selecteren die passen bij zijn of haar zakelijke behoeften, persoonlijke en betalingsinformatie in te voeren, akkoord te gaan met de voorwaarden en de aankoop te voltooien.
Niet alleen is het formulier volledig aangepast, het kan gemakkelijk een van de vele aangepaste afrekenformulieren op de site zijn. Met de bovenstaande informatie kunt u goed op weg zijn om precies dat te hebben.
Aangepaste productpakketten
Op ons Starterspakket-formulier hebt u mogelijk het gebruik van gerichte extensiesecties opgemerkt waarmee de klant specifieke producten kan kiezen. Laten we specifiek kijken naar de Marketingsectie.
Wanneer een gebruiker een vakje aanvinkt voor een van onze marketingextensies, wordt de extensie toegevoegd aan zijn of haar aangepaste starterspakket, waardoor het totaal van het formulier verandert.
Om dit te bereiken, moet u:
- Voeg een nieuw Aanvinkvakjes-veld toe aan je formulier. Eenmaal uitgevouwen verschijnen er drie standaard aanvinkvakjesopties onder de sectie Keuzes. Als je dit aanvinkvakjesveld wilt gebruiken om bijvoorbeeld de selectie van vijf producten toe te staan, moet je vijf keuzes maken die de namen van je vijf producten vertegenwoordigen. Maak dit een verplicht veld.
- Voeg een nieuw Product-veld toe aan je formulier. Configureer het Product-veld om te koppelen aan een van de Easy Digital Downloads-producten waarnaar je hebt verwezen vanuit je aanvinkvakjeskeuzes. Stel op het tabblad Algemeen van de Productinstellingen het Veldtype in op "Enkel Product" (het kan niet verborgen zijn) en geef het een prijs. Vink op het tabblad Geavanceerd de instelling Voorwaardelijke logica inschakelen aan en stel het veld zo in dat het alleen wordt weergegeven als de juiste "Keuze" uit je aanvinkvakjesveld in stap 1 is geselecteerd.
- Herhaal stap 2 voor alle Keuzes die in stap 1 zijn gemaakt.
Dit zorgt ervoor dat Productvelden alleen aan het formulier worden toegevoegd wanneer aan hun voorwaarden is voldaan. Die voorwaarden zijn gecontroleerde Keuzes uit het aanvinkvakjesveld. Zolang die Keuzes je producten vertegenwoordigen en via voorwaardelijke veldlogica aan hen zijn gekoppeld, kunnen klanten hun eigen aangepaste pakketten maken.
Betalingsmethode selector
Tegen het einde van ons Starterspakket-formulier instrueren we de klant om een betalingsmethode te selecteren. We accepteren betalingen via Stripe en PayPal.
Zoals hierboven vermeld, worden verschillende methoden gebruikt om velden toe te voegen aan het formulier voor betalingsinformatie. PayPal Payments Standard vereist geen veld, maar Stripe vereist er verschillende. Stripe's Creditcardveld en een extra Adresveld moeten aan het formulier worden toegevoegd om creditcardbetalingen te verwerken.
Om dit te maken, moet je:
- Voeg een nieuw Keuzerondjes-veld toe aan je formulier. Eenmaal uitgevouwen verschijnen er drie standaard keuzerondjesopties onder de sectie Keuzes. Aangezien we klanten de keuze geven tussen twee betalingsmethoden, moet je twee keuzes hebben die de namen van de betalingsmethoden vertegenwoordigen. In ons geval kozen we Creditcard / Bankpas en PayPal als keuzes. Maak dit een verplicht veld.
- Voeg alle benodigde velden toe voor het accepteren van creditcardbetalingen op basis van de instructies van Gravity Forms. Configureer de velden om alle vereiste informatie te verzamelen. Vink op het tabblad Geavanceerd van alle creditcardgerelateerde velden de instelling Voorwaardelijke logica inschakelen aan en stel de velden zo in dat ze alleen worden weergegeven als de juiste "Keuze" uit je keuzerondjesveld in stap 1 is geselecteerd.
- Omdat PayPal geen velden in het formulier vereist, hoef je alleen maar naar je PayPal Feed voor het formulier te gaan en in de instellingen ervan de instelling Voorwaardelijke logica inschakelen aan te vinken en de Feed zo in te stellen dat deze alleen wordt gebruikt als de juiste "Keuze" uit je keuzerondjesveld in stap 1 is geselecteerd (PayPal).
De keuze is aan jou
Dit is een moeilijk onderwerp om over te schrijven, want zodra je het concept van conditionele veldlogica begrijpt, heb je echt een blanco canvas om mee te werken elke keer dat je een aangepast afrekenformulier maakt.
We kunnen voorbeelden geven, maar de mogelijkheden zijn eindeloos. De sleutel tot dit alles is de conditionele logica en het strategische gebruik van Productvelden.
Het is aan jou om te beslissen of je producten een meer gespecialiseerd afrekenformulier nodig hebben. Het creëren van iets vergelijkbaars met ons Starterspakket is een zakelijke keuze die alleen jij kunt maken.
Speel met de functies om te zien of het een paar lucratieve ideeën opwekt.
Veelgestelde Vragen
Kan ik Gravity Forms Checkout gebruiken met de Recurring Payments-extensie?
Nee. Recurring Payments integreert niet met de bovenstaande configuratie.
Hoe zit het met e-mailontvangsten en aankoopbevestiging?
De standaard Easy Digital Downloads Purchase Confirmation-omleiding is niet langer van toepassing. Gravity Forms staat je echter toe om aangepaste bevestigingsgedrag in te stellen als je dat wilt. Een standaardpagina met statische links wordt aanbevolen.
De e-mailontvangst wordt nog steeds naar de gebruiker verzonden met productgerelateerde informatie die je in je ontvangst-sjabloon hebt. Dit gedrag verandert niet.
Tip: stuur vanuit een aangepaste bevestiging die je in Gravity Forms maakt, je klanten na aankoop naar hun e-mails en link ze naar belangrijke informatie die verwarring kan minimaliseren.
Als ik klanten aangepaste pakketten laat maken, worden deze dan verwerkt als Bundels?
De kernbundelfunctionaliteit van Easy Digital Downloads is niet van toepassing. Als een klant 10 producten koopt via een van je aangepaste afrekenformulieren, wordt elk product als een afzonderlijke aankoop beschouwd.
Hoe gebruik ik kortingen?
Om kortingen te geven aan klanten die het aangepaste afrekenformulier gebruiken, moet je simpelweg de Productvelden instellen op een verlaagde prijs. Klanten kunnen geen kortingscode invoeren zoals bij het standaard afrekenformulier.
Hoe style ik mijn aangepaste afrekenformulieren?
Het is belangrijk op te merken dat alles wat we hier hebben besproken, het bouwen van het formulier en de functionaliteit ervan betreft. Dit zijn generieke formulierelementen en moeten door je thema of je eigen aangepaste CSS worden gestyled, net als elk ander HTML-element.
Zorg er bij het testen van je formulier voor dat je de juiste functionaliteit test. Of het er nu prettig uitziet of niet, is geen indicatie van hoe het werkt. Zoals je je kunt voorstellen, kostte het creëren van de Starterspakket-weergave verschillende uren aangepast ontwerpwerk.
Als je vragen hebt over wat er in dit artikel is genoemd, stel dan gerust een vraag hieronder in de reacties.
Gebruik voor ondersteuning ons ondersteuningsformulier.
