Caso d'uso del campo di pagamento

Lascia che i tuoi clienti paghino ciò che calcolano

Con il campo di pagamento, la tua calcolatrice diventa il carrello della spesa. Ovviamente non è una soluzione per grandi soluzioni di e-commerce. Ma ci sono casi in cui Calculoid è la soluzione migliore come strumento di pagamento. Considera questi esempi:

Un piccolo panificio

Una piccola panetteria di famiglia è specializzata in tipi di torta 5. Ogni prezzo della torta si differenzia per la dimensione della torta, i materiali di copertura e gli ingredienti di riempimento diversi. In questo caso, non è difficile creare una calcolatrice, inserire un paio di campi di testo per ottenere l'indirizzo del cliente e la data di consegna e quindi lasciare che i clienti calcolino il prezzo e paghino direttamente per la loro torta personalizzata. Quindi copialo e modificalo 4 più volte per adattarlo a ogni tipo di torta con la foto dell'illustrazione, inseriscilo nel tuo sito Web e la soluzione di e-commerce è pronta.

Agenzia di marketing

Immagina un'agenzia di marketing che vende il tempo degli esperti per ogni compito. Hanno un grafico, uno sviluppatore web, un copywriter, un esperto PPC e un project manager. Ogni esperto ha una tariffa oraria diversa. Inoltre, vogliono fornire uno sconto sulla quantità. In questo caso, la calcolatrice avrebbe una casella di controllo per ogni esperto e un cursore per quante ore vogliono acquistare il tempo dell'esperto. In questo modo i clienti possono facilmente calcolare l'entità del costo per il loro progetto e possono acquistarlo con un clic del pulsante.

Quindi con il campo di pagamento puoi vendere beni e servizi personalizzati. Il cliente può configurare esattamente ciò di cui ha bisogno.

Principali funzionalità di e-commerce

Calculoid offre più funzionalità per soddisfare le tue esigenze di e-commerce rispetto a un semplice pulsante di pagamento.

• I pagamenti possono essere elaborati con carte di pagamento tramite Cancello di pagamento a strisce o tramite PayPal.
• Tu e il cliente potete ottenere email personalizzata sul pagamento con tutti i valori del campo della calcolatrice.
• La lista degli ordini è disponibile con tutti i dettagli del cliente e di pagamento e Recensioni per ogni calcolatrice.
• Gli ordini possono essere anche esportato in CSV quindi puoi aprirlo in un processore di foglio elettronico come MS Excel.
• Webhooks ti consente di elaborare i dati dell'ordine in tempo reale. Invia le informazioni al tuo CRM o all'app di fatturazione.
• Stiamo anche lavorando su integrazioni facili da configurare come quella per Redmine.

La configurazione del campo di pagamento

Non devi pagare per configurare e testare il campo di pagamento. Il campo è disponibile nel piano gratuito. Semplicemente non verrà visualizzato solo per te, quando avrai effettuato l'accesso. Sarà nascosto agli altri.

1. Login o Registrati

Se non l'hai ancora fatto, iscriviti!

2. Crea una nuova calcolatrice

Vai su Calcolatrici e fai clic sul pulsante Nuova calcolatrice . Oppure, puoi modificare quella che desideri utilizzare come calcolatrice per i pagamenti. In alternativa, puoi copiare una calcolatrice esistente. Trovare una calcolatrice simile a quella che hai in mente potrebbe farti risparmiare tempo.

3. Aggiungi il campo di pagamento

Puoi trovare il campo di pagamento in questo modo:

Fai clic sul tipo di campo Pagamenti . Il nuovo campo verrà aggiunto al tuo calcolatore.

4. Modifica il campo

Dopo aver selezionato il tipo di campo che vuoi aggiungere alla tua calcolatrice, il campo verrà aggiunto ad esso, quindi vedrai questo:

Si noti che se si passa il mouse sul campo, verranno visualizzate più opzioni. Vedrai l'ID campo che è importante per la formula. C'è il pulsante di modifica che aprirà il modulo di modifica per questo campo. Poi c'è una maniglia che ti permetterà di muovere il campo. Non è rilevante ora quando abbiamo un solo campo, ma sarà utile in seguito. E anche, se sei sopra un bordo del campo, sarai in grado di ridimensionarlo.

5. Aggiungi alcuni campi per calcolare con

Ora abbiamo il campo di pagamento, ma non abbiamo ancora un valore da utilizzare. Aggiungiamo altri due campi per calcolare l'importo. Apri di nuovo la scheda " Aggiungi campo " e aggiungi un pulsante di opzione (Radio Box) , un cursore (Slider) e un campo formula . Il risultato dovrebbe essere simile a questo:

