Categorias
eCommerce

Criando um eCommerce em 7 passos com o WordPress

Quem nunca conheceu alguém que queria abrir um negócio, mas nunca abriu “porque não tenho dinheiro”?

Diferente do físico, o mundo virtual permite qualquer pessoa criar um negócio inteiro em um único dia sem gastar um único real — tudo que você precisa é de uma ideia e a garra para vencer que você já tem!

Hoje te ensinaremos como criar um eCommerce do zero, como customizá-lo de acordo com a sua marca, e ainda a fazer algumas otimizações básicas para ele decolar. Até o fim desse post você será o mais novo empreendedor digital!

Tela de computador mostrando os domínios .net, .org, e .com
Fonte www.searchenginejournal.com

1) Compre seu domínio

Se a internet fosse uma cidade, o domínio seria basicamente o endereço do seu site, contendo o nome e extensão do mesmo — tipo goinfinite (nome) .net (extensão).

Há incontáveis extensões por aí, mas a maioria não são boas por motivos de SEO (dica 7) e facilidade de uso, por isso quem tem site no Brasil costuma favorecer os domínios .com.br, que podem ser comprados por R$ 40 anuais no site Registro.br

Se você quiser garantir que ninguém vai usar o seu nome, vale a pena também adquirir as versões .com e mesmo .net do seu domínio, que custam mais ou menos o mesmo valor.

2) Escolha uma hospedagem

A hospedagem pode ser entendida como os edifícios da internet — o lugar exato onde o seu negócio será implementado no mundo virtual — por isso é importante escolhê-la bem pois isso impactará os seus acessos tanto quanto uma localização ruim impacta uma loja física. (Quem não conhece um lugar onde nada dá certo?!)

Uma boa hospedagem precisa ser estável, ter backups externos e sistemas de segurança (como o seguro e segurança privada em um shopping), assim você pode trabalhar em paz sem medo de acordar e descobrir que tudo que você trabalhou para construir foi perdido.

Site da Infinite com a frase "você livre de problemas técnicos"

Aqui na Infinite, por exemplo, atendemos mais de 800 clientes e somos o único host de renome que não esconde as avaliações no Facebook ou tem ocorrências no ReclameAqui.

Oferecemos otimização completa para WordPress e suporte gerenciado para todos por apenas R$ 59,90, ao ponto que até mesmo programadores experientes hospedam conosco para poupar dores de cabeça com problemas técnicos!

Se você ainda não pode investir no seu negócio, aqui vai uma tabela para lhe orientar na escolha de uma hospedagem robusta para um ecommerce nos passos iniciais. Basta perguntar os itens da tabela ao chat online da hospedagem para verificar se os quesitos técnicos são atendidos. (Recomendamos hospedagens com classificação B ou superior.)

Lista de hosts de acordo com tier

Embora sejam importantíssimos para a velocidade do seu site, fatores como CDN, cache e otimização de imagens não costumam ser um problemão para quem está começando um site, mas esteja ciente que isso tudo irá impactar nos acessos do seu site — e que a Infinite é o único host que te oferece tudo isso de graça!

3) Instale o WordPress e alguns plugins

Aqui na Infinite nós mesmos instalamos o WordPress e outras plataformas para o cliente; basta abrir um ticket e em alguns minutos tudo estará resolvido!

Mas se você for hospedar em outro lugar, é provável que eles tenham algum instalador automático que pode te ajudar a fazer isso sem grandes dores de cabeça e, caso o instalador não baste, você pode clicar aqui e aprender como instalar o WordPress por conta própria.

Tela de notebook coberta com um toldo como se fosse uma loja, trazendo o logo do WooCommerce
Fonte https://www.designlnw.com/

Sendo o teu objetivo instalar o WooCommerce, você precisa ir na sua aba de plugins (Dashboard\Plugins\Adicionar novo) e pesquisar pelo mesmo. Além disso, aproveite e procure pelo:

- Yoast! SEO (para melhorar seus resultados no Google);
- Brazilian Market on WooCommerce (para adaptar sua loja à documentação brasileira);
- E o Correios for WooCommerce (para integrar os correios ao seu ecommerce).

Agora você precisa definir um gateway de pagamento, que poderíamos resumir como a instituição financeira que irá intermediar as compras dos clientes (afinal, ninguém vai depositar dinheiro direto na sua conta).

