19 Exemplos de sites de comércio eletrônico da Divi

A versatilidade do Divi o torna ideal para sites de comércio eletrônico. Ele se integra bem com WooCommerce e outras plataformas de comércio eletrônico. É lógico que haja muitos sites de comércio eletrônico por aí construídos com Divi. Neste artigo, veremos 20 exemplos de sites de comércio eletrônico desenvolvidos com Divi para ajudar a despertar sua imaginação.

Esses sites têm layouts, páginas de loja e páginas de produtos interessantes. A maioria inclui um estilo interessante para as páginas da loja e do produto, e alguns incluem complementos do WooCommerce. Vou apontar o que mais me chama a atenção. Os sites não estão em uma ordem específica.

1. Leste da África

O Leste da África tem um design de página inicial bem definido que se concentra na empresa. A página tem vários apelos à ação para ver os vários produtos. As páginas de categoria incluem um cabeçalho com um grande logotipo e um menu de navegação que rola com o cabeçalho. As páginas incluem uma caixa de pesquisa e categorias sugeridas. As páginas do produto mostram o produto em duas colunas. O layout é simples e inclui sugestões de produtos.

Veja o site

2. Sweet Cecilys

Sweet Cecilys exibe imagens como links para as categorias da loja em um layout de várias colunas que se parece com uma revista. O fundo mostra uma parte do logotipo da empresa. As páginas de categoria incluem o mesmo padrão de fundo da página inicial e exibem os produtos em quatro colunas. As páginas de categoria têm widgets WooCommerce na barra lateral que são estilizados para combinar com os produtos. As páginas de produtos usam a barra lateral e adicionam botões de compartilhamento social e produtos relacionados. Este site tem fotos incríveis de produtos.

Veja o site

3. Papel Rosa Moderno

A página inicial da Modern Pink Paper parece uma loja e usa cores suaves para atrair o público-alvo. Inclui CTAs para diferentes categorias. As páginas da categoria primária usam a mesma imagem para cada categoria, mas mostram o título sobre a imagem. As páginas da categoria secundária mostram os produtos com um filtro. As páginas do produto têm muitas opções de cores e personalização. O comprador pode selecionar a cor, adicionar um nome para personalização, escolher ver o produto antes do envio e adicionar mensagens e notas. A descrição do produto usa um acordeão para o FAQ.

Veja o site

4. Desenhos de uma folha

One Leaf Designs exibe imagens de produtos em um controle deslizante de largura total com um CTA da loja seguido por uma seção com os mais vendidos. A página da loja mostra os produtos em uma seção em caixa que se sobrepõe ao cabeçalho. As páginas do produto mostram o produto com uma sombra de caixa para todas as imagens. O texto é estilizado para combinar com o site. Inclui links para outros produtos dos quais o visitante pode gostar.

Veja o site

5. The Bro Basket

O Bro Basket mostra um cabeçalho em tela inteira com um CTA da loja. Uma seção mostra as categorias da loja usando imagens com sobreposições. Outra seção mostra produtos selecionados manualmente. As páginas de categoria mostram várias seções sobre a empresa e o que ela faz. Essas seções incluem serviços em placas 3D. Aqueles mais distantes são desfocados. A área de descrição das páginas do produto inclui um vídeo de largura total ou personalizações. Eles também incluem produtos relacionados. Eu amo a fotografia neste site.

Veja o site

6. Loja de cuidados naturais

A Natural Care Shop tem um belo design de loja com imagens que remetem às categorias. Ele usa cores suaves para atrair o público-alvo. As páginas de categoria incluem widgets da barra lateral WooCommerce e CTA no rodapé. Os produtos são mostrados com imagens grandes. As páginas do produto têm ícones estilizados e produtos semelhantes em um widget e como imagens de CTA.

Veja o site

7. Apis Austrália

A Apis Australia inclui um CTA de loja de largura total no cabeçalho, junto com uma seção de categoria que mostra vários produtos em uma imagem. A página da loja usa o mesmo plano de fundo para exibir atrás do módulo da loja. Outra seção da loja mostra produtos complementares sobre o mesmo fundo. Os produtos são mostrados com sombras de caixa. As páginas do produto são simples, mas incluem estilo de texto para combinar com o site e produtos relacionados.

Veja o site

8. Lahlay

Lahlay mostra um controle deslizante de tela inteira com CTAs para vários produtos. Inclui um mega-menu que se esconde na rolagem. Várias seções na página inicial mostram os produtos com imagens grandes e sombras de caixas. Várias outras seções fornecem informações sobre o produto com imagens. As páginas de categoria mostram muitas fotos e informações em acordeões estilizados, junto com um módulo de loja estilizado. Os produtos são exibidos em pop-ups. Este site tem uma das páginas de categoria / produto mais interessantes que já vi.

Veja o site

9. Leoca

Leoca exibe um cabeçalho em tela inteira com um CTA da loja. A próxima seção mostra imagens grandes com links para categorias. Eles incluem os títulos das categorias. As páginas de categoria mostram uma imagem em tela inteira junto com o título da categoria. A próxima seção mostra um produto seguido por um módulo de loja com imagens grandes e animação flutuante para as sobreposições para mostrar os tamanhos e um coração para adicionar o produto à sua lista de desejos. As páginas do produto mostram muitas imagens grandes junto com opções.

Veja o site

10. O Cavalheiro Desalinhado

The Scruffy Gentleman fornece uma caixa de pesquisa de produto sob o cabeçalho, seguida por uma imagem de fundo de largura total em paralaxe. Os produtos em destaque passam sobre ele e se sobrepõem à próxima seção de produtos em destaque. Outra seção mostra um CTA em paralaxe seguido por novos itens na loja. A página da loja segue um design semelhante e adiciona uma barra lateral WooCommerce. As páginas do produto são exibidas em largura total e incluem imagens grandes.

