Skip to content

Barevné schéma

Helena Vitásková edited this page Oct 18, 2022 · 2 revisions

Na platební bráně můžete změnit barevnost levého sloupce, který obsahuje údaje o vás jako o obchodníkovi (zejména logo a kontakty), košík a celkovou částku. Pro změnu barevnosti budete potřebovat nadefinovat celkem šest barev a dávat pozor na jejich vzájemné souvislosti.

Barva #1 = Barva textu kontaktních údajů, košíku a textu tlačítka zrušení transakce

Barva #2 = Barva pozadí sloupce / Barva košíku a kontaktních údajů obchodníka na mobilu

Barva #3 = Barva linky oddělující položky košíku

Barva #4 = Barva pozadí celkové částky

Barva #5 = Barva šipky rozbalující košík v mobilní verzi

Barva #6 = Barva pozadí tlačítka zrušení transakce

Dejte si, prosím, pozor na tyto souvislosti:

  1. Barevné schéma vždy testujte jak na počítači, tak na smartphonu. Řešení responsivity přebarvuje prvky v obou rozhraních jinak (viz např. následující bod 2).

  2. Barvy #4 a #5 nesmí být stejné. V opačném případě nebude vidět tlačítko rozbalení košíku na mobilu. Barvu #5 doporučujeme nastavit stejnou jako barvu #6 (protože pozadí částky je vždy tmavé a barva #6 by měla být ze všech použitých barev nejsvětlejší).

  3. Text celkové částky je vždy bílý. Volbou barvy pozadí (barva #4) zajistěte čitelnost textu.

  4. Barva #6 vyplňuje tlačítko zrušení transakce, jehož text je barvou #1. Kombinací barev zajistěte čitelnost textu.

  5. Barva textu #1 nastavuje i barvu písma v košíku, jehož pozadí je na desktopu vždy bílé. Současně na mobilu odpovídá barva pozadí košíku barvě #2.

  6. Kombinací barvy textu (#1) a pozadí (#2) zajistěte čitelnost textu. Současně nevolte barvu textu #1 příliš světlou a barvu pozadí #2 příliš tmavou tak, aby byl text v košíku čitelný jako na neměnném bílém pozadí na desktopu, tak na barevném pozadí (#2) na mobilu.

  7. Kombinací barvy pozadí (#2) a tlačítka zrušení transakce (#6) zajistěte zřetelnou viditelnost tlačítka pro zrušení transakce.

Postup nahrání a aktivace barevného schématu v testovacím prostředí

Doporučujeme vyzkoušet kombinaci barev v testovacím prostředí (volaném na https://iapi.iplatebnibrana.csob.cz) a odladit si jeho vzhled před nasazením do produkčního systému. Schémata na testovacím prostředí nepodléhají schválení bankou, můžete si proto rychle otestovat různé varianty a odladit kombinaci. Znovu připomínáme nutnost otestovat schéma jak na desktopu, tak na smartphonu.

  1. Přihlaste se do systému ČSOB POS Merchant - Testovací prostředí - sekce platební brány, z ikon akcí platební brány (vpravo) vyberte "barevná schémata".
  2. Nastavte všech šest barev schématu a uložte schéma. Systém automaticky schémata pojmenovává verzemi.
  3. V seznamu schémat se zobrazí nově nadefinované schéma, včetně náhledu barev.
  4. Aktivujte zobrazení schématu.
  5. Schéma se začne na platební bráně zobrazovat nejpozději do 5ti minut od aktivace v kroku 4.

Postup nahrání a aktivace barevného schématu v produkčním prostředí

  1. Přihlaste se do systému ČSOB POS Merchant - sekce platební brány, z ikon akcí platební brány (vpravo) vyberte "barevná schémata".
  2. Nastavte všech šest barev schématu a uložte schéma. Doporučujeme kopírovat kódy barev s nastaveným testovacím prostředím. Systém automaticky schémata pojmenovává verzemi.
  3. V seznamu schémat se zobrazí nově nadefinované schéma, včetně náhledu barev.
  4. Vyčkejte na schválení barevného schématu bankou.
  5. Aktivujte zobrazení schématu.
  6. Schéma se začne na platební bráně zobrazovat nejpozději do 5ti minut od aktivace v kroku 5.

Schválení barevného schématu

Barevné schéma podléhá schválení banky. Zamítnuta budou zejména ta schémata, která nezajišťují dostatečnou čitelnost textů celkové částky, tlačítka zrušení transakce a kontaktních údajů obchodníka.

Multibranding - podpora více barevných schémat pro jednoho obchodníka

Prodáváte-li pod více značkami (např. jedna pro český a druhá pro evropský e-shop) a současně prodejcem je stále jedna firma (jedno IČO), můžete použít multibrandovou funkci brány. Od verze API 1.6 je možné ve volání payment/init specifikovat, jaké se má použít barevné schéma (parametr colorSchemeVersion). Stejně tak můžete řídit i zobrazované logo (parametr logoVersion). Obchodník tak může mít schválených několik log a barevných schémat, přičemž standardně (při volání bez udání požadované verze loga nebo barevného schématu) se použije vždy to, které je v systému ČSOB POS Merchant označeno jako "aktivní". Je-li ve volání transakce požadováno logo nebo barevné schéma, které je ve stavu "schváleno", bude zobrazeno na bráně klientovi. Je-li voláno logo nebo barevné schéma, které není schváleno, bude klientovi na bráně zobrazeno logo nebo barevné schéma, které je "aktivní".

Clone this wiki locally