Gli acquirenti di oggi valutano le opzioni in pochi secondi: alcuni scrutano i prezzi, altri confrontano le caratteristiche e molti discutono di piani mensili o annuali. In questo ambiente decisionale diviso in due secondi, il design della vostra tabella dei prezzi diventa il fattore decisivo per le conversioni.
Se gestite un'attività basata su servizi o abbonamenti, la vostra tabella dei prezzi deve fare di più che elencare le opzioni per convertire i visitatori in clienti paganti. Deve guidare l'attenzione, supportare i confronti e far percepire il piano migliore come la scelta più ovvia.
Una tabella dei prezzi ben progettata con un interruttore mensile/annuale trasforma una tabella dei prezzi standard in qualcosa di molto più dinamico e incentrato sull'utente. Non si limita a visualizzare le opzioni, ma guida attivamente l'occhio, enfatizza il risparmio ed elimina l'attrito del confronto.
In questa guida, imparerete a creare in WordPress una selezione pulita di prezzi mensili e annuali, utilizzando un formato tabellare che risulti perfetto su qualsiasi dispositivo.
Tariffazione mensile/annuale Toggle
Base |
Pro |
Enterprise |
|---|---|---|
Per gli individui |
Per le startup |
Per le grandi aziende |
$99/mese |
$199/mese |
$299/mese |
|
|
|
Base |
Pro |
Enterprise |
|---|---|---|
Per gli individui |
Per le startup |
Per le grandi aziende |
$990/anno |
$1990/anno |
$2990/anno |
|
|
|
Come aggiungere un indicatore di prezzo mensile/annuale in WordPress
Ora che sapete come un toggle di prezzo aiuta a semplificare i confronti e a mettere in evidenza il valore, vediamo i passaggi per crearne uno utilizzando il plugin Tableberg.
Passo 1: installare e attivare l'Tableberg
Accedere alla dashboard di WordPress, andare su Plugin → Aggiungi nuovo, cercare Tableberg, quindi fare clic su Installa ora, seguito da Attiva. Una volta attivato, troverete due nuovi blocchi nell'editor: Tableberg e Toggle for Tableberg.
Passo 2: aggiungere il selettore per il blocco Tableberg
Aprire il post o la pagina in cui si desidera inserire la tabella dei prezzi. Fare clic sull'icona più, cercare Toggle for Tableberg e inserire il blocco. Per impostazione predefinita, il blocco inizia con tre schede. Passare il mouse su una scheda per rimuoverla o fare clic sul segno più per aggiungerne altre. Per questa configurazione, manteniamo solo due schede: una per "Mensile" e una per "Annuale".
Passo 3: Configurare le impostazioni della scheda
Con il blocco selezionato, utilizzare il pannello delle impostazioni sulla destra per regolare le opzioni generali e di stile.
Nella scheda Generale, rinominare ogni scheda, scegliere quella attiva per impostazione predefinita e allineare le schede come necessario.
In Stile, è possibile regolare i colori per le schede attive e inattive, impostare la spaziatura sotto la levetta e modificare il raggio del bordo per arrotondare gli angoli se si desidera un aspetto più morbido.
Passo 4: Aggiungere tabelle all'interno di ogni scheda
Fare clic sulla prima scheda e creare la tabella. Questa conterrà la tabella dei prezzi mensili. Ripetere la stessa operazione nella seconda scheda e aggiungere la versione annuale. La struttura di entrambe le tabelle deve rimanere la stessa, cambiando solo i prezzi e le relative etichette.
Passo 5: personalizzare le tabelle
Aggiungete i nomi dei piani, i tag del pubblico, i prezzi, le caratteristiche e i pulsanti di invito all'azione all'interno di ogni colonna. Utilizzate blocchi di paragrafi, elenchi e pulsanti all'interno delle celle della tabella.
Quindi aprire le impostazioni generali per impostare l'intestazione e il piè di pagina e, se necessario, regolare funzioni come l'intestazione appiccicosa, l'ordinamento e la ricerca. Infine, utilizzare la scheda Stile per regolare con precisione la spaziatura, i colori di sfondo, i bordi e l'allineamento per ottenere un aspetto pulito e coerente in entrambe le tabelle.
Fase 6: salvataggio, anteprima e pubblicazione
Non dimenticate di salvare il vostro lavoro. Quindi, utilizzare l'opzione di anteprima per verificare l'aspetto del toggle sia su desktop che su mobile. Assicuratevi che il cambio di scheda sia fluido e che ogni versione della tabella sia chiara. Una volta soddisfatti, premere Pubblica per renderlo attivo.
Pensieri finali
L'opzione di selezione dei prezzi mensili/annuali non è solo un trucco di design. È un modo pratico per presentare opzioni di fatturazione flessibili senza appesantire il layout. Con Tableberg, non avete bisogno di plugin aggiuntivi o di codice personalizzato per farlo bene. È possibile creare una tabella dei prezzi reattiva e ben strutturata che aiuta i visitatori a confrontare i piani in modo chiaro e a scegliere quello più adatto a loro.
Prendete il tempo necessario per impostare con cura i toggle e otterrete una pagina più pulita e un'esperienza decisionale più fluida per i vostri utenti.
