WWooshPayment docs
Checkout

Branding del checkout

Personalizza logo, colori, trust badges e copy del tuo checkout WooshPayment per rispecchiare il tuo brand.

3 min di lettura

Il checkout brandizzato è uno dei vantaggi che scopri arrivando su WooshPayment. La maggior parte dei merchant ci arriva perché Stripe o Shopify Payments li hanno bloccati e cercano di rimettere online il loro store via Whop; una volta connessi scoprono anche un checkout migliore — con dominio, logo, colori tuoi. Configurarlo bene alza il tasso di conversione del 10-25% rispetto a un checkout generico.

Dove si configura

Tutto in Dashboard → Checkout (non in una pagina "Branding" separata).

Cosa puoi personalizzare oggi

ElementoNote
Logo URLInserisci URL pubblico del logo (PNG/SVG, max 200KB consigliato)
Colore brand primarioEsa, es. #FF6B35. Applicato a bottoni e accenti
Colore accent secondarioEsa per dettagli ed elementi attivi
Trust badgesFino a 4 badge: icona (truck/shield/refresh/star) + titolo + descrizione
RecensioniSezione laterale con titolo + lista recensioni nome / testo / rating
Custom fieldsMessaggio regalo, data di consegna preferita
Tasse / IVALabel IVA, rate default, rate per paese
CSS customEditor libero — vedi CSS custom

Font, favicon e A/B test del copy CTA non sono ancora esposti in UI. Roadmap.

Setup base

  1. Dashboard → Checkout
  2. Compila:
    • Logo URL: link diretto a un file PNG o SVG ospitato (consigliato: usa il CDN del tuo store o un servizio come Cloudinary)
    • Colore brand: esa, es. #0ea5e9 — applicato a bottoni primari, focus input, indicatori "selezionato"
    • Colore accent: esa, secondario — usato per dettagli ed elementi attivi
  3. Aggiungi trust badges (opzionale): max 4, ogni badge ha icona + titolo + descrizione (es. "Spedizione gratuita / oltre €50")
  4. Salva → l'anteprima a destra si aggiorna live

Best practice colore

  • Contrasto: il colore deve avere contrasto ≥ 4,5:1 vs bianco (WCAG AA). Verifica su contrastchecker.com
  • Saturazione: colori troppo saturi (neon) stancano l'occhio. Usa la versione "brand" del tuo logo, non quella "accent"
  • Test reale: apri il checkout da iPhone vero, non solo dall'anteprima dashboard

Logo best practice

  • Formato: PNG sfondo trasparente, o SVG (più leggero)
  • Dimensioni: 200×200px minimo, max 500×500px
  • Peso: < 200KB (servito a ogni cliente, pesa sulla performance)
  • Layout: quadrato o orizzontale corto. Logo verticali alti vengono compressi nel header

Trust badges

Esempi che funzionano:

  • Truck: "Spedizione gratuita oltre €50"
  • Shield: "Pagamento sicuro · 256-bit SSL"
  • Refresh: "Reso gratuito entro 30 giorni"
  • Star: "4,8/5 da oltre 2.000 clienti"

Tieni le frasi sotto i 40 caratteri o vengono troncate sul mobile.

Recensioni

Sezione laterale del checkout con il titolo che scegli (default "Cosa dicono i nostri clienti") + lista di item con nome / testo / rating 1-5. Utile soprattutto sul desktop. Su mobile la sezione scivola sotto al riepilogo.

Custom fields al checkout

Due opzioni built-in:

  • Messaggio regalo (campo testuale opzionale)
  • Data di consegna preferita (date picker con min days configurabile)

Attiva/disattiva ciascuno dalla pagina Checkout.

Mobile vs Desktop

Il checkout è mobile-first. Ogni cambio brand testalo subito su iPhone (anteprima desktop in dashboard, ma confermane sempre l'aspetto reale aprendo il link checkout da telefono).

Prossimi step