Anpassen des Erscheinungsbildes von Payment Pages

Unsere gehostete Payment Pages -Integration unterstützt eine tiefgreifende Anpassung von Layout und Aussehen mit benutzerdefiniertem HTML, CSS und JavaScript.

Wie funktioniert das?

Schreiben von benutzerdefiniertem HTML/CSS/JS-Markup.
Laden Sie Dateien über Portal / MyST Datei-Manager auf unsere Plattform hoch, um eine stprofile.
Aktualisieren Sie die HTTPS POST auf Payment Pages , um eine stprofile beim Checkout.

Content Security Policy (CSP)

Wenn Sie Ihr Payment Pages benutzerdefiniert gestalten möchten, müssen Sie sich mit unserem Support-Team in Verbindung setzen, um sicherzustellen, dass CSP-blocking auf Ihrer Test Website-Referenz aktiviert ist. Sie müssen auch eine Liste von vertrauenswürdigen URIs (Uniform Resource Indicators) bereitstellen, auf die von Ihrem Markup aus zugegriffen werden kann. Typische Beispiele wären, wenn Sie auf extern gehostete Skripte oder Bilder verweisen müssen, um bestimmte visuelle Aspekte Ihres Checkouts darzustellen und/oder um Analysen durchzuführen.

Hinweis: Um eine URI in die White-List aufzunehmen, muss die Ressource über HTTPS geladen werden.

Um Ihr Konto besser vor Eingriffen durch unbefugte Dritte zu schützen, blockieren wir die Kommunikation mit URIs, die nicht in der oben genannten Liste enthalten sind. Aus diesem Grund ist es wichtig, dass Sie Ihre Änderungen auf Ihrer Test Website-Referenz gründlich testen, bevor Sie sie auf Ihre Live Website-Referenz anwenden.

Sollten Sie in Zukunft die URI Whitelist für eine Ihrer Website-Referenzen aktualisieren müssen, wenden Sie sich bitte mit Ihrer Anfrage an unser Support-Team und wir werden die Konfiguration entsprechend aktualisieren. Wir werden Sie benachrichtigen, sobald die neuen URIs in die Whitelist aufgenommen wurden und als Teil Ihrer Lösung zur Verfügung stehen.

Wenn Sie Fragen haben oder weitere Informationen benötigen, zögern Sie bitte nicht, uns zu kontaktieren.

Was ist eine stprofile?

Um das Aussehen und Layout von Payment Pages anzupassen, müssen Sie stprofiles verwenden.

Eine stprofile besteht aus benutzerdefinierten HTML-, CSS- und/oder JavaScript-Dateien, die zusammenarbeiten, um Änderungen vorzunehmen.

Sie können mehrere stprofiles einrichten, um je nach Situation unterschiedliche Layouts und/oder Stylings anzuwenden.

Für ein Grußkartengeschäft könnten Sie z.B. verschiedene Profile für jede Abteilung oder Produktart haben:

Durch die Aktualisierung von POST auf Payment Pages kann eine benutzerdefinierte stprofile für jede Kundensitzung angewendet werden.

Wenn eine benutzerdefinierte stprofile nicht angegeben wird, werden die Standardseiten von Trust Payments angezeigt.

Konventionen zur Benennung von Dateien

Das Markup wird stprofiles zugewiesen, indem dem Dateinamen der Name der stprofile.

Sie müssen also zunächst den Namen Ihrer stprofile(s) festlegen.

Wenn Sie beabsichtigen, für alle Kundensitzungen dasselbe Styling zu verwenden, brauchen Sie sich nur um die Benennung eines stprofile benennen, das Sie auf jede Transaktion anwenden können.

Wenn der Stil je nach Situation unterschiedlich sein soll, müssen Sie mehr als einen planen stprofile.

Bitte beachten Sie bei der Benennung Ihrer stprofile die folgenden Anforderungen:

stprofile Die Namen dürfen nur Kleinbuchstaben und/oder Zahlen enthalten (max. Länge 20).
stprofile Namen müssen nicht Großbuchstaben, Interpunktionszeichen oder Leerzeichen enthalten.

Wenn der stprofile Name festgelegt, müssen die hochgeladenen Auszeichnungsdateien der folgenden Benennung folgen:
(Ersetzen Sie [stprofile ] durch den Namen Ihrer stprofile)

