L'estensione Add To Cart Popup aggiunge una funzionalità popup a Easy Digital Downloads. Quando è attiva, dopo che un cliente fa clic su un pulsante “Aggiungi al carrello”, appare un piccolo popup modale che offre loro la possibilità di andare direttamente alla pagina di checkout o di continuare lo shopping. Ecco un esempio che utilizza lo stile predefinito del tema TwentyFifteen.
Ecco come configurare il popup.
Istruzioni di configurazione per il popup Aggiungi al carrello
- Una volta installato, individua le impostazioni di questa estensione tramite admin di WordPress → Download → Impostazioni → Estensioni → Aggiungi al carrello Popup
- Quando attivi il plugin, il popup sarà disabilitato per impostazione predefinita. Questo ti dà la possibilità di regolare le impostazioni prima di attivarlo sul tuo sito. Il popup può quindi essere abilitato selezionando la casella di controllo Abilita Popup.
Nota: Quando si utilizza la funzione del pulsante "Acquista ora" o l'estensione Download gratuiti, il popup verrà automaticamente disabilitato per non interferire con i reindirizzamenti dei gateway di pagamento o con i popup di terze parti.
Personalizzazione
Aspetto generale
Anteprima Popup: Questo pulsante ti consente di attivare un popup mentre sei nella pagina delle impostazioni per visualizzare le modifiche prima di salvarle. Puoi anche utilizzare il link “Anteprima Popup” nella barra di amministrazione. L'abbiamo aggiunto in modo che tu non debba scorrere continuamente fino in cima alla pagina delle impostazioni per visualizzare l'anteprima del popup.
Tieni presente che l'anteprima potrebbe non essere del tutto accurata quando si utilizzano gli shortcode, poiché alcuni stili potrebbero non essere caricati nell'amministratore di WordPress. Si consiglia di visualizzare l'anteprima sul front-end del tuo sito una volta terminato per confermare l'aspetto del popup.
Testo del Popup: Qui puoi impostare il testo mostrato nel popup. Se il plugin rileva "%s" (senza virgolette) ovunque nel testo di questa opzione, verrà sostituito con il nome del download che l'utente ha aggiunto al carrello. Hai anche la possibilità di aggiungere file multimediali (come immagini), embed e persino shortcode all'interno del popup.
Testo Plurale del Popup: Simile al Testo del Popup, questo testo viene mostrato nel popup quando più articoli sono stati aggiunti al carrello contemporaneamente. Questo è tipico quando si utilizzano opzioni di prezzo variabili che consentono di aggiungere più opzioni contemporaneamente. Ancora una volta, hai anche la possibilità di aggiungere file multimediali (come immagini), embed e persino shortcode all'interno del popup.
Ricorda che puoi espandere la barra degli strumenti dell'editor facendo clic sul pulsante più a destra dell'editor!
Dimensione Font: Questo ti consente di modificare la dimensione complessiva del font utilizzato nel popup. Vengono accettati vari formati CSS.
- Le dimensioni in pixel sono dimensioni fisse assolute. Esempio: 12px
- Le dimensioni in percentuale sono relative alla dimensione del font predefinita del tema. Esempio: 120% (20% più grande della dimensione del font del tema).
- I valori "em" sono simili alle percentuali, dove 1em è la dimensione del font predefinita. Esempio: 2em (due volte più grande del predefinito).
Colore del testo: Il colore del testo del popup. Per impostare il colore, fai clic sulla casella di colore per visualizzare il selettore di colori.
Colore di sfondo: Il colore dello sfondo del popup. Per impostare il colore, fai clic sulla casella di colore per visualizzare il selettore di colori.
Ecco un esempio con il colore del testo impostato su giallo e il colore di sfondo impostato su blu:
Bordo: Questa opzione ti consente di definire lo stile del bordo del popup, che appare attorno al bordo della finestra del popup. Le tre opzioni sono rispettivamente la larghezza (o spessore), lo stile e il colore.
Raggio del bordo: Il raggio degli angoli del bordo. Maggiore è questo valore, più arrotondati saranno gli angoli. Questo si applica anche se hai impostato il bordo come non visibile (larghezza zero, stile "nessuno" o colore trasparente).
Ombra: Questa opzione ti consente di aggiungere un'ombra al popup impostando l'entità dell'ombra (dimensione e spessore) e il colore dell'ombra. L'esempio seguente aggiunge un'ombra verde scuro con un'entità di 15:
Colore sovrapposizione: Il termine sovrapposizione si riferisce al colore che copre il resto della pagina quando viene visualizzato il popup. Puoi cambiarne il colore facendo clic sulla casella di colore per visualizzare il selettore di colori, che include anche un'opzione di trasparenza. L'esempio seguente cambia la sovrapposizione in un arancione chiaro semitrasparente:
Dimensioni del popup
Dimensioni: Qui puoi controllare le dimensioni del popup. Sono accettati vari formati CSS, inclusi pixel e percentuali.
- Le dimensioni in pixel sono dimensioni fisse. Esempio: 500px (500 pixel sullo schermo dell'utente)
- Le dimensioni in percentuale sono relative alle dimensioni della finestra del browser dell'utente. Esempio: 60% (60% dello schermo dell'utente)
Se la larghezza o l'altezza vengono lasciate vuote, il popup le calcolerà automaticamente per adattarsi al contenuto.
L'esempio seguente mostra un popup con una larghezza impostata su 500px e l'altezza lasciata vuota per essere calcolata automaticamente.
Spaziatura: La spaziatura si riferisce allo spazio tra il bordo del popup e il suo contenuto, come mostrato nell'immagine seguente:
L'area in verde è ciò a cui ci si riferisce come "spaziatura".
Stili dei pulsanti
Bordo del pulsante: Il bordo per i pulsanti mostrati nel popup, simile all'opzione Bordo precedente. Puoi impostare rispettivamente lo spessore, lo stile e il colore del bordo.
Raggio degli angoli: Il raggio degli angoli del pulsante. Maggiore è questo valore, più arrotondati saranno gli angoli. Questo si applica anche se il bordo del pulsante non è visibile (larghezza impostata su 0, stile "nessuno" o colore trasparente).
Ad esempio: un bordo "punteggiato" blu con una larghezza di 5px e un raggio degli angoli di 3px:
Spaziatura del pulsante: Simile all'opzione di Spaziatura del popup, questa consente di regolare lo spazio all'interno del pulsante. Ad esempio, quanto segue utilizza una spaziatura di 6px in alto e in basso e 30px a sinistra e a destra.
Direzione pulsanti: Puoi impostare i pulsanti in modo che vengano visualizzati uno accanto all'altro orizzontalmente, oppure impilati uno sopra l'altro verticalmente. L'impostazione predefinita è orizzontale.
Allineamento pulsanti: Puoi scegliere tra l'allineamento a sinistra, al centro e a destra. La scelta di sinistra o destra spingerà i pulsanti verso il rispettivo lato, mentre la scelta di centro posizionerà i pulsanti al centro del popup.
Ordine pulsanti: Questa opzione ti permette di scegliere quale pulsante viene visualizzato per primo. Se la Direzione pulsanti è impostata su orizzontale, questa opzione determinerà quale pulsante viene mostrato a sinistra. Se la Direzione pulsanti è impostata su verticale, questa opzione determinerà quale pulsante viene mostrato in alto.
Pulsante Checkout/Continua
Le prossime due sezioni consistono in opzioni identiche che ti permettono di modificare l'aspetto individuale di entrambi i pulsanti.
Abilitato: Scegli se mostrare o nascondere il pulsante.
Testo: Puoi personalizzare il testo di ogni pulsante come preferisci.
Colore testo: Il colore del testo all'interno del pulsante.
Colore testo al passaggio del mouse: Il colore del testo all'interno del pulsante quando il cursore del mouse si trova sopra il pulsante.
Colore sfondo: Il colore di sfondo del pulsante.
Colore sfondo al passaggio del mouse: Il colore di sfondo del pulsante quando il cursore del mouse si trova sopra il pulsante.
L'esempio seguente utilizza pulsanti bianchi con testo nero che diventano pulsanti rossi con testo bianco quando il cursore del mouse si trova sopra il pulsante.
Il Selettore Colore, Spiegato
