Como adicionar arquivo de modelo no BigCommerce

O BigCommerce sabe que o design do seu site pode fazer toda a diferença no mundo. A vida do usuário médio é agitada.

Carrinhos de compras abandonados não são inéditos no comércio eletrônico. No entanto, se o seu site mantiver melhor a atenção do cliente, ele poderá concluir a compra antes de mudar de guia ou sair para fazer alguma coisa.

Então, tudo se resume ao design e aos templates que você usa em sua loja.

Descubra como você pode assumir o controle do design da sua loja de comércio eletrônico usando o BigCommerce.

Como adicionar arquivos de modelo ao BigCommerce

Você pode adicionar modelos ao BigCommerce das seguintes maneiras:

Loja BigCommerce

O BigCommerce hospeda uma loja com uma variedade de temas prontos para instalação. O preço deles varia de grátis até US$ 300. Os temas podem ser classificados por coleção, setor, conteúdo gratuito e premium.

Ao encontrar um de que goste, clique no botão Instalar ou Comprar. Cada visualização do tema vem com uma lista de recursos e também para que está otimizado. Você também pode obter uma prévia de cada tema antes de clicar no botão Instalar.

Personalização via Stencil

O estêncil é a estrutura sobre a qual os temas do BigCommerce são construídos. No entanto, você não precisa necessariamente usar um de seus temas para o seu negócio. Você também pode atribuir modelos de layout personalizados para diferentes partes da sua loja, incluindo:

• produtos
• Marca
• Categoria
• Página

Se personalização é o que você procura, você precisa começar criando e agrupando modelos personalizados com a ferramenta Stencil CLI do BigCommerce. Quando estiver pronto, há algumas opções para preparar seu arquivo para upload via Stencil CLI:

1. Apenas pacote

Use o comando “stencil bundle” para criar um arquivo zip que você pode enviar para sua loja BigCommerce. Se você quiser verificar o progresso e a conclusão do seu arquivo, use o comando “bundle”. Este comando também permite que você saiba sobre quaisquer erros que possam impedir o empacotamento do arquivo.

Lembre-se também de que o BigCommerce tem um limite rígido de 50 MB para tamanhos de arquivo.

2. Agrupar e empurrar

Use o comando “stencil push” apenas se você inicializou com um token Stencil CLI. Usar este comando agrupará e fará upload em um processo. No entanto, se você não tiver certeza se o seu arquivo se qualifica para “pacote e envio”, verifique primeiro estes requisitos:

• Tema inicializado usando token Stencil CLI com “Temas: modificar escopo”
• Instalou uma versão do Stencil CLI 1.12.0 ou superior

Você pode verificar sua versão do Stencil usando o prompt “stencil -V” ou “stencil –version” na linha de comando.

Nem todo mundo pode fazer upload de um tema em um único processo. Se você estiver agrupando e enviando em um processo separado, veja como enviar o tema para o BigCommerce:

• Após o upload com sucesso, escolha S/N para fazer upload do tema para sua vitrine
• Se sim, use as teclas de seta para escolher a variação

Depois de escolher “Y”, você terá que escolher suas variações imediatamente. Se desejar aplicar o novo upload à sua loja posteriormente, selecione “N”.

Como faço para personalizar um modelo BigCommerce

Para personalizar um tema legado do Blueprint, confira estas etapas:

• Vá para a vitrine
  
• Clique em Meus Temas
  
• Selecione Editar HTML/CSS
  
• Faça alterações de cores na tela do editor Default.html
• Salvar alterações

É importante observar que, se quiser usar esse método, você só poderá acessar os arquivos de modelo do Blueprint se eles estiverem ativos na vitrine.

Se você estiver usando um tema Stencil, siga estas instruções para personalização:

• Vá para a vitrine
  
• Clique em Meus Temas
  
• Selecione Personalizar
  
• Faça mudanças
• Selecione Publicar para que as alterações apareçam na sua vitrine

Ao usar o Page Builder para personalizar seus temas do Stencil, você pode alterar vários aspectos, como tamanho e cores do texto. Você também pode adicionar diferentes elementos visuais, como banners, carrosséis e imagens usando um método fácil de arrastar e soltar. Alternativamente, você pode usar os blocos de HTML personalizado para fazer as alterações necessárias.