Abaixo estão os links para os melhores gateways de pagamento para WooCommerce:

- Juno
- MercadoPago
- PagSeguro
- bCash
- MoIP

4) Escolha o tema da sua loja

Agora o seu negócio virtual já tem um endereço e até um edifício virtual, mas por enquanto ela é só tijolos e fiação desencapada…. Chegou a hora de fazer uma bela decoração na sua loja!

Em um cenário ideal, você teria um designer pesquisando a melhor solução para o seu empreendimento digital, mas esse é um processo demorado e custoso, por isso recomendamos um método bem mais fácil: a instalação de um tema de WordPress.

Demonstrativo de uma loja utilizando o tema StoreFront, mostrando um eCommerce com casacos à venda

Loja criada com o tema StoreFront

Os temas (ou themes) são basicamente pacotes de webdesign que montam todo o visual do seu site em questão de segundos, sendo o seu único esforço ajustá-lo à sua marca. (Colocar seu logotipo; links das suas redes sociais; cores do branding et cetera.)

E não pense que isso é bobeira: um tema impacta o seu site tanto quanto uma decoração afeta uma loja física, podendo tanto alavancá-lo (sendo lindo e rápido de carregar) ou mesmo arruiná-lo (sendo feio ou muito lento).

Aqui vão alguns itens de primeira que garantem um bom design e performance para o seu ecommerce:

- Storefront (dos criadores do WooCommerce);
- Hello Theme (dos criadores do Elementor [detalhes mais abaixo])
- OceanWP;
- WP Astra;
- Genesis Framework.

5) Configure & Personalize

Aplicar um tema facilita muito a criação do seu negócio digital, mas há um problema: como milhares de pessoas usam esse mesmo recurso, milhares de sites acabam parecidos demais.

Há duas maneiras de resolver esse problema:

A) Todo tema tem uma aba chamada “Customizar”, que permite adicionar o seu logo, cores da marca, manipular tipografia e vários outros fatores para dar um ar mais único ao seu site. Caso o seu theme seja pago, ele pode até vir com um painel de configuração própria para você customizar tudo do zero!
https://br.support.wordpress.com/personalizador/#como-navegar-no-personalizador

Demonstrativo do Elementor mostrando uma home com a foto de um doughnut

B) Outra maneira seria utilizar o famoso Elementor, que te permite criar e decorar a sua loja virtual do zero, sem precisar gastar dinheiro com um webdesigner ou mesmo programador. Tudo é feito através de um editor visual que descarta a digitação de códigos para criar todo o site do zero!

(Caso você já souber personalizar, pule para o passo 6)

Inspire-se antes de começar

Todo bom designer tem ótimas referências, por isso o primeiro passo é visitar sites como o Pinterest, Dribbble, e Behance para ver como outras grandes lojas digitais se apresentam para o mundo.

Busca por inspiração em sites como Dribbble e Pinterest

Outra dica indispensável é visitar outros ecommerces do mesmo segmento que você, assim você já aprende o que é essencial (e também é proibido) em lojas como a sua.

Conheça o Elementor

O próximo passo é baixar o Elementor, se possível em sua versão paga, e começar a montar a sua nova loja com toda a inspiração que você pegou das suas referências.

Há outros editores visuais para o WordPress, como Beaver Builder, Thrive Architect, Divi e outros, mas nenhum deles é tão simples de usar e multifacetado como o Elementor, por isso não recomendamos trocá-lo por nenhuma das alternativas.

Ah, e se você pretende seguir a nossa dica, utilize o tema Hello pois o mesmo foi criado pela própria equipe do Elementor, o que significa que ambos tema e editor serão perfeitamente compatíveis! (O que nem sempre ocorre com outros temas…)

Cabeçalho e Rodapé

Tela para adicionar novo modelo de cabeçalho no Elementor

Assumindo que você tenha a versão PRO do Elementor, Seu WordPress tem um menu chamado Modelos, onde você pode acessar o Header/Cabeçalho do seu site e fazer algumas customizações.
Caminho: Modelos \ Construtor de Temas \ Cabeçalho

Tela do Elementor para seleção de cabeçalhos prontos