Veja o site

11. Veez

Veez inclui um botão de loja que permanece na tela enquanto você rola. A página inicial mostra categorias com imagens como links estilizados com texto e caixas sobrepostos. As páginas de categoria mostram uma imagem e um título para apresentar a seção, seguido por um módulo de loja e um botão para revelar mais. As páginas do produto têm muitos estilos interessantes. Eles mostram o produto com muitas imagens grandes em várias colunas. Outra seção mostra mais produtos da categoria.

Veja o site

12. Coco Cuscino

Coco Cuscino inclui um controle deslizante de tela inteira com um CTA da loja para as diferentes categorias. A rolagem mostra um controle deslizante dos produtos mais recentes com um título de seção à esquerda. Outra seção inclui CTAs para diferentes categorias. As páginas de categorias e produtos são simples e têm bordas, botões e estilo de texto, além de um rodapé personalizado. A página do produto inclui uma sombra de caixa.

Veja o site

13. Tarte e Berry

Tarte e Berry exibem os produtos em um controle deslizante de tela inteira usando o efeito Ken Burns e um CTA da loja. Uma seção estreita mostra o processo de compra com ícones. A seguir, há uma grande lista de produtos e uma seção de depoimentos. A página da loja segue o mesmo design, mas sem o controle deslizante. As páginas do produto são estilizadas para combinar com o site e incluem uma caixa para adicionar uma mensagem personalizada. A descrição mostra os ingredientes. A página também mostra produtos relacionados.

Veja o site

14. Nikki Hill Apothecary

Nikki Hill Apothecary usa um design suave e elegante para mostrar os produtos. O cabeçalho mostra um CTA seguido de informações sobre a empresa. Uma seção com várias colunas mostra imagens como links para categorias. As páginas de categoria são limpas e incluem estilo para combinar com o site. As páginas do produto possuem um estilo personalizado, que inclui as guias da área de descrição. Embaixo do produto, há uma sugestão de produto dentro de uma caixa estilizada. A fotografia neste site o diferencia.

Veja o site

15. Picos e pardal

Spikes and Sparrow mostra um controle deslizante de largura total para mostrar os produtos. O controle deslizante tem um estilo de navegação no lado esquerdo. A próxima seção mostra categorias em um layout de várias colunas usando imagens com sobreposições de texto estilizadas. As páginas da loja mostram os produtos com uma barra lateral WooCommerce estilizada. As páginas do produto parecem elegantes com as cores de sua marca. Eles não mostram muitas informações, mas incluem o produto em outras cores.

Veja o site

16. Kickbike

Kickbike mostra um controle deslizante de largura total com um CTA da loja. A página inicial oferece vários artigos e links sobre a empresa, seções da loja e muitas informações sobre os produtos. As páginas de categoria incluem uma imagem em tela inteira seguida por uma seção de informações, a seção da loja em largura total e, em seguida, um FAQ. As páginas dos produtos são simples, mas usam muitas fotos grandes e produtos relacionados.

Veja o site

17. Boutique sem sal

A Unsalted Boutique usa cores suaves por trás do menu, seções, blocos de texto, etc. para atrair o público-alvo. Um CTA é exibido em um controle deslizante e usa uma imagem com uma caixa colorida para o texto. Caixas coloridas são usadas em todo o site para identificar as categorias. A página inicial inclui várias dessas seções da loja. Os links de categoria abrem a página do produto, onde você pode escolher o produto específico em uma caixa suspensa. A página do produto também mostra produtos relacionados.

Veja o site

18. Maison Flowers

Maison Flowers mostra uma imagem de produto como um fundo de paralaxe na seção de heróis em tela inteira. A rolagem mostra um módulo de loja estilizado com um ícone de flor na sobreposição e uma seção com imagens para categorias com animação flutuante. As páginas de categoria correspondem à página inicial, mas têm uma pequena imagem com uma sobreposição estilizada. As páginas do produto usam o mesmo cabeçalho e um grande título do produto, e incluem uma caixa de mensagem pessoal para personalizar o presente. A página também possui uma seção para mostrar informações de envio e compra e duas outras seções com produtos semelhantes.

Veja o site

19. Loja Basami

Basami Shop mostra um CTA da loja em um controle deslizante de tela inteira. Uma seção de outros produtos e uma seção de favoritos incluem sombras de caixa. As páginas de categoria mostram categorias na barra lateral, uma descrição da categoria e, em seguida, os produtos. As páginas do produto mostram uma imagem grande do produto, a galeria do produto e, em seguida, a área de descrição. Esta área é estilizada para combinar com o site e inclui produtos relacionados.

Veja o site

Reflexões finais

Esta é a nossa análise de 20 exemplos de sites de comércio eletrônico desenvolvidos com Divi para ajudar a despertar sua imaginação. Esses sites são ótimos exemplos do que pode ser feito com Divi. Muitos têm páginas de destino elegantes com módulos de loja estilizados para se concentrar nos produtos. Existem vários exemplos excelentes de páginas de loja, páginas de categoria e páginas de produtos. É fácil ver como a fotografia de um produto pode fazer um design simples se destacar. Com certeza há algo aqui para ajudá-lo a criar qualquer tipo de site de comércio eletrônico para o seu próximo projeto Divi.

Nós queremos ouvir de você. Quais destes sites de comércio eletrônico da Divi são seus favoritos? Deixe-nos saber o que você pensa sobre eles nos comentários.

Imagem em destaque via TeraVector / shutterstock.com