[stprofile ] choice.html - Seite, auf der der Kunde seine Zahlungsmethode auswählt.
[stprofile ] details.html - Seite, auf der der Kunde seine Zahlungsdaten eingibt.
[stprofile ] locked.html - Seite, die angezeigt wird, wenn der Kunde die Seite aktualisiert, während seine Zahlung bearbeitet wird.
[stprofile ] 3dredirect.html - Seite, die angezeigt wird, wenn der Kunde zur Authentifizierung auf 3-D Secure weitergeleitet wird.
[stprofile ] response.html - Seite, die dem Kunden nach Abschluss der Transaktion angezeigt wird.
[stprofile ].css - Sie können eine einzelne CSS-Datei hochladen, die alle Seiten für den angegebenen stprofile.
[stprofile ].js - Sie können eine einzelne JS-Datei hochladen, die alle Seiten für den angegebenen stprofile.

Wir werden als nächstes erklären, was in diese Dateien gehört, aber wenn Sie bereit sind, können Sie unter diesen Links nachlesen, wie Sie sie über Datei-Manager in unser System hochladen können: Portal / MyST

Hinweis: Es können zwar mehrere stprofiles für eine einzige Website-Referenz definiert werden, aber die hochgeladenen Dateien können nur auf der Website-Referenz verwendet werden, auf die sie hochgeladen wurden. Zur Verwendung eines stprofile über mehrere Sites zu verwenden, müssen die Dateien separat auf jede Website-Referenz hochgeladen werden, wo sie benötigt werden.

Markup schreiben

Wenn Sie Ihren HTML-Code schreiben, müssen Sie integrierte Felder und Blöcke verwenden, um Felder auf den Seiten anzuzeigen, wenn diese von Trust Payments gerendert werden.

Wenn Sie Ihre Website Payment Pages anpassen, sind Sie dafür verantwortlich, dass Ihre Lösung mit den einschlägigen Regelungen konform ist.

Felder

Sie können st.field in Ihr HTML einfügen, um Informationen aus der Sitzung und Eingaben wie Textfelder und Dropdown-Boxen als Teil der gerenderten Seite anzuzeigen. Mit CSS und HTML können Sie diese Elemente und ihre Position auf der Seite vollständig anpassen.

Feldtypen

Im Folgenden finden Sie Beispiele für die Arten von Feldern, die in Ihren HTML-Code aufgenommen werden sollten:

Werte

Ein Wert wird verwendet, um zuvor eingegebene Informationen anzuzeigen, z. B.

You can use the following reference to track your order: {{st.orderreference.value}}

Textfelder

Ein Textfeld ermöglicht es dem Kunden, neue Informationen einzugeben, z.B.

Please enter your postcode: {{st.billingpostcode.textfield}}

Dropdowns

Drop-downs ermöglichen es den Kunden, Informationen aus einer Liste auszuwählen, z. B.

Country: {{st.billingcountryiso2a.dropdown}}

Bestimmte Felder können nicht als Texteingabe oder Dropdown-Liste angezeigt werden.

Vorabbefüllung und Validierung

Die in den vorangegangenen Abschnitten beschriebenen HTML-Formulare werden automatisch mit Informationen aus der Sitzung vorausgefüllt, sofern diese bereits eingegeben wurden. Wenn der Kunde nicht alle erforderlichen Felder ausfüllt oder ungültige Informationen eingibt, wird die Zahlung nicht fortgesetzt und das betreffende Feld wird auf dem Bildschirm hervorgehoben.

Alle Felder von Trust Payments werden überprüft. Benutzerdefinierte Felder können nicht von Trust Payments validiert werden.

Feldfehler werden dem Kunden nur angezeigt, wenn die entsprechenden Eingabefelder auf der Seite enthalten sind

Wurde z. B. eine ungültige E-Mail-Adresse per Post übermittelt, kann der Kunde diese auf Payment Pages nicht korrigieren, wenn dieses Eingabefeld nicht sichtbar ist, so dass er seine Zahlung nicht abschließen kann.

Bitte vergewissern Sie sich, dass alle Daten nach unseren Vorgaben validiert wurden, bevor Sie sie an Payment Pages senden, ODER dass Sie die erforderlichen Rechnungs-/Lieferdaten auf Payment Pages anzeigen, damit der Kunde gegebenenfalls Änderungen vornehmen kann.

Benutzerdefinierte Felder

Benutzerdefinierte Texteingabefelder und -werte können auf dieselbe Weise eingegeben werden wie die zuvor beschriebenen integrierten Felder, z. B.

Enter your Membership Id: {{st.memberid.textfield}}
This is your Membership Id: {{st.memberid.value}}

Die st.field Funktionalität unterstützt keine Dropdowns für benutzerdefinierte Felder.
Trust Payments kann keine benutzerdefinierten Felder validieren.