A boa notícia é que o Elementor Pro já vem com alguns modelos prontos para adiantar o seu trabalho, então basta você ativar algum deles e customizar como bem entender.

Caso você queira algo ainda mais original, as dicas abaixo vão te ensinar a criar um belo header do zero, como esse que encontramos no Dribbble:

Cabeçalho Pandora

Customizar uma interface não é nada fácil e você provavelmente irá fazê-la e refazê-la várias vezes caso seja um perfeccionista, mas o importante é que valerá à pena! Veja o exemplo real abaixo:

O rodapé é um pouco mais simples já que ele tende a seguir um padrão de 3 a 4 colunas, contendo o logotipo, categorias de produto, informações gerais e menu de páginas.

Também é bom que ele contenha alguns menus personalizados e páginas de conteúdo (como Dúvidas Frequentes, Termos, etc) para orientar o seu usuário caso ele venha a se perder ao longo das páginas:

Página Inicial

Uma vez que já temos o nosso cabeçalho e rodapé prontos, vamos partir para customizar a página inicial, que é a parte mais impactante e decisiva do seu ecommerce.

A página em si é o que os designers chamam de “ponto de focal”, ou seja: o primeiro lugar que os visitantes irão olhar e tirar conclusões imediatas sobre o seu site — entre elas, se vale à pena continuar navegando.

Vamos ao menu Páginas do WordPress e então criar uma nova página chamada “Inicial”:

Edição de página Inicial de uma instalação WordPress

Dentro do Elementor, vamos construir a página assim como fizemos no Cabeçalho e Rodapé:

Lembre-se sempre que você pode editar tudo o que mostramos como bem entender — e é bem comum que designers refaçam várias partes de seus projetos — por isso não se preocupe caso a sua versão 1 não tenha ficado como você sonhou.

O nosso foco agora é criar um MVP (Produto Minimamente Viável), então segure essa vontade de criar o site perfeito e faça apenas ajustes finais para finalizar o seu trabalho de customização.

Claro que você pode também customizar página de produtos, carrinho, checkout, etc… mas isso vamos deixar para um artigo futuro!

6) Cadastre Seus Produtos

Do que serve uma linda loja sem quaisquer produtos? Chegou a hora de apresentar todos os produtos incríveis que você tem a compartilhar com o mundo!

Como o WordPress é a maior plataforma de sites do mundo, a sua enorme comunidade já criou diversos tutoriais de como cadastrar seus produtos de maneira rápida e simples, como nesse link logo abaixo:
https://www.yogh.com.br/blog/como-adicionar-produto-no-woocommerce/

Prédio do Google mostrando uma grande fachada de vidro e o letreiro "Google"

7) Pense no Google

Você já tem uma loja linda e cheia de produtos incríveis, mas do que adianta se os clientes não visitarem ela?

O SEO — Search Engine Optimization — é a técnica que torna os sites mais fáceis de encontrar no Google. Um site sem SEO é como uma loja bagunçada: imagine um pet shop aberto numa praça de alimentação, com produtos para peixe dentro de gaiolas, e produtos de cachorro com etiquetas de produtos para gatos. Um caos completo!

Otimizar um site não é nada fácil, mas há alguns princípios básicos que você pode seguir e que te ajudarão e muito a ganhar visitantes de graça direto do Google. Confira:
https://rockcontent.com/blog/dicas-de-seo/

Cartão de crédito sendo inserido numa máquina com o logo da Infinite Cloud Computing

Conclusão

Agora você está pronto para ganhar uma grana com um ecommerce prontinho para prosperar, otimizado desde o design até a busca de produtos, resultando numa loja de identidade forte que seus visitantes com certeza manterão no radar.

Se pudéssemos dar duas dicas para você concretizar o seu sucesso de vez: foque na experiência do usuário (desde a qualidade da navegação até o atendimento) e em melhorar seu SEO, assim você logo terá uma loja virtual de bastante sucesso.

E se você precisar de uma bela hospedagem para os seus negócios, lembre-se que você leu todas essas dicas no único host cinco estrelas do Brasil! 🙂

Por Romário Eichlig

Agilista, Product Designer, e escritor formado pela University of West Florida, UNESA, e I.E. Business School.
https://www.linkedin.com/in/eichligromario/