Onboarding WooshPayment in 6 passi
Guida operativa al wizard onboarding di WooshPayment dopo la registrazione. Store, brand, spedizioni, pagamenti, anteprima e controllo finale in 6 step.
Onboarding WooshPayment in 6 passi
Dopo aver creato l'account su wooshpayment.com/signup, passi dalla schermata di verifica email (/verify-email-pending). Cliccato il link, atterri sul wizard onboarding: sei step lineari da Piattaforma a Controllo finale. Ogni step si sblocca dopo aver compilato il precedente — ma puoi sempre tornare indietro o saltare con il link "Salta per ora" in alto a destra.
Il tempo dipende da accessi Shopify/WooCommerce, credenziali Whop, piano e test dal carrello reale. Tieni aperte le guide delle integrazioni mentre completi il wizard.
Se hai chiuso accidentalmente il wizard, puoi riprenderlo cliccando "Continua la configurazione →" nel banner viola in cima alla dashboard. Lo stato è salvato sul server, non perdi nulla.
Passo 1 — Piattaforma
Il primo step è la scelta tra Shopify e WooCommerce:
- Shopify → crea una dev-app nel tuo Shopify Dev Dashboard → incolla
tuo-store.myshopify.com, Client ID e Client Secret → autorizza l'app sul tuo Admin. Al rientro abbiamoaccessToken+ ScriptTag installato, poi serve un test reale dal carrello sul tema live. - WooCommerce → installa il plugin ufficiale → incolla URL dello store + Consumer Key + Consumer Secret (generabili in WooCommerce → Impostazioni → Avanzate → REST API)
Guide complete: Shopify Dev Dashboard · WooCommerce plugin.
Passo 2 — Brand
Tre campi:
- URL del logo: link pubblico a PNG/SVG trasparente (es. ospitato su CDN, S3, Imgur). Max altezza 60px consigliata.
- Colore principale: hex code (es.
#3b5bdb). Applicato a bottoni CTA, link, accenti. - Colore d'accento (hover): secondo hex, di solito una variante più scura del principale.
L'anteprima a destra si aggiorna live mentre digiti. Vedi come sarà il bottone "Paga €X" del checkout reale.
Se non hai un logo ospitato online, lo puoi caricare temporaneamente su Imgur, copiare il link diretto (.png/.jpg/.svg), e incollarlo. Più avanti dalla Dashboard → Checkout → Branding puoi sostituirlo con un asset definitivo.
Passo 3 — Spedizioni
Definisci almeno una tariffa di spedizione:
- Nome tariffa: visibile al cliente (es. "Spedizione standard", "Express 24h", "Ritiro in negozio")
- Spedizione gratuita (toggle): se ON, il prezzo è ignorato e mostriamo "Gratis" al cliente
- Prezzo base (€): importo in EUR base. Se il checkout usa un mercato in SEK/GBP/USD ecc., WooshPayment converte tariffa e soglia automaticamente nella valuta del checkout.
Puoi aggiungere più tariffe col link + Aggiungi tariffa. Esempio tipico:
| Nome | Prezzo base |
|---|---|
| Spedizione standard | €4,90 |
| Express 24h | €9,90 |
| Spedizione gratuita sopra €50 | €0,00 (toggle ON, condizionata da soglia in dashboard) |
Al checkout, le tariffe vengono mostrate in ordine di prezzo crescente. Il cliente sceglie quella che preferisce.
La spedizione viene sommata al totale carrello e processata da Whop come un'unica transazione. Whop non distingue prodotto da spedizione — è tutto un unico amount. Se hai bisogno di reportistica separata, esportala dalla tua dashboard Shopify/WooCommerce.
Passo 4 — Pagamenti
Due metodi disponibili:
- Whop Payments (consigliato per carte/wallet): processa carte e wallet idonei quando il tuo account Whop, dominio, browser e device li supportano. Per essere considerato pronto non basta la API key: devono essere presenti Business ID, Product ID e webhook secret. Se manca Product ID o webhook secret, lo step mostra uno stato amber e ti rimanda a Dashboard → Integrazioni.
- Contrassegno (opzionale): checkbox da spuntare. Il cliente paga al corriere alla consegna. Molto popolare in Italia per dropshipping prodotti sotto i €50.
Puoi continuare solo se almeno un metodo è davvero utilizzabile:
- Whop pronto con Product ID e webhook secret, oppure
- Contrassegno attivo per un lancio COD-only.
Il contrassegno funziona così: il cliente conferma l'ordine sul checkout, lo store crea l'ordine in stato pending payment, il corriere riscuote i contanti, tu marchi manualmente l'ordine come pagato sul backend Shopify/WooCommerce.
Passo 5 — Anteprima
L'anteprima apre il tuo checkout su {slug}.wooshpayment.com/checkout/prev_xxx con:
- Il tuo branding (logo, colori, dominio)
- 2 prodotti finti precaricati nel carrello
- La tariffa di spedizione che hai configurato
- Pagamento disabilitato: l'anteprima serve a controllare layout, campi, spedizione e iframe, non a certificare Whop
Click su "Apri anteprima" → si apre in una nuova scheda. Verifica:
- ✅ Logo a posizione e dimensione giusta
- ✅ Colori CTA come previsto
- ✅ Spedizione visibile nello step shipping
- ✅ Step Whop con iframe carta correttamente caricato
Quando ti soddisfa il risultato, torna su questa pagina e clicca Vai al controllo finale →.
Devi cliccare almeno una volta "Apri anteprima" prima di poter procedere — è una protezione anti-launch-blind. Lo testo verde "✓ Anteprima aperta" appare solo dopo il click. Altrimenti il bottone "Vai al controllo finale →" resta disabilitato.
Passo 6 — Controllo finale
Checklist finale dei 5 prerequisiti:
- ✓ Store collegato
- ✓ Brand e colori configurati
- ✓ Almeno una tariffa di spedizione
- ✓ Metodo di pagamento pronto: Whop pronto oppure Contrassegno attivo
- ✓ Checkout live dello store testato: dal carrello reale deve essere stato creato almeno un checkout non-preview su WooshPayment
Il subdomain {slug}.wooshpayment.com viene generato automaticamente al signup e non è più uno step del wizard. Lo puoi vedere o rigenerare da Dashboard → Settings.
Quando tutti i check sono verdi, premi Segna setup verificato →. WooshPayment fa questi controlli:
- Verifica che lo store sia davvero pronto: Shopify richiede OAuth completato + dominio; WooCommerce richiede plugin/REST connessi + URL store.
- Verifica che ci sia almeno un metodo di pagamento reale: Whop pronto con Product ID e webhook secret, oppure Contrassegno attivo.
- Se non hai ancora un piano attivo, ti porta alla pagina Billing prima di chiudere l'onboarding. Finche' il piano e' Demo/FREE, il click checkout sullo store resta volutamente in passthrough nativo e non crea sessioni WooshPayment.
- Dopo il piano attivo, verifica
checkout-activation: deve esistere almeno un checkout reale non-preview creato dal click sul carrello dello store. Su Shopify richiede anche ScriptTag OK; su WooCommerce richiede che il plugin ufficiale abbia intercettato almeno una volta. - Se sei su Shopify, reinstalla/assicura lo ScriptTag sullo store e poi lo ricontrolla prima di completare.
- Se sei su WooCommerce, si aspetta che il plugin ufficiale sia gia attivo e abbia creato il primo checkout: lo stato lo vedi in Dashboard → Integrazioni e in WordPress → Impostazioni → WooshPayment.
- Salva
onboardingCompletedAt: al prossimo accesso entri direttamente in dashboard invece di ricominciare il wizard.
"Setup verificato"
Lo schermo "Setup verificato" conferma che l'onboarding è completo e che l'intercettazione checkout può funzionare sullo store:
- Shopify: lo ScriptTag è stato installato o reinstallato, ma la verifica del setup richiede ancora il test reale dal carrello live.
- WooCommerce: il checkout passa dal plugin ufficiale già installato e il wizard ha già visto almeno un checkout live intercettato.
- Il checkout preview è stato aperto almeno una volta.
- Puoi andare subito in Dashboard o alla lista ordini.
Prima delle ads completa comunque un ordine pilota pagato: verifica ordine store, email cliente/merchant, pixel/CAPI e dashboard ordine.
Nota Apple Pay: dopo il connect Whop puo' partire un tentativo best-effort di registrazione dominio, ma considera Apple Pay pronto solo quando il dominio compare nel tuo dashboard Whop. Se serve azione manuale, ricevi una mail con il dominio da aggiungere.
Due bottoni:
- Apri Dashboard → ti porta su
wooshpayment.com/dashboard(overview con grafici live) - Vai agli ordini ti porta direttamente alla lista ordini (vuota fino al primo acquisto)
Cosa fa WooshPayment dietro le quinte
Quando premi "Segna setup verificato" il backend esegue una sequenza semplice e recuperabile:
1. GET stato merchant + Whop + billing
2. Se Whop non e' pronto e manca Contrassegno → blocca la verifica finale
3. Se il piano non è attivo → redirect a Billing (Demo/FREE lascia il checkout nativo)
4. GET /api/merchant/checkout-activation → blocca se manca il primo checkout live intercettato
5. Shopify: lo ScriptTag installato dal callback OAuth viene verificato/ritentato se necessario
6. WooCommerce: il plugin ufficiale gia installato resta il punto di intercetto checkout
7. PATCH /api/merchant/config { onboardingCompletedAt }
8. Redirect alla dashboard
Se lo step finale ti manda a Billing, completa prima il piano: solo dopo il piano attivo il click checkout crea una sessione WooshPayment. Se resta bloccato sul test live, apri il carrello reale dello store, clicca Checkout, verifica che arrivi su WooshPayment, poi torna al wizard e clicca "Ricontrolla checkout live". Per problemi sul redirect usa Dashboard → Integrazioni, Dashboard → Impostazioni o la pagina WordPress → Impostazioni → WooshPayment.
Dopo la verifica del setup
Dopo il test reale, ogni click "Checkout" dal cart viene reindirizzato al tuo checkout brandizzato su {slug}.wooshpayment.com/checkout/{token}: su Shopify tramite ScriptTag validato sul tema live, su WooCommerce tramite plugin ufficiale. Da lì:
- Il cliente compila email + indirizzo
- Sceglie la spedizione tra quelle che hai configurato
- Sceglie il metodo di pagamento (carte o wallet idonei via Whop, o Contrassegno)
- Conferma → Whop processa → webhook al nostro backend → ordine creato su Shopify/WooCommerce
- Email "ordine confermato" parte da WooshPayment, brandizzata col nome dello store
- Email notifica al merchant parte da WooshPayment
Posso modificare le configurazioni dopo il lancio?
Sì, sempre. Dalla Dashboard trovi tutto in queste pagine:
- Checkout → Branding: modifica logo, colori e testi checkout
- Spedizioni: aggiungi/rimuovi/edita tariffe
- Pagamenti: attiva/disattiva contrassegno, gestisci Whop
- Mercati & Lingue: aggiungi paesi e valute (multi-currency)
- Integrazioni: completa Whop, rinnova WooCommerce o controlla plugin/pixel
- Impostazioni: riconnetti Shopify o controlla ScriptTag/dominio
- Account → Dominio custom: mappa
checkout.tuostore.comal posto del subdomain default
Problemi?
- Checkout URL non raggiungibile dopo signup → attendi 5-30 minuti per DNS/SSL, poi controlla Dashboard → Impostazioni. Se il problema è il redirect Shopify, vedi Script tag debug
- Whop non si connette (errore 401) → vedi Whop Connect troubleshooting
- Anteprima vuota o iframe Whop bianco → controlla che Whop sia collegato con Product ID valido (guida completa)
- Il click Checkout non reindirizza → Shopify: vedi Script tag debug. WooCommerce: controlla WordPress → Impostazioni → WooshPayment e Dashboard → Integrazioni.
Prossimi step
- Quickstart — overview rapida del primo ordine end-to-end
- Come funziona — architettura del checkout + flusso cliente
- Checklist pre-lancio — lista esaustiva di cose da verificare prima di mandare traffico vero
- Dominio custom — sostituisci
{slug}.wooshpayment.comconcheckout.tuostore.com