Vuoi semplificare l'esperienza di acquisto dei tuoi clienti e aumentare il tasso di conversione? Potresti chiederti, ma aggiungendo un carrello galleggiante 🛒 al tuo sito web WooCommerce svolgerà questi lavori in modo efficace!
Un carrello mobile è un piccolo widget che appare sullo schermo quando un cliente aggiunge un prodotto al carrello. Visualizza una vista compatta ma dettagliata del contenuto del carrello e procede al pagamento senza ricaricare l'intera pagina web. 🤩
Ora la domanda è: “Come aggiungere il carrello mobile WooCommerce a WordPress?” Puoi aggiungere un carrello mobile utilizzando ShopEngine’s sticky fly cart module basta seguire 3 semplici passaggi. 🙌
Vediamo come puoi aggiungere un carrello mobile WooCommerce comodo e visivamente accattivante utilizzando ShopEngine per creare un altro coinvolgente e facile da usare esperienza di acquisto per i tuoi clienti.
How to Add a WooCommerce Floating Cart in WordPress
To add a sticky, interactive floating cart dropdown or slide-in panel without touching code, you can use ShopEngine alongside Elementor.
Tools to install: WooCommerce (free), Elementor (free), & ShopEngine (free & pro)
- Step 1: Enable the Floating Cart Module
Navigate to your WordPress dashboard, go to ShopEngine, and select the Moduli tab. Locate the Mini Cart O Floating Cart module and toggle it to active. - Step 2: Configure Cart Trigger & Behavior
Open the module settings to customize how the cart behaves. Select whether the cart drawer slides in from the left/right or pops up as a modal, and enable triggers like auto-opening when an item is added to the cart. - Step 3: Add the Widget to Your Header or Layout
Edit your site’s global header template or page layout using Elementor. Search for the Mini Cart / Floating Cart widget and drag it into your desired header position. - Step 4: Customize Style & Action Buttons
Use the Elementor styling panel to adjust the cart icon, badge colors, typography, and background overlays. Ensure direct action buttons like View Cart E Guardare are clearly visible and styled to match your store’s branding.
Key Considerations & Best Practices
- Reduce Friction with AJAX Item Removal: Ensure your floating cart supports AJAX so customers can update item quantities or remove products without forcing a page refresh.
- Keep Mobile Viewports Unobstructed: Test the floating cart position on mobile screens. Position the sticky trigger icon where it won’t block critical navigation links, sticky footers, or product call-to-action buttons.
Come aggiungere il carrello mobile WooCommerce a WordPress – Guida passo passo
Ora è il momento di descrivere i passaggi per aggiungere il carrello mobile WooCommerce a WordPress. E il modo più semplice per aggiungere un carrello mobile al tuo negozio WooCommerce è utilizzare il file widget di carrello volante appiccicoso di ShopEngine.
ShopEngine è un generatore di pagine WooCommerce completo per migliorare il tuo funzionalità del negozio online. Puoi progetta e realizza il tuo intero negozio with all the necessary features and functionalities using templates and modules of ShopEngine.
Tra questi, il widget appiccicoso del carrello volante ti consentirà di aggiungere un carrello galleggiante ai tuoi siti web. Inoltre, renderà il processo di pagamento più agevole per i tuoi clienti.
Inoltre, è semplicissimo integrarlo con il tuo sito Web WordPress entro 3 passaggi.
Iniziamo-
Passaggio 1: installa e attiva i plugin necessari
Per aggiungere il carrello mobile al tuo sito Web WordPress, i prerequisiti sono l'installazione dei seguenti 3 plugin.
✅ WooCommerce: Scarica WooCommerce
✅ ShopEngine (gratuito): Scarica ShopEngine
✅ ShopEngine Pro: Ottieni ShopEngine Pro
Accedi alla dashboard di WordPress, quindi vai a Plugin -> Aggiungi nuovo. Successivamente, cerca WooCommerce e attivalo. WooCommerce è una piattaforma di eCommerce open source per creare negozi in WordPress. È gratuito e completamente personalizzabile.
Quindi, cerca il Plug-in ShopEngine e installarlo. Dopo di che, attivare la licenza.
📢📢 Consulta questa documentazione per installare e attivare ShopEngine
Una volta terminata l'attivazione, puoi farlo avvalersi delle caratteristiche e delle molecole più interessanti per progettare un sito Web WooCommerce bello e funzionale, comprese le opzioni del carrello mobile.
Passaggio 2: abilita il widget Sticky Fly Cart di ShopEngine
By default, the sticky fly cart widget is turned off. So, now, you have to enable the WooCommerce sticky Fly Cart widget di ShopEngine.
- Passa il mouse sopra ShopEngine -> Moduli.
- Puoi vedere il "Carrello per mosche appiccicoso" aggeggio
- Clicca sul icona ingranaggio (impostazione) e apparirà una barra laterale
- Accendi il "Abilita il modulo”
Caratteristiche principali del carrello appiccicoso
✅ Visualizza i dettagli del carrello con ogni articolo
✅ Mostra l'importo subtotale
✅ Può aggiungere o eliminare elementi
✅ Naviga nella pagina del carrello
✅ Effettuare l'operazione di check-out
Passaggio 3: personalizza le impostazioni del carrello appiccicoso
La parte migliore di questo carrello volante appiccicoso è la sua tonnellate di opzioni di personalizzazione. Dopo aver abilitato il widget, puoi modificare le proprietà del pulsante del carrello mobile di woo-commerce, della posizione, dell'animazione e degli articoli del carrello o mantenere i valori predefiniti.
Ecco le principali opzioni di personalizzazione:
✨ Abilita/disabilita l'animazione volante
Attiva questa opzione per impostare l'animazione a questo carrello volante appiccicoso o disabilitalo se non preferisci l'animazione.
✨ Abilita/Disabilita Ajax Aggiungi al carrello su una singola pagina
L'attivazione di questa opzione consentirà al cliente di farlo aggiungere prodotti (singoli o variabili) senza ricaricare l'intero sito.
Guarda anche - Come aggiungere il prodotto variabile WooCommerce al tuo sito web
✨ Escludi pagine
Se lo desidera escludere qualsiasi pagina da questa funzionalità è possibile aggiungere le pagine in questo campo.
✨ Cassetto Da
Imposta la posizione del carrello volante su sinistra o destra lato. Di conseguenza, l'icona del carrello mobile apparirà su questo lato.
✨ Bottone adesivo e Contatore bottone adesivo
Successivamente, puoi vederli 2 opzioni per personalizzare le proprietà del pulsante permanente e del contatore del pulsante permanente. È possibile personalizzare quanto segue:
- Dimensioni dei pulsanti e delle icone
- Colore del testo e dello sfondo
- Posizione in alto, a sinistra, a destra e in basso
✨Carrozzeria
- Personalizza il colore e collega il colore al passaggio del mouse
- Cambia il colore dello sfondo
- Imposta la larghezza e l'imbottitura personalizzate del corpo del carrello
✨ Intestazione carrello
- Regola il valore del riempimento
✨ Articoli nel carrello
- Modificare i valori di riempimento (sinistra, destra, superiore, inferiore).
- Personalizza la larghezza, il tipo e il colore del bordo inferiore
- Imposta la dimensione del carattere personalizzata
✨ Pulsanti del carrello
- Regola i valori di imbottitura dell'avvolgimento
- Imposta l'imbottitura dei pulsanti
- Personalizza il colore dei pulsanti, lo sfondo
- Imposta il colore di sfondo personalizzato al passaggio del mouse
Dopo tutta la personalizzazione, fare clic su Salvare le modifiche. Tutte le proprietà appariranno nel nuovo carrello mobile del tuo sito WordPress.
Come testare il nuovo carrello mobile nel tuo sito web WooCommerce
Per essere sicuro, aggiungi il carrello appiccicoso al tuo sito web e funziona perfettamente,
- Vai a pagina del negozio del tuo sito web WooCommerce
- Il carrello mobile apparirà nella posizione selezionata
- Seleziona uno o più prodotti e aggiungili al carrello
- Quindi, prova tutte le funzionalità. Add, delete, navigate the cart page, E guardare per assicurarsi che tutte queste funzionalità funzionino perfettamente.
✨✨Vuoi aggiungere un sistema di pagamento in più passaggi al tuo negozio WooCommerce?
👉👉Vedi questo blog – Come aggiungere WooCommerce Multi-Step Checkout in 5 passaggi
5 vantaggi principali derivanti dall'aggiunta del carrello Sticky Fly di ShopEngine a WordPress
La funzionalità del carrello mobile potrebbe sembrare una piccola modifica al tuo sito Web WordPress. Ma aggiungendo il widget appiccicoso del carrello volante di ShopEngine al tuo negozio WooCommerce ti aiuterà in molti modi.
Ecco i 5 vantaggi significativi:
🛒 Facile accesso al carrello
Con il carrello adesivo di ShopEngine, i clienti possono facilmente vedere tutti i dettagli del contenuto del carrello. Per accesso comodo e veloce, possono aggiungere, rimuovere o controllare i prodotti più facilmente.
Inoltre, possono tenere traccia dei file pagina del carrello senza navigare in tutto il sito. Di conseguenza, ridurrà la possibilità di abbandonare il carrello a causa della complessità della navigazione nel sito WooCommerce.
✔ Attrattiva visiva
Questo carrello volante appiccicoso aggiunge un aspetto elegante e professionale al tuo sito web Puoi anche personalizzare ogni singolo elemento e le sue caratteristiche per creare l'aspetto più coerente.
Per il appeal visivo intuitivo, il processo del carrello sarà più coinvolgente e attraente per i clienti.
💰 Aumenta le vendite
Quando il tuo cliente avrà un bell'aspetto con un facile accesso al contenuto del carrello, aumenterà il tasso di conversione e le vendite.
Inoltre, l'icona adesiva del carrello volante di ShopEngine è posizionata in una posizione ben visibile sulla pagina web. Di conseguenza, ricorda ai tuoi clienti i prodotti che hanno già aggiunto e aumenta le possibilità di potenziali vendite.
📲 Reattività del dispositivo
Successivamente, questo widget appiccicoso del carrello volante è interamente dispositivo reattivo incluso il PC, il tablet o lo smartphone. Pertanto, il tuo cliente avrà un'esperienza di acquisto senza interruzioni su qualunque dispositivo utilizzi.
🤝 Migliora l'esperienza dell'utente
In termini di facile accesso, design accattivante, reattività del dispositivo e tempi di caricamento inferiori, l'aggiunta di questo carrello volante appiccicoso al tuo sito web WooCommerce lo farà migliorare l'esperienza utente complessiva dei tuoi clienti.
Domande frequenti
È necessario aggiungere un carrello mobile al mio sito e-commerce?
L'aggiunta di un carrello mobile al tuo negozio WooCommerce è necessaria per migliorare l'esperienza dell'utente e aumentare il tasso di conversione. Gli utenti possono tenere traccia degli articoli nel carrello ed eseguire altre azioni senza caricare l'intero sito web.
Posso aggiungere il carrello mobile WooCommerce a pagine Web specifiche?
Sì, puoi aggiungere un carrello mobile a pagine specifiche del tuo sito web. ShopEngine offre opzioni flessibili per personalizzare il posizionamento del carrello mobile su qualsiasi pagina. Puoi anche escludere le pagine dal file “Escludi pagine” opzioni.
L'utilizzo del widget Sticky Fly Cart di ShopEngine è gratuito?
ShopEngine offre varie funzionalità gratuite per progettare il tuo negozio WooCommerce, ma il widget appiccicoso del carrello volante è una funzionalità premium di ShopEngine. Puoi aggiungere questo widget per creare il carrello e processo di acquisto più fluido. E possiamo assicurarti che non ti pentirai di aver speso per questo widget per l'integrazione semplicissima, le funzionalità eccellenti e le varie opzioni di personalizzazione.
Linea di fondo
È ora di concludere!
Scopri quanto è facile aggiungere il carrello mobile al tuo sito Web WordPress utilizzando il widget del carrello volante appiccicoso di ShopEngine. Basta seguire il semplici 3 passaggi e sei pronto per partire!
Offre un modo conveniente per visualizzare e aggiornare il contenuto del carrello dei tuoi clienti. Inoltre, aiuterà a incoraggiarli a completare l'acquisto.
Allora perché stai aspettando? Aggiungi il ShopEngine’s carrello per mosche appiccicoso al tuo sito web e rendilo più flessibile e facile da usare!
Lascia un commento