19 esempi di siti Web di e-commerce Divi

Pubblicato: 2019-02-11

La versatilità di Divi lo rende ideale per i siti di eCommerce. Si integra bene con WooCommerce e altre piattaforme di eCommerce. È ovvio che ci sono molti siti di e-commerce là fuori costruiti con Divi. In questo articolo, esamineremo 20 esempi di siti Web di e-commerce creati con Divi per stimolare la tua immaginazione.

Questi siti hanno layout interessanti, pagine di negozi e pagine di prodotti. La maggior parte include uno stile interessante per il negozio e le pagine dei prodotti e alcuni includono componenti aggiuntivi WooCommerce. Ti segnalo quello che mi colpisce di più. I siti web non sono in un ordine particolare.

1. Africa orientale

L'Africa orientale ha un design della homepage nitido che si concentra sull'azienda. La pagina ha diversi call to action per vedere i vari prodotti. Le pagine delle categorie includono un'intestazione con un logo grande e un menu di navigazione che scorre con l'intestazione. Le pagine includono una casella di ricerca e categorie suggerite. Le pagine del prodotto mostrano il prodotto in due colonne. Il layout è semplice e include prodotti suggeriti.

Vedi sito web

2. La dolce Cecilys

Sweet Cecilys visualizza le immagini come collegamenti alle categorie del negozio all'interno di un layout a più colonne che assomiglia a una rivista. Lo sfondo mostra una parte del logo dell'azienda. Le pagine delle categorie includono lo stesso motivo di sfondo della home page e visualizzano i prodotti all'interno di quattro colonne. Le pagine delle categorie hanno widget WooCommerce nella barra laterale con uno stile che corrisponde ai prodotti. Le pagine dei prodotti utilizzano la barra laterale e aggiungono pulsanti di condivisione social e prodotti correlati. Questo sito ha alcune fantastiche fotografie di prodotti.

Vedi sito web

3. Carta rosa moderna

La homepage di Modern Pink Paper sembra un negozio e utilizza colori tenui per attirare il pubblico di destinazione. Include CTA a diverse categorie. Le pagine della categoria principale utilizzano la stessa immagine per ogni categoria, ma mostrano il titolo sopra l'immagine. Le pagine delle categorie secondarie mostrano i prodotti con un filtro. Le pagine dei prodotti hanno molte opzioni di colore e personalizzazione. L'acquirente può selezionare il colore, aggiungere un nome per la personalizzazione, scegliere di vedere il prodotto prima della spedizione e aggiungere messaggi e note. La descrizione del prodotto utilizza una fisarmonica per le FAQ.

Vedi sito web

4. Disegni a una foglia

One Leaf Designs mostra le immagini dei prodotti in uno slider a tutta larghezza con un CTA del negozio seguito da una sezione con i migliori venditori. La pagina del negozio mostra i prodotti in una sezione riquadrata che si sovrappone all'intestazione. Le pagine del prodotto mostrano il prodotto con un'ombra di scatola per tutte le immagini. Il testo è in stile per corrispondere al sito. Include collegamenti ad altri prodotti che potrebbero piacere al visitatore.

Vedi sito web

5. Il cesto dei fratelli

Il Bro Basket mostra un'intestazione a schermo intero con un CTA del negozio. Una sezione mostra le categorie del negozio utilizzando immagini con sovrapposizioni. Un'altra sezione mostra i prodotti selezionati a mano. Le pagine delle categorie mostrano diverse sezioni sull'azienda e su cosa fanno. Queste sezioni includono i servizi nelle schede 3D. Quelli più lontani sono sfocati. L'area di descrizione delle pagine del prodotto include un video a tutta larghezza o personalizzazioni. Includono anche prodotti correlati. Amo la fotografia su questo sito.

Vedi sito web

6. Negozio di prodotti naturali

Natural Care Shop ha un bel design del negozio con immagini che si collegano alle categorie. Utilizza colori tenui per attirare il pubblico di destinazione. Le pagine delle categorie includono i widget della barra laterale di WooCommerce e CTA nel piè di pagina. I prodotti sono mostrati con immagini di grandi dimensioni. Le pagine dei prodotti hanno icone in stile e prodotti simili sia in un widget che come immagini CTA.

Vedi sito web

7. Apis Australia

