Setup Vipps MobilePay for Gravity Forms

As the leading Nordic mobile payments provider, being able to select Vipps/MobilePay as payment method is something customers today nearly expect to find online. No long card numbers and bank authentication codes to deal with, just a phone number and a quick tap on the notification that pops up on their phone. The WordPress plugin Vipps MobilePay for Gravity Forms adds support for this in Gravity Forms, and opens up a whole range of opportunities for effortless payments online. Donations and simple online shops are just a few examples of where Gravity Forms can be combined with Vipps or MobilePay to increase conversion.

Start by downloading Vipps MobilePay for Gravity Forms and uploading the plugin to your WordPress site.

Get API keys from Vipps MobilePay

Go to https://portal.vippsmobilepay.com and log in.

If you do not have an agreement with Vipps MobilePay already, place an order at https://vippsmobilepay.com/no/betalt-paa-nett/integrert-betaling

Select “For developers” in the sidebar. With the API keys tab selected, you should see a table with sales units. Unless you are a developer testing with the Merchant Test apps, use the keys for the “Production” environment.

Find your sales unit in the table and make note of the MSN column, this is needed in the plugin settings. You may then click on “Show keys”. Copy the keys to the corresponding plugin settings field.

To receive updates for the Vipps MobilePay plugin, enter the licence key you received by email upon purchasing.

Configure Vipps/MobilePay with your form

Dersom du ikke har vært borti betaling med Gravity Forms før, så er det er par ting å huske på. De spesielle feltene vi skal benytte oss av kommer innebygd i Gravity Forms og ligger under “prisfelt” i “Add fields” fanen.

Produktfelter

Et produktfelt som setter prisen på produktet må legges inn. Disse kan en ha flere av eller kombinere med betinget logikk for å få til mer avanserte skjemaer.

Totalsum

Et felt for totalsum kan legges inn dersom du har flere produkter, og dette legges gjerne helt til sist i skjemaet for å gi brukeren et siste overblikk over hvor mye de må betale før de klikker seg videre. Summen i dette feltet blir automatisk generert basert på produktfeltene vi nettopp la inn.

Aktiver Vipps på skjemaet

Når alle feltene er satt opp, ta turen inn i skjemainnstillingene og velg “Vipps MobilePay”. Her oppretter vi en “strøm” som informasjonen sendt inn i skjemaet blir kjørt gjennom. Dersom du tidligere har benyttet deg av Stripe eller PayPal med Gravity Forms bør dette steget være ganske gjenkjennelig.

Velg et navn for strømmen og fyll inn feltene nedover.

• Betalingsbeløpet kan enten settes til summen av alle produktfeltene i skjemaet (det vanligste) eller være verdien av kun ett spesifikt produkt.
• Kundens telefonnummer brukes til automatisk forhåndsinnfylling av telefonnummeret slik at kunden ikke trenger å skrive inn nummeret to ganger. Dersom du ikke samler inn telefonnummer i skjemaet ditt kan du la dette feltet være blankt.
• Betalingsmåte definerer om strømmen du oppretter skal benyttes til mobil- eller kortbetaling. Vipps MobilePay integrasjonen lar deg opprette to betalingsstrømmer og sammen med betinget logikk definere hvilken strøm som skal benyttes for transaksjonen.
• Avbryt URL er adressen kunden sendes til dersom de avbryter.
• Handlinger etter gjennomført betaling vil vises dersom du har installert en støttet integrasjon som eksempelvis Zapier.
• Betinget logikk brukes dersom du vil f.eks. ha en nedtrekksmeny med ulike betalingsmåter, og gjør det mulig å støtte både kortbetaling og mobilbetaling på ett og samme skjema. Dersom du ikke aktiverer dette blir Vipps benyttet på alle innsendinger.

Eksempel på oppsett av strøm for kortbetaling

Bekreftelser

Sider og videresending

Merk at på grunn av måten Vipps sender brukeren til en ny side for å håndtere betalingen, så må bekreftelsene på skjemaet enten være satt til “side” eller “videresending”. Opprett en dedikert side for vellykkede betalinger som gjør det klart for brukeren at betalingen er gått gjennom, og hva som skjer videre.

E-postmeldinger

Gravity Forms setter som standard e-postmeldinger til å bli utsendt rett etter innsending av skjemaet, men på grunn av at Vipps krever at brukeren utfører flere steg i appen, må e-postmeldingene settes til å bli sendt ved “Payment Completed” eller “Payment Failed”.

Og Vipps, så var det satt opp. Vi håper du får god nytte av Vipps-integrasjonen vår og setter stor pris på tilbakemeldinger dersom det skulle være noe eller om du har spørsmål.