Benachrichtigungen und Weiterleitungen

Die meisten Felder, die in einer Payment Pages -Sitzung verwendet werden, einschließlich benutzerdefinierter Felder, können auf Ihrer Website als Teil einer Weiterleitung oder als Teil einer URL-Benachrichtigung.

Feldbezug

Zeichenerklärung

- Werte, die angezeigt werden können
- Textfelder, in die die Benutzer eingeben können
- Dropdown-Listen, aus denen die Benutzer auswählen können

Feld	Beschreibung
accounttypedescription	Die Art des Kontos, über das die Anfrage bearbeitet wird (z. B. "ECOM", "MOTO").
authcode	Der Code Autorisierung wird vom Kartenaussteller auf Autorisierung zur Verfügung gestellt.
ban	Überweisungsspezifisches Feld: Bankkontonummer des Kunden.
bankid	Überweisungsspezifisches Feld: Bankleitzahl des Kunden.
bankname	Überweisungsspezifisches Feld: Name der Bank des Kunden.
baseamount	Der Betrag in Basiseinheiten ohne Kommas oder Dezimalpunkte. Zum Beispiel 10,50€ in Basiseinheiten ist "1050".
bic	Gültige BIC (Bank Identifier Code) der Bank des Kunden.
billingcountryiso2a	Zweistelliger Ländercode für die Rechnungsadresse. Für eine Liste der Ländercodes, klicken Sie hier.
billingcounty	Landkreis für die Rechnungsadresse.
billingdob	Geburtsdatum des Kontoinhabers.
billingdobday	Geburtsdatum des Kontoinhabers (der Tag).
billingdobmonth	Geburtsdatum des Kontoinhabers (der Monat).
billingdobyear	Geburtsdatum des Kontoinhabers (das Jahr).
billingemail	E-Mail Adresse für die Rechnungsstellung.
billingfirstname	Vorname für Rechnungsangaben.
billinglastname	Nachname für Rechnungsangaben.
billingmiddlename	Mittlerer Name oder Initiale für Rechnungsangaben.
billingpostcode	Die Postleitzahl für die Rechnungsadresse.
billingprefixname	Präfix für den Rechnungsnamen. Zum Beispiel: "Herr", "Frau", "Frau", "Dr.".
billingpremise	Die erste Zeile der Rechnungsadresse.
billingstreet	Der Straßenname der Rechnungsadresse.
billingsuffixname	Suffix des Rechnungsnamens. Zum Beispiel "Phd", "BSc MEng".
billingtelephone	Die Telefonnummer der Rechnungsadresse.
billingtelephonetype	Dies ist ein Attribut für die Rufnummer. Die verfügbaren Optionen sind: "H" = Heim, "M" = Handy, "W" = Arbeit.
billingtown	Die Stadt der Rechnungsadresse.
credentialsonfile	Die zulässigen Werte für dieses Feld sind 0, 1 und 2. "0" - Keine Berechtigung für Daten Hinterlegt oder keine Absicht, die Berechtigungsnachweise zu einem späteren Zeitpunkt wieder zu verwenden. "1" - Transaktionsnachweise werden als für die zukünftige Verwendung verfügbar gekennzeichnet. "2" - Zahlung mit zuvor gespeicherten Anmeldeinformationen.
currencyiso3a	Die Währung im 3-Zeichen-Format. Für eine Liste der Währungen, klicken Sie hier.
customeraccountnumber	Wenn der Kontonummern-Typ "ACCOUNT" ist, die Kontonummer des Kontoinhabers. Wenn der Kontonummern-Typ "CARD" ist, die Kartennummer des Kontoinhabers (nur bei Schuldentilgungskonten in Großbritannien).
customeraccountnumbertype	Entweder "CARD" oder "ACCOUNT". (nur für Schuldentilgungskonten im Vereinigten Königreich).
customercountryiso2a	Zweistelliger Ländercode für die Kundenadresse. Eine Liste der Ländercodes finden Sie hier.
customercounty	Landkreis für die Kundenadresse.
customerdob	Geburtsdatum des Kunden im Format JJJJ-MM-TT.
customerdobday	Geburtsdatum des Kunden (der Tag).
customerdobmonth	Geburtsdatum des Kunden (der Monat).
customerdobyear	Geburtsdatum des Kunden (das Jahr).
customeremail	Die E-Mail Adresse des Kunden.
customerfirstname	Den Vornamen des Kunden.
customerip	Die IP des Kunden.
customerlastname	Der Nachname des Kunden.
customermiddlename	Der zweite Vorname des Kunden.
customerpostcode	Die Postleitzahl der Adresse des Kunden.
customerprefixname	Das Präfix des Kundennamens (z. B. "Herr", "Frau", "Dr.").
customerpremise	Die Adresse des Kunden (Hausname oder Hausnummer).
customerstreet	Der Straßenname der Adresse des Kunden.
customersuffixname	Das Suffix des Kundennamens (z. B. "Bsc").
customertelephone	Die Telefonnummer des Kunden.
customertelephonetype	Dies ist ein Attribut für die Rufnummer. Die verfügbaren Optionen sind: "H" = Heim, "M" = Handy, "W" = Arbeit.
customertown	Die Stadt der Adresse des Kunden.
dccbaseamount	DCC-spezifisch: Der Betrag, den Sie in der Währung des Händlers gutgeschrieben bekommen möchten. Dieser Betrag wird in Basiseinheiten ohne Dezimalstellen angegeben, d. h. 10,50€ wären "1050".
dccconversionrate	DCC-spezifisch: Der Umrechnungskurs, der für die Berechnung des Betrags auf der Website des Kunden Währung verwendet wird.
dccconversionratesource	DCC-spezifisch: Die Quelle des vom Anbieter DCC zurückgegebenen Umrechnungskurses.
dcccurrencyiso3a	DCC-spezifisch: Die Seite des Händlers Währung im iso3a-Format.
dccenabled	DCC-spezifisch: Gibt an, ob die Transaktion über DCC abgewickelt wurde. "1" = Ja, "0" = Nein.
dccexpirytimestamp	DCC-spezifisch: Das Ablaufdatum des CURRENCYRATE look-up. Nachfolgende Anfragen, die CURRENCYRATE als Elternteil verwenden, müssen vor diesem Datum und dieser Uhrzeit abgerechnet werden. Format: JJJJ-MM-TT HH:MM:SS.
dccmainamount	DCC-spezifisch: Der Betrag, den Sie in der Währung des Händlers gutgeschrieben bekommen möchten. Dieser Betrag wird in Haupteinheiten mit Dezimalpunkten angegeben, d.h. 10,50€ wäre "10,50".
dccmarginratepercentage	DCC-spezifisch: Der Prozentsatz, der zur Berechnung der Währung Umrechnungsgebühr verwendet wird (4 Dezimalstellen), die vom Anbieter DCC automatisch zu dem Betrag auf Währung hinzugefügt wird.
dccoffered	DCC-spezifisch: Die folgenden Werte können zurückgegeben werden: 1 - DCC Offered & Accepted Der Kunde hat das Angebot von DCC angenommen und sich für die Zahlung auf Währung seines Kartenausstellers entschieden. 2 - DCC Nicht verfügbar Der Kunde zahlt im Währung des Händlers (z.B. bei der Anfrage CURRENCYRATE ist ein Fehler aufgetreten). 3 - DCC Angeboten & abgelehnt Der Kunde hat das Angebot von DCC abgelehnt und sich für die Zahlung mit Währung des Händlers entschieden.
dccprovider	DCC-spezifisch: Der Name des Drittanbieters DCC , der den für die Zahlung verwendeten Umrechnungskurs bereitgestellt hat.
dccproviderdata	DCC-spezifisch: Eine eindeutige Zeichenfolge, die Informationen über den berechneten Umrechnungskurs enthält und direkt von bestimmten Anbietern von Umrechnungskursen zurückgegeben wird.
dccratio	DCC-spezifisch: Das Verhältnis zwischen dem Betrag auf der Website des Kunden Währung und dem Betrag auf der Website des Händlers Währung, der in der Anfrage in Haupteinheiten verarbeitet wird.
dcctype	DCC-spezifisch: Entweder "DCC" oder "CPC".
debtrepayment	Gibt an, ob die Transaktion als Schuldentilgung gekennzeichnet ist: 1 - Die Transaktion ist als Schuldentilgung gekennzeichnet. 0 - Transaktion ist nicht als Schuldentilgung gekennzeichnet.
errorcode	Ein Code, der das Ergebnis der Transaktion angibt. Der Code ist "0", wenn die Transaktion erfolgreich war.
errordata	Zusätzliche Informationen, die bei der Fehlersuche helfen.
errormessage	Eine Textbeschreibung, die das Ergebnis der Transaktion angibt. Die Meldung lautet "Ok", wenn die Transaktion erfolgreich war.
expirydate	Das auf der Karte aufgedruckte Ablaufdatum.
expirymonth	Der Monat des auf der Karte aufgedruckten Verfallsdatums.
expiryyear	Das Jahr des auf der Karte aufgedruckten Verfallsdatums.
facilitatorid	Die von Mastercard zum Zeitpunkt der Registrierung zugewiesene ID des Zahlungsdienstleisters.
facilitatorname	Der Name des Zahlungsvermittlers wurde mit Mastercard vereinbart.
iban	Überweisungsspezifisches Feld: Internationale Bankkontonummer des Kunden.
independentsalesorgid	Die von Mastercard bei der Registrierung zugewiesene ISO-ID (Independent Sales Organisation).
initiationreason	Dies sind die Werte, die wir derzeit unterstützen: "A" - Erneute Autorisierung "C" - Ungeplante Zahlung "D" - Zeitverzögerte Gebühren "S" - Erneutes Absenden "X" - Keine Anzeige (bei einer Hotelbuchung)
issuenumber	Die auf der Karte aufgedruckte Ausstellungsnummer.
issuer	Der Kartenaussteller.
issuercountryiso2a	Zweistelliger Ländercode für den Kartenaussteller. Eine Liste der Ländercodes finden Sie hier.
mainamount	Dieser Betrag wird in Haupteinheiten mit Dezimalpunkten angegeben, d. h. 10,50€ wären "10,50".
mandatereference	Eindeutige Referenz, die jede Lastschrift identifiziert.
maskedachaba	ACH-spezifisches Feld: Maskierte Transit-Routing-Nummer.
maskedachaccountnumber	ACH-spezifisches Feld: Maskierte Kontonummer.
maskedban	Überweisungsspezifisches Feld: Maskierte Bankkontonummer.
maskedcustomeraccountnumber	Wenn der Kontonummern-Typ "ACCOUNT" ist, die Kontonummer des Kontoinhabers. Wenn der Kontonummern-Typ "CARD" ist, die Kartennummer des Kontoinhabers (nur bei Schuldentilgungskonten in Großbritannien). (maskiert)
maskediban	Überweisungsspezifisches Feld: Maskierte internationale Bankkontonummer.
maskednationalid	Die Sozialversicherungsnummer des Kunden. (maskiert)
maskedpan	Dies ist die Kartennummer, die auf der Vorderseite der Karte des Kunden aufgedruckt ist. (maskiert)
merchantemail	Die E-Mail-Adresse des Händlers.
merchantname	Der Name des Händlers.
nationalid	Die Sozialversicherungsnummer des Kunden.
operatorname	Der Wert dieses Feldes enthält den Namen des Benutzers, der die Anfrage bearbeitet hat.
orderreference	Ihre eindeutige Bestellnummer, die im System von Trust Paymentsgespeichert werden kann.
pan	Dies ist die Kartennummer, die auf der Vorderseite der Karte des Kunden aufgedruckt ist.
paymenttypedescription	Die Zahlungsmethode des Kunden, zum Beispiel "VISA" oder "MASTERCARD".
paypalemail	Die E-Mail-Adresse, die der Kunde für die Anmeldung bei PayPal verwendet.
rewardid	Die Belohnung id.
securitycode	Auf der Karte aufgedruckter Sicherheitscode.
settleduedate	Der Tag, an dem Sie die Transaktion abrechnen möchten. Er muss im Format JJJJ-MM-TT angegeben werden.
settlestatus	Dieser Wert bezieht sich auf den Status, den Sie der Transaktion geben möchten.
sitereference	Einzigartige Referenz auf Ihre Website, die Sie bei der Einrichtung erhalten.
startdate	Auf der Karte aufgedrucktes Anfangsdatum.
startmonth	Monat des auf der Karte aufgedruckten Anfangsdatums.
startyear	Jahr des auf der Karte aufgedruckten Anfangsdatums.
submerchantid	Vom Zahlungsabwickler zugewiesener Wert, wenn er an der Transaktion beteiligt ist.
subscriptionbegindate	Das Datum, an dem die erste wiederkehrende Abonnementzahlung verarbeitet wird.
subscriptionfinalnumber	Die Anzahl der Abonnements, die während der Laufzeit des Abonnements insgesamt bearbeitet werden (einschließlich des ersten Autorisierung).
subscriptionfrequency	In Kombination mit dem Feld subscriptionunit wird festgelegt, wie häufig Zahlungen verarbeitet werden.
subscriptionnumber	Die Position der Transaktion innerhalb einer Reihe von Abo-Zahlungen.
subscriptiontype	Die Art der Zeichnung, wie sie von der erwerbenden Bank verlangt wird. Der Wert kann entweder "INSTALLMENT" oder "RECURRING" sein.
subscriptionunit	Die Zeiteinheit zwischen den einzelnen Abonnements. Dies kann entweder "DAY" oder "MONTH" sein.
transactionreference	Eindeutige Referenz der Transaktion, die nach der Bearbeitung einer Zahlungsanforderung verfügbar ist.
transactionstartedtimestamp	Zeitstempel, wann die Transaktion verarbeitet wurde.
walletdisplayname	Der Name der für die Transaktion verwendeten Brieftasche.
walletsource	Die Quelle der Transaktionsbörse.