Apis Australia include un CTA del negozio a tutta larghezza nell'intestazione insieme a una sezione di categoria che mostra diversi prodotti in un'immagine. La pagina del negozio utilizza lo stesso sfondo per essere visualizzata dietro il modulo del negozio. Un'altra sezione del negozio mostra prodotti complementari sullo stesso sfondo. I prodotti sono mostrati con le ombre della scatola. Le pagine dei prodotti sono semplici ma includono uno stile di testo per abbinare il sito e i prodotti correlati.

Vedi sito web

8. Lahlay

Lahlay mostra uno slider a schermo intero con CTA per diversi prodotti. Include un mega-menu che si nasconde sullo scorrimento. Diverse sezioni della homepage mostrano i prodotti con immagini di grandi dimensioni e ombre di scatole. Diverse altre sezioni forniscono informazioni sul prodotto con immagini. Le pagine delle categorie mostrano molte foto e informazioni in fisarmoniche in stile, insieme a un modulo negozio in stile. I prodotti vengono visualizzati in popup. Questo sito ha una delle pagine di categoria/prodotto più interessanti che abbia mai visto.

Vedi sito web

9. Leoca

Leoca visualizza un'intestazione a schermo intero con un CTA del negozio. La sezione successiva mostra immagini di grandi dimensioni che si collegano alle categorie. Includono i titoli delle categorie. Le pagine delle categorie mostrano un'immagine a schermo intero insieme al titolo della categoria. La sezione successiva mostra un prodotto seguito da un modulo negozio con immagini di grandi dimensioni e animazione al passaggio del mouse per le sovrapposizioni per mostrare le taglie e un cuore per aggiungere il prodotto alla tua lista dei desideri. Le pagine dei prodotti mostrano molte immagini di grandi dimensioni insieme alle opzioni.

Vedi sito web

10. Il gentiluomo trasandato

The Scruffy Gentleman fornisce una casella di ricerca del prodotto sotto l'intestazione seguita da un'immagine di sfondo a larghezza intera in parallasse. I prodotti in evidenza scorrono su di esso e si sovrappongono alla sezione successiva dei prodotti in evidenza. Un'altra sezione mostra un CTA in parallasse seguito da nuovi articoli nel negozio. La pagina del negozio segue un design simile e aggiunge una barra laterale WooCommerce. Le pagine dei prodotti vengono visualizzate a tutta larghezza e includono immagini di grandi dimensioni.

Vedi sito web

11. Veez

Veez include un pulsante negozio che rimane sullo schermo mentre scorri. La home page mostra le categorie con immagini come collegamenti che hanno uno stile con testo e caselle sovrapposti. Le pagine delle categorie mostrano un'immagine e un titolo per introdurre la sezione seguita da un modulo negozio e un pulsante per rivelare di più. Le pagine dei prodotti hanno molti stili interessanti. Mostrano il prodotto con molte immagini grandi in più colonne. Un'altra sezione mostra più prodotti della categoria.

Vedi sito web

12. Cuscino Coco

Coco Cuscino include uno slider a schermo intero con un CTA del negozio per le diverse categorie. Lo scorrimento mostra uno slider degli ultimi prodotti con un titolo di sezione a sinistra. Un'altra sezione include CTA a diverse categorie. Le pagine delle categorie e dei prodotti sono semplici e hanno bordi, pulsanti e stili di testo e un piè di pagina personalizzato. La pagina del prodotto include un'ombra della scatola.

Vedi sito web

13. Tarte e bacche

Tarte e frutti di bosco

Tarte e Berry visualizzano i prodotti in uno slider a schermo intero utilizzando l'effetto Ken Burns e un CTA del negozio. Una sezione sottile mostra il processo di acquisto con le icone. Di seguito è riportato un ampio elenco di prodotti e una sezione di testimonianze. La pagina del negozio segue lo stesso design, ma senza il cursore. Le pagine dei prodotti sono in stile per adattarsi al sito e includono una casella per aggiungere un messaggio personalizzato. La descrizione mostra gli ingredienti. La pagina mostra anche i prodotti correlati.

Vedi sito web

14. Farmacista di Nikki Hill

