Recensito da Costruisci le tue pagine prodotto in Elementor, e tutto sembra a posto. Poi noti che il pulsante della wishlist di Elementor è sparito. Non spostato. Scomparso.
Le impostazioni del tuo plugin promettono un pulsante. La tua pagina prodotto non mostra nulla. Non c'è nemmeno un errore da inseguire.
Quel silenzio ti costa. Un pulsante della wishlist che nessuno può vedere è un salvataggio che non avviene mai. E un salvataggio che non avviene mai è un acquirente che non puoi far tornare.
SaveTo Wishlist spedisce due integrazioni Elementor che colmano il divario. Esamineremo come configurare entrambe, scegliere quella giusta e cosa fare con i salvataggi in seguito.
Salta a:
- Perché il pulsante della wishlist scompare dalle pagine prodotto di Elementor
- Cosa fanno effettivamente le due integrazioni di Elementor
- Cosa ti serve prima di iniziare
- Come aggiungere il pulsante della wishlist con il widget Elementor
- Come mostrare il pulsante della wishlist in Loop Grid e Loop Carousel
- Dove mettere il pulsante in modo che gli acquirenti lo usino davvero
- Cinque modi per mettere a frutto i salvataggi della wishlist di Elementor
- Problemi della wishlist di Elementor e come risolverli
- Domande frequenti: pulsante wishlist di Elementor
- Conclusione
Perché il pulsante della wishlist scompare dalle pagine prodotto di Elementor
Il pulsante richiede un passaggio manuale perché Elementor si basa su widget visivi personalizzati anziché sui tradizionali modelli PHP di WooCommerce.
SaveTo Wishlist posiziona il suo pulsante utilizzando gli hook di azione di WooCommerce. Un modello di prodotto standard attiva tali hook in punti prestabiliti. Pertanto, il plugin sa sempre dove inserire il pulsante.
Tuttavia, un modello Elementor viene assemblato con i widget di Elementor. Se il tuo utilizza un pulsante di aggiunta al carrello personalizzato, tali hook non vengono mai attivati. Di conseguenza, il plugin non ha nulla a cui agganciarsi.
Le pagine di archivio affrontano le stesse limitazioni di hook, solo su scala più ampia. Un Loop Grid di Elementor Pro non renderizza affatto il loop del negozio classico. Invece, renderizza il modello di elemento del loop che hai progettato. Poiché utilizza un layout personalizzato anziché gli hook del loop del negozio predefiniti, il pulsante richiede il posizionamento manuale.
Ciò che rende difficile la diagnosi è che avviene silenziosamente. Non appare alcun errore. Nessun avviso viene mostrato nell'area di amministrazione. E nessuna impostazione nel plugin lo risolve.
Inoltre, questo non è uno stack di nicchia. Secondo W3Techs, Elementor è in esecuzione sul 12,8% di tutti i siti web.
🔍️ Cosa abbiamo visto: I proprietari di negozi spesso si rivolgono al supporto preoccupati che il plugin non funzioni. La realtà è solo una differenza di architettura. Il rendering del pulsante funziona bene, ma deve essere posizionato esplicitamente all'interno del modello di Elementor.
Cosa fanno effettivamente le due integrazioni di Elementor
SaveTo Wishlist copre Elementor in due parti separate. Quale ti serve dipende dalla tua licenza Elementor.
| Capacità | Cosa fa | Elementor necessario | Aggiunto in |
|---|---|---|---|
| Widget Salva nella Wishlist | Un widget nativo di Elementor che trascini in qualsiasi modello per posizionare manualmente il pulsante | Elementor gratuito o Pro | 1.1.3 |
| Posizionamento Loop Grid e Loop Carousel | Posizionamento automatico del pulsante su ogni scheda prodotto, guidato dall'impostazione della tua pagina negozio esistente | Elementor Pro | 1.1.2 |
Entrambi sono inclusi in SaveTo Wishlist Lite, il plugin gratuito, quindi anche i titolari di licenza Pro li ricevono. Aggiorna alla versione 1.1.3 o successiva e avrai entrambi.
Il tuo percorso dipende dalla tua licenza. Se crei pagine prodotto in Elementor gratuito, il widget è la tua opzione. Loop Grid, Loop Carousel e Theme Builder sono tutte funzionalità di Elementor Pro.
In pratica, la maggior parte dei negozi Pro finisce per utilizzarli entrambi. Il posizionamento automatico gestisce gli archivi. Il widget gestisce il modello del singolo prodotto.
Una distinzione evita molta confusione in seguito. Il widget Elementor posiziona il pulsante della wishlist su un prodotto. Non visualizza la wishlist stessa. Per quello, usa il blocco wishlist o lo shortcode [saveto_wishlist].
Cosa ti serve prima di iniziare
Quattro elementi devono essere in posizione prima che il widget renda qualcosa.
- Elementor, gratuito o Pro: il widget funziona con entrambi. Loop Grid e Loop Carousel richiedono Elementor Pro.
- SaveTo Wishlist Lite 1.1.3 o versioni successive: le versioni precedenti non includono il widget. Controlla la tua versione in Plugin.
- WooCommerce con un prodotto pubblicato: il widget viene visualizzato solo dove c'è un prodotto con cui lavorare.
- Un template associato a un prodotto: un singolo template di prodotto, un template di elemento del loop o una pagina consapevole del prodotto.
Oltre a ciò, non c'è un passaggio di configurazione separato. Il widget legge le tue impostazioni della wishlist esistenti. Quindi, uno inserito invariato visualizza lo stesso pulsante che il tuo negozio mostra già.
Come aggiungere il pulsante della wishlist con il widget Elementor
Aggiungere il widget richiede quattro passaggi. Stilizzarlo ne richiede altri tre.
Trascina il widget sul tuo modello
- Apri il template o la pagina prodotto che vuoi modificare in Elementor.
- Cerca nel pannello widget Save to Wishlist.
- Trascina il widget sul tuo layout, dove vuoi che si trovi il pulsante.
- Fai clic su Aggiorna per salvare.
Il widget è archiviato sia nelle categorie WooCommerce che Generali. Quindi la navigazione funziona così come la ricerca. Digitando wishlist, save, favorite o favourite lo fa apparire.
Viene visualizzato subito utilizzando le tue attuali impostazioni della wishlist. Ciò significa che vedi il pulsante reale sulla tela, non un segnaposto grigio.
Scegli il tipo di pulsante
Button Type si trova nella sezione Wishlist Button nella scheda Content. È l'unica impostazione lì.
Dieci stili sono inclusi con il widget:
- Solo testo, Solo icona e Icona e testo
- Icona e testo a pillola, Icona solida e Icona solida e testo
- Icona solida e testo a pillola, Icona minima e Icona minima e testo
- Icona minimale e testo a pillola
Le varianti a pillola usano angoli completamente arrotondati. Solido riempie la forma dell'icona, mentre Minimo usa un contorno più leggero.
Il controllo predefinito è lo stile del pulsante del tuo prodotto dalle impostazioni della wishlist. Modificarlo qui influisce su questo singolo widget, non sull'intero negozio.
Imposta l'allineamento
L'allineamento si trova nella scheda Style sotto Layout. È lì che Elementor mantiene l'allineamento per i propri widget.
Apri Layout, quindi imposta Allineamento su Sinistra, Centro o Destra. L'impostazione predefinita è Sinistra.
Cambia i colori del pulsante
La sezione Colors nella scheda Style offre otto controlli. Ognuno ha uno stato normale e uno stato hover: Colore testo, Colore sfondo, Colore bordo e Colore icona.
Ogni selettore inizia con il colore già salvato nelle impostazioni della tua wishlist. Quindi un widget non modificato corrisponde al resto del tuo negozio.
Modificane uno e sovrascrive quel colore solo per questo widget. Ciò aiuta quando un singolo template si trova su una sezione scura o uno sfondo fotografico.
I colori sono l'unica cosa che il widget sovrascrive. Dimensione, spaziatura, larghezza del bordo e forma dell'icona si trovano altrove.
Troverai quelle sotto SaveTo Wishlist > Settings > Button Placement & Styles. Quindi le ri-stilizzale una volta e ogni pulsante seguirà.
Una limitazione è utile conoscerla in anticipo. I selettori accettano solo colori solidi, senza cursore di trasparenza e senza scheda colori globali.
Questo perché il pulsante della wishlist memorizza valori esadecimali semplici. Un colore globale verrebbe visualizzato correttamente ma non verrebbe trasferito alla pagina live, quindi l'opzione è disabilitata per garantire l'accuratezza delle tue impostazioni.
Per la stessa guida con ogni schermata acquisita, consulta la nostra guida alla knowledge base per il widget Elementor.
Come mostrare il pulsante della wishlist in Loop Grid e Loop Carousel
Con Elementor Pro hai due percorsi per le schede prodotto. Si adattano a diversi livelli di controllo.
Lascia che sia il plugin a posizionarlo per te
Il posizionamento della tua pagina negozio esistente si applica già alle schede Loop Grid e Loop Carousel.
Vai su SaveTo Wishlist > Impostazioni > Pagina Negozio, scegli un posizionamento, quindi salva. Il pulsante appare su ogni scheda senza che tu debba toccare il modello.
Dietro le quinte, l'integrazione si ancora a quattro widget Elementor nel modello del tuo elemento loop:
- Immagine del prodotto: contiene i posizionamenti ancorati all'immagine del prodotto.
- Titolo del prodotto: contiene i posizionamenti ancorati al titolo.
- Aggiungi al carrello del prodotto: contiene i posizionamenti sopra o sotto il pulsante.
- Aggiungi al carrello: la seconda variante di aggiunta al carrello di Elementor, trattata allo stesso modo.
Il tuo modello di elemento del loop necessita di almeno uno di questi quattro. Quando una scheda è costruita interamente da widget personalizzati, il plugin richiede semplicemente di posizionare manualmente il pulsante.
Se un template contiene entrambe le varianti di aggiunta al carrello, l'ancora viene attivata una volta per scheda. In questo modo il pulsante non viene mai duplicato.
Non usi una griglia? Copriamo lo stesso pulsante all'interno delle tabelle di prodotti WooCommerce.
Posiziona tu stesso il widget
Modifica il template dell'elemento del loop e inserisci il widget Save to Wishlist nel layout della scheda. Ottieni un controllo esatto su dove si trova il pulsante su ogni scheda.
C'è un comportamento da pianificare qui. All'interno di un elemento del loop, il plugin tratta il tuo widget come un pulsante per scheda anziché un duplicato. Il posizionamento del tuo negozio continua a essere visualizzato insieme ad esso.
Quindi scegli un percorso o l'altro. Se posizioni il widget manualmente, imposta il posizionamento della tua pagina negozio su Non mostrare. Altrimenti ogni scheda finirà con due pulsanti.
🔍️ Cosa abbiamo visto: la pagina del singolo prodotto funziona in modo diverso, e questo confonde le persone. Inserisci il widget su un template di prodotto Elementor e il plugin disattiva il suo posizionamento sulla pagina del prodotto per te. Gli elementi del loop sono l'eccezione, quindi richiedono il passaggio manuale sopra.
Dove mettere il pulsante in modo che gli acquirenti lo usino davvero
Una volta che puoi posizionare il pulsante ovunque, la domanda più difficile è dove ottiene il maggior numero di salvataggi.
Inizia dal motivo per cui gli acquirenti abbandonano. Secondo il Baymard Institute, il tasso medio documentato di abbandono del carrello in 50 studi è del 70,22%.
Ancora più indicativo, il 42% degli acquirenti online statunitensi afferma di aver abbandonato perché stava solo navigando. Quelle persone non stanno rifiutando il tuo prodotto. Hanno una cattiva tempistica.
Advanced Coupons ha una guida su come ridurre gli abbandoni del carrello se desideri anche il lato del checkout.
Una wishlist è l'unica cosa sulla pagina creata per catturarli. Questo riformula lo scopo del pulsante. È la seconda call to action per tutti coloro che non acquistano oggi.
Tre regole di posizionamento reggono bene nella maggior parte dei negozi:
- Tienilo all'interno del buy box: posiziona il pulsante accanto al prezzo e ad Aggiungi al carrello. Un acquirente che decide se andarsene sta guardando proprio lì.
- Dagli meno peso visivo di Aggiungi al carrello: i tipi Minimal e Icon Only esistono per questo. Un pulsante wishlist stilizzato in modo troppo appariscente compete con la vendita che desideri oggi.
- Sulle schede, prediligi l'angolo dell'immagine o sotto il titolo: lo spazio della scheda è limitato. Un pulsante a larghezza intera sotto Aggiungi al carrello interrompe l'allineamento della griglia sugli schermi più piccoli.
Approfondiamo entrambe le superfici nelle nostre guide alle migliori pratiche per la pagina del prodotto e alle migliori pratiche per la pagina del negozio.
Avere il pulsante sulle schede Loop Grid è più importante di quanto sembri. La maggior parte dell' abbandono durante la navigazione avviene nell'archivio, prima che un acquirente apra la pagina di un prodotto.
Quindi, se il tuo unico pulsante si trova nel template del prodotto, stai catturando i pochi che cliccano. Tutti gli altri scivolano via.
Cinque modi per mettere a frutto i salvataggi della wishlist di Elementor
Un salvataggio vale esattamente quanto ciò che fai dopo. Cinque azioni trasformano una wishlist in crescita in entrate.
- Attiva avvisi di calo prezzo: quando il prezzo di un prodotto salvato scende, l'acquirente viene informato di un articolo che desiderava già. Scopri come funzionano gli avvisi di calo prezzo della wishlist.
- Invia notifiche di "tornato disponibile": un prodotto esaurito nella wishlist è un ordine in coda. Informare l'acquirente quando la merce torna disponibile è meglio che sperare che controlli di nuovo.
- Interpreta i salvataggi come dati sulla domanda: i prodotti salvati spesso e acquistati raramente ti dicono qualcosa sul prezzo, sulla spedizione o sul testo della pagina. Le analitiche della wishlist rendono visibile il modello.
- Segmenta per intento: un acquirente con cinque salvataggi e nessun ordine necessita di un'email diversa da un acquirente abituale. L'attività della wishlist ti fornisce un segmento che la cronologia degli ordini non ti darebbe mai.
- Pianifica campagne stagionali attorno agli articoli salvati: le stagioni dei regali premiano i negozi che sanno cosa desidera ogni cliente. Una wishlist è quell'elenco, fornito volontariamente piuttosto che indovinato.
Vale la pena essere chiari su quali parti sono gratuite. Tutto ciò che riguarda il posizionamento del pulsante wishlist di Elementor viene spedito nel plugin Lite gratuito.
Analitiche, avvisi di calo prezzo, email di "tornato disponibile" e webhook sono funzionalità Pro. Iniziano con il piano Growth.
Qualunque strategia tu adotti, il tasso di conversione della wishlist è il numero da tenere d'occhio. Ti dice se i salvataggi si stanno trasformando in ordini.
Visser Labs copre la lettura dei report del tuo negozio se desideri un quadro più ampio.
Problemi della wishlist di Elementor e come risolverli
Quattro problemi spiegano la maggior parte di ciò che va storto qui. Ognuno ha una causa specifica.
Il pulsante non appare affatto
Procedi con questi in ordine.
- Nessun prodotto nel contesto. Il widget viene visualizzato solo dove WooCommerce ha un prodotto con cui lavorare. Una pagina semplice non gli fornisce nulla, quindi rimane vuoto. Spostalo in un template di prodotto singolo, in un template di elemento di loop o in una pagina che imposta un prodotto.
- Le wishlist degli ospiti sono disattivate. Se "Disabilita wishlist ospiti" è attivo e sei disconnesso, il pulsante viene nascosto di proposito. Accedi o valuta se permettere le wishlist degli ospiti sia adatto al tuo negozio.
- Il plugin è più vecchio della versione 1.1.3. Il widget non esiste nelle versioni precedenti. Aggiorna SaveTo Wishlist e apparirà nel pannello.
Due pulsanti della wishlist vengono visualizzati sulla pagina del prodotto
Questo di solito si risolve da solo. Quando il tuo template di prodotto Elementor contiene il widget, il plugin annulla la registrazione del proprio posizionamento del prodotto singolo.
Prodotti correlati, upsell e cross-sell vengono deliberatamente lasciati invariati. Quelle schede vengono visualizzate tramite il posizionamento del tuo negozio.
Quindi un secondo pulsante lì è l'impostazione del negozio che fa il suo lavoro. La modifichi in SaveTo Wishlist > Impostazioni > Posizionamento e stili pulsante.
I selettori di colore non fanno nulla
Due impostazioni disattivano i controlli del colore. Ognuna mostra un messaggio nel pannello di Elementor che spiega il perché.
Se la modalità del pulsante del tuo prodotto è impostata su Predefinito del tema, il pulsante eredita lo stile del tuo tema. Il plugin non applica alcun colore proprio. Cambia la modalità in Predefinito per prendere il controllo.
Se l'icona della tua wishlist è un'immagine caricata personalizzata, i due controlli del colore dell'icona non fanno nulla. Un'immagine caricata non può essere tinta. Sostituiscila con una forma di icona integrata se il controllo del colore è più importante.
Appare un layout del blog invece della wishlist
Se un link della wishlist apre il design del tuo archivio post, una condizione di visualizzazione di Elementor Theme Builder si sta probabilmente applicando in modo troppo ampio. Succede quando la condizione di visualizzazione di quel modello ha come target l'archivio post.
Quella condizione corrisponde anche alle singole visualizzazioni della wishlist. Ecco la correzione:
- Apri Modelli > Theme Builder e seleziona il tuo modello di archivio.
- Apri le sue Condizioni di visualizzazione.
- Rimuovi la condizione che ha come target l'archivio dei post.
- Crea il tuo archivio di post come una pagina standalone invece.
Domande frequenti: pulsante wishlist di Elementor
Ho bisogno di Elementor Pro per usare il widget della wishlist?
No. Il widget Salva nella Wishlist funziona nella versione gratuita di Elementor.
Elementor Pro è necessario solo per i modelli Loop Grid, Loop Carousel e Theme Builder. Nella versione gratuita di Elementor, il widget è il modo in cui posizioni il pulsante.
Il widget sovrascriverà le impostazioni della mia wishlist?
Solo gli otto colori, e solo per quel singolo widget. Anche il tipo e l'allineamento del pulsante sono per widget.
Tutto il resto proviene ancora dalle impostazioni della tua wishlist. Ciò include dimensioni, spaziatura, larghezza del bordo e forma dell'icona. Quindi un restyling a livello di negozio rimane una singola modifica in un unico posto.
Posso usare il widget e il posizionamento automatico insieme?
Sì, anche se le due superfici si comportano in modo diverso.
Su un modello di prodotto che contiene il widget, il plugin disattiva il proprio posizionamento nella pagina del prodotto. Ottieni un pulsante.
All'interno di un modello di elemento del loop, vengono visualizzati sia il widget che il posizionamento del tuo negozio. Imposta il posizionamento del negozio su Non mostrare se desideri solo il widget.
Perché non c'è un cursore di trasparenza nei selettori di colore?
Il pulsante della wishlist memorizza solo colori esadecimali solidi.
Un colore trasparente o globale verrebbe visualizzato correttamente in anteprima e poi tornerebbe al colore predefinito nella pagina live. Queste opzioni vengono disattivate piuttosto che lasciate a ingannare.
Di quale versione di SaveTo Wishlist ho bisogno?
Il supporto per Loop Grid e Loop Carousel è arrivato con la versione 1.1.2. Il widget Elementor è arrivato con la versione 1.1.3.
Utilizzando la versione 1.1.3 o successive, avrai entrambi. Entrambi sono inclusi nel plugin gratuito Lite, quindi nessuno dei due richiede una licenza Pro.
Il widget visualizza la wishlist stessa?
No. Il widget posiziona il pulsante Salva nella Wishlist su un prodotto.
Per mostrare la wishlist effettiva di un cliente su una pagina, usa invece il blocco wishlist o lo shortcode [saveto_wishlist].
Conclusione
La visualizzazione del pulsante della wishlist di Elementor non è mai stata veramente una questione di stile. Si trattava di colmare il divario tra gli hook tradizionali di WordPress e i costruttori visivi personalizzati.
Entrambe le parti di quella lacuna sono ora chiuse, sia su Elementor gratuito che su Elementor Pro.
La configurazione è la parte facile e richiede pochi minuti. Il vero lavoro consiste nel decidere dove posizionare il pulsante. Dopodiché, si tratta di decidere cosa succede una volta che un acquirente lo utilizza.
Ecco cosa fare dopo:
- Aggiorna alla versione 1.1.3 o successiva, quindi controlla quale percorso Elementor si adatta alla tua licenza.
- Trascina il widget Salva nella Wishlist sul tuo modello di prodotto e scegli un tipo di pulsante.
- Attiva le schede Loop Grid e Loop Carousel tramite il posizionamento nella pagina del tuo negozio.
- Posiziona il pulsante all'interno del box di acquisto e sulle tue schede prodotto, non solo in uno.
- Metti in funzione i salvataggi con avvisi, segmenti e dati sulla domanda.
Pronto a inserire un pulsante wishlist di Elementor su ogni prodotto del tuo negozio? Inizia gratuitamente con SaveTo Wishlist Lite, o scopri cosa aggiungono i piani Growth, Plus e Business.