Blöcke

An st.block is a reference you can include in your HTML to display grouped page elements when the page is rendered, instead of defining each element individually. Blocks are written as follows (including curly brackets): {{st.block.blockname}}

Wenn z.B. die Referenz {{st.block.paymentdetailsdiv}} auf der Seite mit den Zahlungsdetails übergeben wird, zeigt Trust Payments die Zahlungsfelder an, wenn die Seite gerendert wird.

Block Referenz

Zeichenerklärung

Blöcke, die auf einer bestimmten Seite unterstützt werden, sind mit einem grünen Häkchen gekennzeichnet:
Einige Blöcke sind auf einer bestimmten Seite erforderlich. Diese sind mit einem rosa Doppelhakensymbol gekennzeichnet:
Einige Blöcke sind nur unter bestimmten Bedingungen erforderlich. Diese sind mit einem gelben quadratischen Symbol gekennzeichnet:
Nicht alle Blöcke werden auf allen Seiten unterstützt. Nicht unterstützte Blöcke werden mit einem Kreuzsymbol angezeigt:

Block	Die Möglichkeit, auf jeder Seite
Block	Choice	Details	Locked	3-D Redirect	Antworte
{{st.block.header}} Zeigt die Kopfzeile Trust Payments an.
{{st.block.requiredjs}} Erforderlich für die Verwendung von EMV 3DS und digitalen Geldbörsen.
{{st.block.hiddendiv}} Enthält die für den korrekten Betrieb erforderlichen Sitzungsinformationen. Einer dieser Blöcke ist auf der Seite "Auswahl" erforderlich
{{st.block.smallpaymentchoicesdiv}} Zeigt kleine Logos an, damit die Kunden ihre Zahlungsmethode auswählen können. Einer dieser Blöcke ist auf der Seite "Auswahl" erforderlich
{{st.block.standardpaymentchoicesdiv}} Zeigt Logos in normaler Größe an, damit die Kunden ihre Zahlungsmethode auswählen können. Einer dieser Blöcke ist auf der Seite "Auswahl" erforderlich
{{st.block.defaultcss}} Wendet die Standard-CSS von Trust Payments an.
{{st.block.defaultjs}} Wendet den Standard Trust Payments JS an.
{{st.block.doctype}} Enthält die HTML DOCTYPE-Deklaration.
{{st.block.footer}} Zeigt die Fußzeile von Trust Payments an.
{{st.block.messagesdiv}} Zeigt Erfolgs-/Warn-/Fehlermeldungen im Browser an.
{{st.block.metatags}} Enthält Metadaten über die von Trust Payments verwendete Seite.
{{st.block.profilecss}} Stellt sicher, dass Ihr benutzerdefiniertes CSS angewendet wird.
{{st.block.profilejs}} Stellt sicher, dass Ihr benutzerdefiniertes JS angewendet wird.
{{st.block.billingresponsediv}} Zeigt die Details der Abrechnungsantwort an.
{{st.block.deliveryresponsediv}} Zeigt die Details der Zustellungsantwort an.
{{st.block.orderdetailsdiv}} Zeigt die Auftragsinformationen an.
{{st.block.billingdetailsdiv}} Zeigt ein Formular an, in dem Kunden ihre Rechnungsdaten eingeben können.
{{st.block.deliverydetailsdiv}} Zeigt ein Formular an, in dem Kunden ihre Lieferdaten eingeben können.
{{st.block.processingpaymentdiv}} Zeigt eine Lademeldung an, während die Zahlung bearbeitet wird.
{{st.block.billingdetailsdivcountystatedropdown}} Zeigt ein Formular zur Eingabe von Rechnungsdetails an. (Für US-Benutzer wird der Rechnungsbezirk als Rechnungsstaat angezeigt)
{{st.block.currencydetailsdiv}} Zeigt DCC Auswahlinformationen an.
{{st.block.deliverydetailsdivcountystatedropdown}} Zeigt ein Formular zur Eingabe von Zustellungsdetails an. (Für US-Benutzer wird der Zustellbezirk als Zustellungsstaat angezeigt)
{{st.block.paymentdetailsdiv}} Zeigt ein Formular an, in das die Kunden ihre Zahlungsdaten eingeben können.
{{st.block.requirednoticediv}} Text, der erklärt, warum * neben einem Feld bedeutet, dass es erforderlich ist.
{{st.block.lockeddiv}} Zeigt die Meldung "Zahlung gesperrt" an.
{{st.block.3dredirectdiv}} Erledigt die Umleitung zu EMV 3DS.
{{st.block.currencyresponsediv}} Zeigt die Antwortdetails von DCC an.
{{st.block.transactionresponsediv}} Zeigt die Details der Transaktionsantwort an.

