De knop Nu betalen van Stripe Connector for NetSuite

Wanneer je de functie Stripe Connector for NetSuite, de betaalpagina voor facturen of de betaallink voor facturen (gratis en self-service) gebruikt, kun je de link van de betaalpagina op meerdere manieren van de interne factuurrecord toewijzen aan de klantgerichte factuur-PDF, zodat je klanten de betaling kunnen uitvoeren. Hier is een vooraf gemaakt codefragment voor de knop 'Nu betalen' die je kunt invoegen in de broncode van het geavanceerde PDF-document. Zie hieronder voor instructies en opties op maat.

Preview van het geavanceerde PDF-sjabloon met codefragment:

image13.png

Codefragment voor de knop 'Nu Betalen':

<#assign rawLink = record.custbody_stripe_payment_link>

<#assign paymentLink = rawLink?replace('.*href="([^"]+)".*', '$1', 'r')>

<table class="payhere" style="width: 100%; margin-top: 10px; margin-bottom: 20px;">

   <tr>

       <td align="left" style="text-align: center; padding-bottom: 20px;">

           <a href="${paymentLink}" style="display: inline-block; padding: 15px 30px; background-color: #635BFF; color: white; text-decoration: none; font-weight: bold; border-radius: 5px; font-size: 18px;”>Nu betalen</a>

       </td>

   </tr>

 <tr>

       <td align="left" style="text-align: center;">

          <img src="https://cdn.brandfolder.io/KGT2DTA4/at/g65qkq94m43qc3c9fqnhh3m/Powered_by_Stripe_-_black.png" alt="Powered by Stripe" style="width: 90px; height: 20px;" />

           </td>

   </tr>

</table>

Het onderstaande paarse gedeelte laat zien waar je het codefragment voor de knop 'Nu betalen' het best kunt plaatsen in het geavanceerde PDF-sjabloon:

image6.png

Ons codefragment installeren:

  1. Verifieer of configureer welk PDF-sjabloon wordt gebruikt door het factuurformulier waarop je het veld Link voor betaalpagina hebt geïnstalleerd.
    1. Ga naar Aanpassingen > Formulieren > Transactieformulieren. Zoek en bewerk het factuurformulier op de lijst en zorg ervoor dat dit is geconfigureerd om een geavanceerd PDF-sjabloon te gebruiken. Kopieer de naam van dat sjabloon of noteer het.
    2. Ga naar Aanpassingen > Formulieren > Geavanceerde PDF/HTML-formulieren. Vink de schakeloptie rechtsboven aan om de broncode weer te geven.
  2. Tenzij je begint met het standaard geavanceerde PDF-sjabloon voor facturen, is je sjabloon waarschijnlijk al aangepast. De broncode van de geavanceerde PDF staat in HTML en bevat CSS- en FreeMarker-elementen. Het bovenstaande codefragment is eigenlijk een 'tabel' met twee '<#assign..' parameters ervoor. Je kunt het volledige fragment kopiëren en op elke plek op de sjabloon plakken waar een individuele tabel kan worden geplaatst.
    1. Aanbevolen: klik op de knop 'Preview' rechtsboven op de pagina met de broncode. Hierdoor wordt een nieuw tabblad geopend met het visuele sjabloon van het formulier. Houd dit geopend op een afzonderlijk tabblad, zodat je kunt zien op welke plek in de code je bent. Over het algemeen kun je de tabel het gemakkelijkst plakken tussen de elementen <body> en </body> die al in de broncode staan, maar je kunt de tabel ook in de kop- of voettekst plakken.
    2. Zoek naar het begin en het einde van de verschillende codeblokken en plak het codefragment op die locatie. Zo voorkom je dat je een codeblok opbreekt.
      1. Je ziet bijvoorbeeld de hiërarchie van HTML-elementen die worden gebruikt om tabellen te maken. Dat begint meestal met <table> en eindigt met </table>. Je kunt het codefragment tussen bestaande tabellen plakken.

Op maat maken:

Het codefragment kan ongewijzigd worden gebruikt door het te kopiëren en op een juiste locatie in de broncode te plakken. Als je wilt, kun je het uiterlijk en de plaatsing van elementen wijzigen met de volgende opties:

Andere opties om je eigen veldtoewijzingen in te stellen voor het PDF-sjabloon:

Met behulp van het standaard PDF-sjabloon, kun je {custbody_stripe_payment_link} opnemen in een tekstvak. Met deze optie kun je het uiterlijk van de link echter maar in beperkte mate aanpassen.

Met de broncode van het geavanceerde PDF-sjabloon kun je je eigen code schrijven voor een knop op maat. We raden je echter wel aan om de vooraf gebouwde code als startpunt te gebruiken. Er zijn nieuwe technische vereisten voor deze link naar de betaalpagina. Zo moet je een 'hyperlink' als transactieveldtype gebruiken, waardoor je de instelling 'Tekst voor link' op de pagina met het transactieveld niet kunt gebruiken. Hiervoor moet je elementen zoals '<#assign…' en '<a href…' gebruiken, net als in het bovenstaande codefragment.