Lembre-se apenas que você pode salvar sem publicar as alterações que aparecerão na sua vitrine.

Onde encontrar modelos do BigCommerce

Um dos lugares mais simples para encontrar novos modelos do BigCommerce é em sua loja. Eles têm diferentes estilos de temas disponíveis para atender à maioria das necessidades, e muitos de seus estilos mais populares não custam um centavo!

Alguns sites de terceiros também vendem modelos compatíveis com BigCommerce. Esses modelos podem variar de preço, portanto, esteja preparado para gastar algum dinheiro se seguir esse caminho.

Claro, você sempre pode ter um modelo personalizado para sua loja. Esta é de longe a opção mais cara, então você pode querer verificar todos os outros caminhos antes de olhar para este.

Como editar modelos HTML para BigCommerce

Existem algumas maneiras de editar um modelo HTML se você estiver usando um tema Blueprint. Para editar um tema ativo em seu navegador:

• Vá para sua vitrine
  
• Clique em Meus Temas
  
• Selecione Editar HTML/CSS
  

Editar no seu navegador é uma ótima maneira de fazer alterações rápidas e simples. Tudo o que você salva no editor é publicado imediatamente.

Como usar o Stencil para adicionar um único arquivo de layout de modelo personalizado no BigCommerce

Se você precisar de um modelo personalizado dentro da estrutura Stencil, o BigCommerce também permite que você faça isso. Primeiro, você precisa configurar sua cópia local:

• Crie o subdiretório personalizado no diretório “templates/pages”
• Crie os arquivos de modelo HTML e coloque-os nos subdiretórios personalizados
• Edite e mapeie URLs para seu arquivo “.stencil”

Quando terminar de criar seu tema localmente, você pode agrupar e enviar o arquivo para o BigCommerce.

Perguntas frequentes adicionais

Como posso criar novos modelos para BigCommerce?

Você pode instalar o Stencil CLI para personalizar modelos localmente e agrupá-los para upload nas lojas.

Como atualizo minha página inicial do BigCommerce?

Sua página inicial contém uma combinação de widgets e banners. Você pode optar por ativá-los ou desativá-los. Ou você pode ir em Marketing e depois em Banners para criar um banner para a página inicial.

Além disso, você pode simplesmente criar uma nova página da web e marcar a caixa para verificar se deseja exibi-la como a página inicial da sua loja.

O que é estêncil no BigCommerce?

O estêncil é a estrutura de tema que o BigCommerce usa para permitir que os usuários escolham entre usar modelos de comércio eletrônico ou personalizar completamente um site.

Como edito um tema do BigCommerce?

Depende do tipo de tema que você está usando. Se você estiver usando um tema legado do Blueprint, estas são as etapas para editá-lo:

• Na sua vitrine, clique em Meus temas

• Clique no botão Editar HTML/CSS

• Faça alterações de cores na tela do editor Default.html

• Clique no botão Salvar quando terminar as alterações

Se você estiver usando um tema Stencil, siga estas etapas:

• Vá para a vitrine

• Selecione Meus Temas e depois Personalize

• Faça mudanças

• Clique em Publicar para que as alterações apareçam na sua vitrine

Como faço para personalizar meu modelo BigCommerce?

Suas opções de personalização dependem do tipo de modelo que você está usando. Em geral, você pode ir até sua vitrine e depois Meus temas. A partir daí, você pode selecionar “Editar HTML/CSS” ou “Personalizar” para fazer suas alterações.

Não se contente com uma loja genérica

Claro, você pode usar um modelo para colocar sua loja em funcionamento. No entanto, você também correrá o risco de parecer com outras vitrines. Ou pior ainda, pode parecer a loja online do seu concorrente!

No entanto, com alguns ajustes simples, você pode personalizar sua vitrine para torná-la tão única quanto seu negócio. Brinque com cores, fontes e imagens até conseguir uma loja que você tenha orgulho de chamar de sua.

Você personalizou seus modelos do BigCommerce? Conte-nos sobre isso na seção de comentários abaixo.