Nikki Hill Apothecary utilizza un design morbido ed elegante per mostrare i prodotti. L'intestazione mostra un CTA seguito da informazioni sull'azienda. Una sezione a più colonne mostra le immagini come collegamenti a categorie. Le pagine delle categorie sono pulite e includono uno stile che si adatta al sito. Le pagine dei prodotti hanno uno stile personalizzato, che include le schede dell'area di descrizione. Sotto il prodotto c'è un prodotto suggerito all'interno di una scatola con stile. La fotografia in questo sito lo distingue.

Vedi sito web

15. Spighe e passero

Spikes and Sparrow mostra un cursore a tutta larghezza per mostrare i prodotti. Il cursore ha uno stile di navigazione sul lato sinistro. La sezione successiva mostra le categorie in un layout a più colonne utilizzando immagini con sovrapposizioni di testo con stile. Le pagine del negozio mostrano i prodotti con una barra laterale in stile WooCommerce. Le pagine dei prodotti sembrano eleganti con i loro colori di marca. Non mostrano molte informazioni, ma includono il prodotto in altri colori.

Vedi sito web

16. Kickbike

Kickbike mostra un cursore a tutta larghezza con un CTA del negozio. La homepage fornisce diversi articoli e collegamenti sull'azienda, sezioni del negozio e molte informazioni sui prodotti. Le pagine delle categorie includono un'immagine a schermo intero seguita da una sezione di informazioni, la sezione del negozio a tutta larghezza e quindi una FAQ. Le pagine dei prodotti sono semplici ma utilizzano molte foto di grandi dimensioni e prodotti correlati.

Vedi sito web

17. Boutique non salata

Unsalted Boutique utilizza colori tenui dietro il menu, le sezioni, i blocchi di testo, ecc. Per attirare il pubblico di destinazione. Un CTA viene visualizzato all'interno di un dispositivo di scorrimento e utilizza un'immagine con una casella colorata per il testo. Riquadri colorati vengono utilizzati in tutto il sito per identificare le categorie. La homepage include molte di queste sezioni del negozio. I collegamenti di categoria aprono la pagina del prodotto in cui è possibile scegliere il prodotto specifico da una casella a discesa. La pagina del prodotto mostra anche i prodotti correlati.

Vedi sito web

18. Fiori della Maison

Maison Flowers mostra un'immagine del prodotto come sfondo di parallasse nella sezione degli eroi a schermo intero. Lo scorrimento mostra un modulo negozio in stile con un'icona a forma di fiore nella sovrapposizione e una sezione con immagini per categorie con animazione al passaggio del mouse. Le pagine delle categorie corrispondono alla home page ma hanno una piccola immagine con uno stile in sovrimpressione. Le pagine dei prodotti utilizzano la stessa intestazione e un titolo del prodotto di grandi dimensioni e include una casella di messaggio personale per personalizzare il regalo. La pagina ha anche una sezione per mostrare le informazioni di spedizione e acquisto e altre due sezioni con prodotti simili.

Vedi sito web

19. Negozio Basami

Basami Shop mostra un CTA del negozio in uno slider a schermo intero. Una sezione di altri prodotti e una sezione dei preferiti include le ombre della scatola. Le pagine delle categorie mostrano le categorie nella barra laterale, una descrizione della categoria e quindi i prodotti. Le pagine del prodotto mostrano un'immagine grande del prodotto, la galleria del prodotto e quindi l'area della descrizione. Quest'area è in stile per corrispondere al sito e include prodotti correlati.

Vedi sito web

Pensieri finali

Questo è il nostro sguardo a 20 esempi di siti Web di e-commerce creati con Divi per stimolare la tua immaginazione. Questi siti sono ottimi esempi di cosa si può fare con Divi. Molti hanno pagine di destinazione eleganti con moduli negozio in stile per concentrarsi sui prodotti. Ci sono molti esempi eccellenti di pagine di negozi, pagine di categorie e pagine di prodotti. È facile vedere come la fotografia del prodotto può far risaltare un design semplice. C'è sicuramente qualcosa qui per aiutarti a progettare qualsiasi tipo di sito Web di e-commerce per il tuo prossimo progetto Divi.

Vogliamo sentire da voi. Quale di questi siti di eCommerce Divi è il tuo preferito? Fateci sapere cosa ne pensate nei commenti.

Immagine in primo piano tramite TeraVector / shutterstock.com