Sou designer e queria saber como é a estrutura dos arquivos dos Templates?

Estrutura do template

Os templates do sistema Boxloja possuem os seguintes arquivos:

• template.html
• index.html
• pagina.html
• item.html
• produto.html
• destaques.html
• loja.css

Um breve resumo de cada arquivo:

template.html
Principal arquivo da estrutura de arquivos. É ele quem chama os demais arquivos e que também define como o layout da loja será. Também carrega o arquivos de estilo (css) e javascripts que farão a loja funcionar corretamente. Este arquivo pode icluir os arquivos index.html, pagina.html ou produto.html, dependendo da ação do cliente.

index.html
Carregado apenas na página de entrada da loja e é usado para exibir banner e slideshow. Este arquivo inclui o arquivo pagina.html.

pagina.html
Dependendo do conteúdo acessado, este arquivo exibe uma página de texto ou uma coleção de produtos. Este arquivo inclui o arquivo item.html.

item.html
Usado para exibir um único ítem do catálogo de produtos. Este arquivo é usado por todos os demais.

produto.html
Exibe o detalhamento completo de um produto selecionado, bem como produtos recomendados a partir desse.

destaques.html
Usado para estruturar o componente especial “Produtos de uma categoria”.

loja.css
Estilo CSS geral da loja.

Esses arquivos possuem uma hierarquia bem definida e que vai depender da ação realizada pelo usuário. As principais ações são:

• Acessar a página inicial da loja.
• Acessar uma categoria.
• Acessar uma página de texto da loja.
• Acessar um produto do catálogo.

 

Página inicial

Quando um cliente acessa sua loja pelo endereço personalizado, por exemplo www.sualoja.com.br, a página inicial é carregada com a estrutura abaixo. Nesta página, você pode exibir um banner e/ou um slideshow para o usuário.

 

Categoria (ou busca de produtos)

Para exibir os produtos de uma categoria, o sistema carrega a seguinte estrutura de arquivos:

Observe que o arquivo index.html desta vez NÃO foi carregado (já que não iremos mais exibir o banner e nem slideshows nesta visualização). Essa estrutura também é a mesma que será carregada quando o cliente realizar uma busca por produtos em sua loja.

 

Página de texto

Caso o cliente queira ler, por exemplo, suas políticas de trocas e devoluções ou algum outro texto informativo da loja, então, a estrutura carregada será praticamente a mesma da ação anterior, entretanto, a lógica para exibição de produtos ou texto está definida no arquivo apenas no arquivo pagina.html.

 

Produto

Quando o cliente deseja exibir o detalhamento de um produto de sua loja, então a estrutura de arquivos carregada será a seguinte:

O arquivo produto.html possui toda lógica de variações e será o responsável por adicionar o produto ao carrinho de compras da loja.

 

Arquivo item.html

Este arquivo foi adicionado recentemente nos templates mais modernos e é um arquivo bastante especial pois contém a lógica completa de exibição para um único item do catálogo, por exemplo, preço promocional, esgotado, preço sob consulta, valor de parcelamento ou desconto para pagamento a vista, etc.

Observe que o arquivo destaques.html também pode fazer uso do arquivo item.html em alguns templates mais modernos.

Nossa equipe trabalha constantemente para deixar a arquitetura de templates ainda mais simples mas sem perder a grande flexibilidade de customização que você só encontra no sistema Boxloja de loja virtual.