Zu Content springen
Deutsch
Ga naar PAY.NL
  • Es gibt keine Vorschläge, da das Suchfeld leer ist.

Alliance Partners - Whitelabel konfiguration Alliantie in PAY.

Anleitung zur Anpassung des Look & Feel

Mit der Whitelabel-Funktion von PAY. können Sie die Umgebung vollständig an das Corporate Design Ihres Unternehmens anpassen. Dadurch erkennen Merchants und Benutzer Ihre Marke sofort innerhalb der PAY.-Umgebung, in Kommunikationsmitteln und in der Dokumentation wieder.

Diese Anleitung beschreibt alle verfügbaren Einstellungen, empfohlenen Abmessungen sowie die Verwendung der verschiedenen Farb- und Branding-Optionen.

Wo finde ich diese Einstellungen?

Navigation

  1. Melden Sie sich bei Ihrem PAY.-Konto an.
  2. Navigieren Sie im Hauptmenü zu Einstellungen.
  3. Klicken Sie anschließend im Untermenü auf Whitelabel.

Über diese Seite können Sie Bilder, Farben, Schriftarten und Social-Media-Einstellungen konfigurieren, damit die Umgebung vollständig Ihrer Corporate Identity entspricht.

Hinweis: Die Whitelabel-Funktion ist nur für Konten verfügbar, bei denen diese Funktion aktiviert wurde.

Allgemeine Informationen

Die Whitelabel-Einstellungen sind in drei Kategorien unterteilt:

  • Bilder & Branding
  • Farben
  • Social Media & Footer

Nachdem die Änderungen gespeichert wurden, werden diese innerhalb der Whitelabel-Umgebung angewendet.

Tipp: Stellen Sie sicher, dass Logos, Farben und Schriftarten den offiziellen Corporate-Design-Richtlinien Ihres Unternehmens entsprechen.

1. Bilder & Branding Bild (Logo)

Zweck

Dieses Logo wird in der Kommunikation mit Dritten verwendet.

Spezifikationen

  • Dateityp: JPG oder PNG
  • Empfohlene Größe: 140 × 140 px
  • Empfehlung: Verwenden Sie ausschließlich das Logo-Symbol ohne zusätzlichen Text.

Verwendung

Dieses Logo wird in verschiedenen Kommunikationsmitteln wie E-Mails und anderen kundenorientierten Mitteilungen angezeigt.

APP Header Image

Zweck

Headerbild zur Verwendung in der PAY. App.

Spezifikationen

  • Dateityp: JPG oder PNG
  • Abmessungen: 640 × 430 px

Verwendung

Ideal, um das eigene Corporate Design innerhalb der mobilen App-Umgebung umzusetzen.

Info Document

Zweck

Hintergrundbild für Informationsdokumente.

Spezifikationen

  • Bevorzugter Dateityp: JPG
  • Format: A4 Hochformat
  • Breite: 2480 px
  • Höhe: 3508 px
  • Maximale Dateigröße: 500 KB

Verwendung

Wird als Hintergrund für Informationsdokumente genutzt, die von der Plattform generiert werden.

Data Document

Zweck

Hintergrundbild für Exporte, Berichte und Datendokumente.

Spezifikationen

  • Bevorzugter Dateityp: JPG
  • Format: A4 Querformat
  • Breite: 3508 px
  • Höhe: 2480 px
  • Maximale Dateigröße: 500 KB

Verwendung

Wird als Hintergrund für Berichte, Exporte und Datendokumente verwendet.

Großes Admin-Logo

Zweck

Großes Logo oben links in der Verwaltungsumgebung.

Spezifikationen

  • Dateityp: PNG
  • Maximale Höhe: 48 px
  • Maximale Breite: 164 px
  • Maximale Dateigröße: 10 KB

Empfehlung

Verwenden Sie:

  • Weiße Schrift auf transparentem Hintergrund
  • Oder ein Logo mit weißem Hintergrund bzw. weißem Rand

Dieses Logo wird angezeigt, wenn ausreichend Platz verfügbar ist.

Kleines Admin-Logo

Zweck

Kompaktes Logo für kleinere Bildschirme oder Situationen, in denen nicht genügend Platz für das große Logo vorhanden ist.

Spezifikationen

  • Dateityp: PNG
  • Maximale Höhe: 24 px
  • Maximale Breite: 125 px
  • Maximale Dateigröße: 10 KB

Empfehlung

Verwenden Sie:

  • Weiße Schrift auf transparentem Hintergrund
  • Oder ein Logo mit weißem Hintergrund bzw. weißem Rand

Logo Mail Footer

Zweck

Logo, das im Footer von E-Mails angezeigt wird.

Spezifikationen

  • Verwenden Sie vorzugsweise eine transparente PNG-Datei.
  • Achten Sie auf eine gute Lesbarkeit auf hellen und dunklen Hintergründen.

Verwendung

Wird in ausgehenden E-Mails aus der PAY.-Umgebung angezeigt.

Favicon

Zweck

Das Symbol, das in Browser-Tabs angezeigt wird.

Unterstützte Formate

  • PNG
  • ICO
  • SVG
  • GIF

Empfehlung

  • Verwenden Sie ein quadratisches Logo.
  • Empfohlene Größe: 32 × 32 oder 64 × 64 Pixel.
  • Halten Sie das Design einfach, damit es auch in kleiner Darstellung erkennbar bleibt.

Webfont Regular

Zweck

Ersetzt die Standardschriftarten für H1-, H2- und H3-Überschriften innerhalb von my.pay.nl.

Spezifikationen

  • Dateityp: WOFF2
  • Es werden ausschließlich Schriftarten mit Latin Character Set unterstützt.

Verwendung