Körperklasse

Trust Payments recommends specifying {{st.bodyclass.value}} in the class attribute of the body tag on all pages, to ensure shortcuts appear with the correct styling in the following situations:

Wenn Sie planen, Trust Payments CSS mit Änderungen zu verwenden.
Wenn Sie vorhaben, CSS hochzuladen, das je nach gerenderter Seite ein anderes Styling anwendet.

For example: <body class=”{{st.bodyclass.value}}”>

Bilder

Wir empfehlen, dass Sie nur auf Dateien verweisen, die auf Portal / MyST Datei-Manager gespeichert sind, und nicht auf eine externe Quelle, da der Browser des Kunden sonst möglicherweise eine Warnung anzeigt, dass die Seite nicht sicher ist.

Um auf Bilder zu verweisen, die Sie mit Portal / MyST auf Ihr Konto hochgeladen haben Datei-Manager in Ihrem HTML:

Include {{stresource.<filename>}} in your HTML:

{{stresource.companylogo.gif}}

So referenzieren Sie Bilder, die Sie mit Portal / MyST auf Ihr Konto hochgeladen haben Datei-Manager in Ihrem CSS oder JavaScript:

Use the relative path as follows:
/merchantfiles/<first 3 numbers of site ref>/<site reference>/<filename>

Beispiel:

<img src=”/merchantfiles/018/testsite018/companylogo.gif” alt=”companylogo” />

Wir empfehlen, dass Sie nur auf benutzerdefinierte Dateien verweisen, die auf Datei-Manager gespeichert sind, und nicht auf eine externe Quelle, da der Browser des Kunden sonst möglicherweise eine Warnung anzeigt, dass die Seite nicht sicher ist.

Beispiele

Im Folgenden finden Sie Beispiele für angepasste Seiten, die die ST-Blöcke verwenden. Sie können diese Vorlagen gerne verwenden, um Ihre eigenen Seiten zu erstellen, indem Sie die Block- und Feldreferenz als Leitfaden verwenden.

{{st.block.doctype}}
<html>
  <head>
    {{st.block.metatags}}
    {{st.block.defaultcss}}
    {{st.block.profilecss}}
    {{st.block.requiredjs}}
    {{st.block.defaultjs}}
    {{st.block.profilejs}}
  </head>
  <body class="{{st.bodyclass.value}} st-inputs-style st-blocks-style">
    {{st.block.header}}
    <div class="st-content">
      {{st.block.messagesdiv}}
      <h2>Order details</h2>
      {{st.block.orderdetailsdiv}}
      <h2>Payment choice</h2>
      {{st.block.standardpaymentchoicesdiv}}
    </div>
    {{st.block.footer}}
  </body>
