När du använder någon av funktionerna Sida för fakturabetalning eller Länk till fakturabetalning (öppen och med självbetjäning) för Stripe Connector for NetSuite finns det flera sätt att mappa länken till betalningssidan från den interna fakturaposten till kundens version i PDF för att göra det möjligt för dina kunder att betala. Nedan hittar du ett färdigt kodavsnitt för en Betala nu-knapp. Detta kan läggas till i källkoden för den avancerade PDF:n. Läs mer nedan för instruktioner och anpassningsalternativ.
Förhandsgranskning av den avancerade PDF-mallen med kodavsnittet tillagt:
Kodavsnittet som skapar knappen Betala nu:
<#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;”>Betala nu</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>
Det lila avsnittet nedan är den rekommenderade platsen att placera kodavsnittet till knappen Betala nu i den avancerade PDF-mallen:
Så installerar du vårt kodavsnitt
- Kontrollera eller konfigurera vilken PDF-mall som används för fakturan som du har installerat fältet Länk till betalningssida på.
- Navigera till Anpassningar>Formulär>Transaktionsformulär. Hitta och redigera fakturaformuläret från den listan och se till att det är konfigurerat att använda en avancerad PDF-mall. Kopiera mallens namn eller lägg det på minnet.
- Navigera till Anpassningar>Formulär>Avancerade PDF-/HTML-formulär. Reglaget längst upp till höger visar källkoden.
- Om du inte börjar med standardversionen av den avancerade PDF-mallen för fakturor har din mall förmodligen redan anpassats. Källkoden för den avancerade PDF:n är skriven i HTML med CSS- och FreeMarker-element inkluderade. Kodavsnittet ovan är i princip en "tabell" med två <#assign..-parametrar framför. Normalt sett kan hela avsnittet kopieras och klistras in var som helst i din mall där en enskild tabell kan placeras.
- Rekommenderas: klicka på knappen Förhandsgranska längst upp till höger på källkodssidan. Det bör öppna en ny flik där man kan se en mall av formuläret. Håll formuläret öppen i en separat flik för att ha det som referens när du arbetar i koden. Vanligtvis är det enklast att klistra in tabellen mellan elementen <body> och </body> som redan finns i källkoden, men den kan även klistras in i sidhuvudet eller sidfoten.
- Du behöver hitta var de olika kodblocken börjar och slutar och klistra in kodavsnittet i det utrymmet istället för att råka lägga in det i ett befintligt kodblock.
- Du kan t.ex. se hierarkin hos HTML-element som använts för att skapa tabeller, då de börjar med <table> och slutar med </table>. Klistra in kodavsnittet mellan de befintliga tabellerna.
Anpassningsalternativ
Kodavsnittet kommer att fungera som det är om du bara kopierar och klistrar in det på ett lämpligt ställe i källkoden. Det går dock att anpassa både utseende och position genom följande alternativ:
-
align="left" – Ändra båda dessa instanser som syns nedan till "center" eller "right" för att flytta knappen Betala nu och logotypen Powered by Stripe till en annan del av sidan.
-
background-color: #635BFF – Ändra färgkoden för att ändra bakgrundsfärgen på knappen.
-
color: white – Ändra "white" till ett annat HTML-färgnamn för att ändra färg på knappens text.
-
font-weight: bold – Ändra "bold" till ett annat HTML-alternativ för att ändra knappens teckensnitt.
-
">Betala nu</a> – ändra texten "Betala nu" till något annat.
-
src="https://cdn.brandfolder.io/KGT2DTA4/at/g65qkq94m43qc3c9fqnhh3m/Powered_by_Stripe_-_black.png" alt="Powered by Stripe" style="width: 90px; height: 20px;" /> – Logotypen "Powered by Stripe" kan ändras till lila eller vit genom att klistra in motsvarande webbadress i det gröna fältet mellan citattecknen "...".
- Inuti koden finns alternativ att ändra storlek och marginaler för både knappen och logotypen Powered by Stripe.
Fler alternativ för att skapa din egen fältmappning till PDF-mallen
När du använder standardmallen kan du inkludera {custbody_stripe_payment_link} i en textruta. Det här alternativet är dock mycket begränsat när det kommer till att anpassa länkens utseende.
När du använder källkoden för den avancerade PDF-mallen kan du skriva din egen kod för en mer anpassad knapp, men vi rekommenderar att använda den färdiga mallen som utgångspunkt. Det finns nya tekniska krav för länken till en betalningssida. Bland annat måste man använda typen "Hyperlink" i fältet för transaktionsbrödtext. Då kan du inte använda "Link Text"-inställningen på sidan för fältet för transaktionsbrödtext. Det betyder att du måste använda element som "<#assign…" och "<a href…" precis som vi har gjort i kodavsnittet ovan.