6. Cambia il layout della calcolatrice

È abbastanza sufficiente spazio per una calcolatrice così piccola. Usiamo la funzione di ridimensionamento per renderla più piccola. Ad esempio in questo modo:

7. Modifica le opzioni del campo

Modifichiamo la casella radio e il campo cursore per aggiungere alcune opzioni da scegliere per i nostri clienti. Preparerò una calcolatrice per un'app SaaS in cui ci sono piani 3 tra cui scegliere e quantità di utenti. Non mostrerò tutte le opzioni di modifica qui. Scopri le opzioni disponibili facendo clic sul pulsante Modifica come mostrato sopra.

8. Costruisci la formula

Analizziamo più da vicino come è costruita la formula. Modifichiamo il campo Formula, assegnandogli un nome (io l'ho chiamato "Prezzo finale"), il prefisso ($), il suffisso (/ mese), ingrandendo il carattere o personalizzandone lo stile a piacere. Il cuore del campo Formula e dell'intera calcolatrice è la formula stessa. Abbiamo due campi in cui il cliente può inserire le proprie informazioni. Vogliamo semplicemente moltiplicare i valori di questi campi. Ogni campo ha un ID univoco. Quindi la formula per noi è: "Scegli il piano" * "Di quanti utenti hai bisogno?" = F40981 * F40982 . Se sommiamo i valori attuali, otteniamo 20 * 5 = 100. Sembra che la calcolatrice calcoli correttamente. Ora torniamo al campo di pagamento e configuriamolo.

9. Configura il campo di pagamento

L'importante è collegare il campo di pagamento con il campo che contiene il prezzo. Questo può essere fatto facilmente modificando il campo di pagamento selezionando il campo dai campi disponibili:

Ora puoi notare che lo stesso valore numerico appare nel pulsante di pagamento. Il resto dei campi qui è facile da indovinare cosa fanno. Prendiamo il passaggio finale, la configurazione di PayPal.

10. La configurazione di PayPal

Apriamo la scheda PayPal nella configurazione del campo di pagamento:

Se si passa il mouse sui campi qui, verrà spiegato più dettagliatamente cosa significa quindi descriverò il flusso di lavoro qui. PayPal fornisce un cancello di pagamento di prova in cui è possibile verificare i pagamenti prima di andare in diretta. In questo modo sai che l'intero processo funziona e, se sei sicuro, puoi passare a Production Payment Gate e ricevere i pagamenti reali. Quindi ecco cosa dovresti fare:

1. Accedere sandbox.paypal.com e creare un cliente di prova. Dai un'occhiata al Guida ai test di PayPal se hai bisogno di maggiori informazioni
2. Assicurati di aver salvato la tua calcolatrice, perché il test di pagamento PayPal ti reindirizzerà al gate di PayPal e potresti perdere le impostazioni non salvate.
3. Ora inserisci un indirizzo email di prova nell'area email del campo Pagamento (non un campo di configurazione, il campo Email effettivo nel campo Pagamento ... questo diventa un po 'confuso. Spero di non averti ancora perso.) E fai clic sul Pulsante di pagamento. Questo ti reindirizzerà al cancello di pagamento di sandbox in cui puoi inserire l'e-mail del cliente di prova che hai creato nel passaggio 1 e procedere con il pagamento.
4. Se tutto è andato bene, passa al cancello di produzione in modo da non dimenticarlo più tardi. L'ho fatto;)

Altre possibilità

Probabilmente vorrai incorporare la calcolatrice nel tuo sito web . Non dimenticare di configurarla e di contrassegnarla come "Completata". Questo passaggio è necessario affinché l'incorporamento funzioni correttamente.

Il tuo calcolatore di pagamenti PayPal è pronto. Ma forse vorresti anche consentire ai tuoi clienti di pagare con la loro carta di credito tramite il gateway di pagamento Stripe . Gli ordini/invii possono essere visualizzati e/o scaricati . Se desideri collegare gli ordini a un altro servizio, consulta la sezione webhook . E se hai difficoltà in qualche passaggio di questo tutorial o hai domande, contattaci.

Il calcolatore di esempio

Dai un'occhiata alla calcolatrice funzionante che ho creato in questo tutorial. Se desideri copiarla e usarla come base per la tua calcolatrice, puoi trovarla qui: http://app.calculoid.com/#/calculator/7595