</html>

{{st.block.doctype}}
<html>
  <head>
    {{st.block.metatags}}
    {{st.block.defaultcss}}
    {{st.block.profilecss}}
    {{st.block.requiredjs}}
    {{st.block.defaultjs}}
    {{st.block.profilejs}}
  </head>
  <body class="{{st.bodyclass.value}} st-inputs-style st-blocks-style">
    {{st.block.header}}
    <div class="st-content">
      {{st.block.messagesdiv}}
      <h2>Order details</h2>
      {{st.block.orderdetailsdiv}}
      <h2>Change payment type</h2>
      {{st.block.smallpaymentchoicesdiv}}
      <form name="paymentsdetails" id="paymentsdetails" method="post" action="details">
        {{st.block.hiddendiv}}
        <h2>Billing details</h2>
        {{st.block.billingdetailsdiv}}
        <h2>Delivery details</h2>
        {{st.block.deliverydetailsdiv}}
        <h2>Payment details</h2>
        {{st.block.paymentdetailsdiv}}
        {{st.block.requirednoticediv}}
      </form>
    </div>
    {{st.block.footer}}
  </body>
</html>

{{st.block.doctype}}
<html>
  <head>
    {{st.block.metatags}}
    {{st.block.defaultcss}}
    {{st.block.profilecss}}
    {{st.block.requiredjs}}
    {{st.block.defaultjs}}
    {{st.block.profilejs}}
  </head>
  <body class="{{st.bodyclass.value}} st-inputs-style st-blocks-style">
    {{st.block.header}}
    <div class="st-content">
      {{st.block.messagesdiv}}
      {{st.block.hiddendiv}}
      {{st.block.orderdetailsdiv}}
      <h2>3-D Secure Process</h2>
      {{st.block.3dredirectdiv}}
    </div>
    {{st.block.footer}}
  </body>