Verwenden Sie die reguläre Hausschrift Ihres Unternehmens.

Webfont Bold

Zweck

Fettgedruckte Variante der Webschrift für Überschriften.

Spezifikationen

  • Dateityp: WOFF2
  • Es werden ausschließlich Schriftarten mit Latin Character Set unterstützt.

Verwendung

Verwenden Sie die fettgedruckte Variante Ihrer Hausschrift.

2. Farben

Alle Farbfelder erwarten einen hexadezimalen Farbcode ohne das Zeichen #.

Beispiel:

003972

Ergebnis:

 

#003972

 

Primärfarbe

Wird verwendet für:

  • Buttons
  • Ausgewählte Menüpunkte
  • Verschiedene Akzente
  • Interaktive Elemente

"Dies ist die Primärfarbe, die in PAY. beispielsweise für Buttons, ausgewählte Menüpunkte und Hover-Effekte verwendet wird."

Primärfarbe 2

Farbe des Hauptmenüs innerhalb von PAY.

Akzentfarbe

Wird verwendet, um visuelle Akzente innerhalb der Benutzeroberfläche hervorzuheben.

Sekundäres Navigationsmenü

Hintergrundfarbe des sekundären Navigationsmenüs.

Hover-Farbe

Wird verwendet, wenn Benutzer:

  • Mit der Maus über Buttons fahren
  • Mit der Maus über Tabellenzeilen fahren
  • Mit der Maus über interaktive Elemente fahren

Sekundärfarbe

Zusätzliche Farbe für sekundäre Oberflächenelemente.

Einstellungen Hauptmenü

Schriftfarbe Hauptmenü

Textfarbe des Hauptmenüs.

Farbe Hauptmenü

Hintergrundfarbe des Hauptmenüs.

Schriftfarbe aktives Hauptmenüelement

Textfarbe des ausgewählten Hauptmenüeintrags.

Farbe aktives Hauptmenüelement

Hintergrundfarbe des aktiven Hauptmenüeintrags.

Schriftfarbe Hover Hauptmenü

Textfarbe beim Überfahren eines Hauptmenüeintrags mit der Maus.

Hover-Farbe Hauptmenü

Hintergrundfarbe beim Überfahren eines Hauptmenüeintrags mit der Maus.

Einstellungen Untermenü

Schriftfarbe Untermenü

Textfarbe der Untermenüeinträge.

Farbe Untermenü

Hintergrundfarbe des Untermenüs.

Farbe aktives Untermenüelement

Hintergrundfarbe des aktiven Untermenüeintrags.

Schriftfarbe aktives Untermenü

Textfarbe des aktiven Untermenüeintrags.

Schriftfarbe Hover Untermenü

Textfarbe beim Überfahren von Untermenüeinträgen.

Hover-Farbe Untermenü

Farbe der 2-Pixel-Indikatorlinie, die beim Überfahren eines Untermenüeintrags angezeigt wird.

Overlay-Icons

Zweck

Farbe für:

  • Filter-Buttons
  • Overlay-Icons
  • Upsell-Buttons

Wert

Hier wird kein Hex-Farbcode eingegeben, sondern ein CSS-Filter.

Zum Beispiel:

https://isotropic.co/tool/hex-color-to-css-filter/

CSS 
invert(24%) sepia(94%) saturate(1317%) hue-rotate(189deg) brightness(93%) contrast(101%)

"Dies ist die Farbe, die in PAY. für Filter-Buttons und Icons in Upsell-Buttons verwendet wird."


3. Social-Media-Einstellungen

Diese Links werden im Footer der Whitelabel-Umgebung angezeigt.

Facebook URL

Beispiel: https://www.facebook.com/ihrunternehmen

LinkedIn URL

Beispiel: https://www.linkedin.com/company/ihrunternehmen

YouTube URL

Beispiel: https://www.youtube.com/@ihrunternehmen

Vimeo URL

Beispiel: https://vimeo.com/ihrunternehmen

Instagram URL

Beispiel: https://www.instagram.com/ihrunternehmen

Footer anzeigen Footer anzeigen

Wenn diese Option aktiviert ist, wird der Whitelabel-Footer angezeigt.

Der Footer kann unter anderem enthalten:

  • Social-Media-Links
  • Supportinformationen
  • Branding-Elemente

Best Practices

✅ Verwenden Sie Logos mit transparentem Hintergrund.
✅ Testen Sie Farbkombinationen hinsichtlich Kontrast und Lesbarkeit.
✅ Verwenden Sie dieselben Farben wie auf Ihrer Website und in anderen Kommunikationsmitteln.
✅ Halten Sie Favicons und Logos einfach und wiedererkennbar.
✅ Optimieren Sie Bilder für schnelle Ladezeiten.
✅ Testen Sie die Umgebung sowohl auf Desktop- als auch auf Mobilgeräten.
✅ Überprüfen Sie nach Farbänderungen stets die Lesbarkeit von Menüs, Buttons und Links.

Empfohlene Branding-Konfiguration

  • Hintergrund Hauptmenü: Dunkle Unternehmensfarbe
  • Text Hauptmenü: Weiß
  • Primärfarbe: Marken-Akzentfarbe
  • Hover-Farbe: 10 % bis 15 % heller als die Primärfarbe
  • Favicon: Logo-Symbol
  • Admin-Logo: Weiße Version des Logos
  • Mail-Footer-Logo: Transparente PNG-Datei

Mit diesen Einstellungen schaffen Sie eine konsistente und professionelle Whitelabel-Erfahrung, die vollständig zur Markenidentität Ihres Unternehmens passt und die Wiedererkennbarkeit Ihrer Marke innerhalb der PAY.-Umgebung stärkt.