</html>

{{st.block.doctype}}
<html>
  <head>
    {{st.block.metatags}}
    {{st.block.defaultcss}}
    {{st.block.profilecss}}
    {{st.block.defaultjs}}
    {{st.block.profilejs}}
  </head>
  <body class="{{st.bodyclass.value}} st-inputs-style st-blocks-style">
    {{st.block.header}}
    <div class="st-content">
      {{st.block.messagesdiv}}
      <h2>Order details</h2>
      {{st.block.orderdetailsdiv}}
      <h2>Transaction response</h2>
      {{st.block.transactionresponsediv}}
      <h2>Billing details</h2>
      {{st.block.billingresponsediv}}
      <h2>Delivery details</h2>
      {{st.block.deliveryresponsediv}}
    </div>
    {{st.block.footer}}
  </body>
</html>

{{st.block.doctype}}
<html>
  <head>
    {{st.block.metatags}}
    {{st.block.defaultcss}}
    {{st.block.profilecss}}
    {{st.block.defaultjs}}
    {{st.block.profilejs}}
  </head>
  <body class="{{st.bodyclass.value}} st-inputs-style st-blocks-style">
    {{st.block.header}}
    <div class="st-content">
      {{st.block.messagesdiv}}
      {{st.block.lockeddiv}}
    </div>
    {{st.block.footer}}
  </body>
</html>

Nachdem Sie die notwendige Markierung geschrieben haben, können Sie die Dateien unter Datei-Manager hochladen. Achten Sie darauf, dass die Dateien unseren Namenskonventionen entsprechen.

POST aktualisieren auf Payment Pages

Nachdem Sie die erforderlichen Dateien hochgeladen haben, können diese zum Rendern Ihrer Seiten verwendet werden, indem Sie die folgende Markierung in Ihr Kassenformular einfügen, einschließlich des Namens Ihrer stprofile:

<input type=’hidden’ name=’stprofile’ value='[name of stprofile]’>

Wenn der stprofile Name im POST enthalten ist, werden die zugehörigen Dateien (falls vorhanden) für jede Trust Payments-gehostete Seite verwendet.
Wenn die stprofile in der POST nicht enthalten ist, wird während des Zahlungsvorgangs das Standard-Styling verwendet.

Die folgenden Beispiele gelten für den Start des Zahlungsvorgangs auf derSeite "Choice" und der Seite "Details":

<html>
  <head>
  </head>
  <body>
    <!--YOUR HTML-->
    <form method="POST" action="<DOMAIN>/process/payments/choice">
      <input type="hidden" name="sitereference" value="test_site12345">
      <input type="hidden" name="stprofile" value="birthday">
      <input type="hidden" name="currencyiso3a" value="USD">
      <input type="hidden" name="mainamount" value="100.00">
      <input type="hidden" name="version" value="2">
      <input type="hidden" name="orderreference" value="myorder12345">
      <input type="submit" value="Pay">
    </form>
  </body>
</html>

<html>
  <head>
  </head>
  <body>
    <!--YOUR HTML-->
    <form method="POST" action="<DOMAIN>/process/payments/details">
      <input type="hidden" name="sitereference" value="test_site12345">
      <input type="hidden" name="stprofile" value="birthday">
      <input type="hidden" name="currencyiso3a" value="USD">
      <input type="hidden" name="mainamount" value="100.00">
      <input type="hidden" name="version" value="2">
      <input type="hidden" name="paymenttypedescription" value="VISA">
      <input type="hidden" name="orderreference" value="myorder12345">
      <input type="submit" value="Pay">
    </form>
  </body>
</html>

Ersetzen Sie <DOMAIN> mit einer unterstützten Domäne. Klicken Sie hier für eine vollständige Liste.

Weitere Lektüre zu diesem Thema