Labels – Gerenciador de Selos para a
Loja Virtual.
Com o Recurso Labels, você pode controlar de maneira fácil e prá?ca Selos promocionais para seus produtos e categorias.
Cadastre imagens e textos e aplique-‐os de maneira massiva em produtos ou categorias. Você pode inclusive criar regras para a inserção automá?ca de selos com condições especiais.
Siga o tutorial para entender melhor a ferramenta.
1 1.1 1.2 1.3 2 2.1
Labels do Sistema
Insira Selos que funcionam de maneira automá?ca para Promoções, Estoque e Lançamentos.
Adicionando um Label de Sistema – Promoção
Adicionando um Label de Sistema – Estoque
Adicionando um Label de Sistema – Lançamento
Labels Customizados
Insira Selos de acordo com condições personalizadas
Adicionando um Label Customizado
1. Labels do Sistema
Por padrão, a ferramenta Labels oferece três ?pos de Selos que podem ser usados com base em condições pré determinadas:
Selos de Promoção: São selos que destacam uma condição promocional. Através das variáveis u?lizadas, é possível capturar a promoção de maneira automá?ca e exibi-‐la no selo dinamicamente.
Selos de Estoque: Selos que destacam a quan?dade de itens restante no estoque da loja.
Selos de Lançamento: Exibido em produtos considerados como Novidades da Loja Virtual.
1.1 Adicionando um Label de Sistema -‐ Promoção
Para adicionar um Label de Sistema, acesse Catálogo > Label dos Produtos > Labels do Sistema
Ilustração 1: Menu Labels do Sistema
1. Labels do Sistema
Na página que deverá se abrir, clique em Adicionar Label de Promoção.
Ilustração 2: Labels do Sistema
3
Comece preenchendo as informações da Guia Informações Gerais
1.1 Inserindo um Label de Sistema -‐ Promoção
Indexação de Produtos: Mantenha como HABILITADO para que os produtos
elegíveis sejam indexados pelo Recurso Labels.
Nome: Dê um nome de iden?ficação ao Label. Esse nome é usado apenas
internamente.
Status: Mantenha como HABILITADO para que o Label criado seja exibidos no
catálogo e na página de produto.
A próxima aba é Conteúdo (Página do Produto). Todas as configurações dessa Aba correspondem à exibição do Label na Página de Produto
Posição: Define a área onde o Label será exibido.
Imagem: Clique no botão Selecionar Arquivo para escolher a imagem que será
usada como Label. No caso de Labels do Sistema, o ideal é u?lizar apenas uma imagem de fundo, sem texto. O texto será preenchido no campo seguinte.
image Text: Aqui vai o conteúdo de texto do Selo. Nesse espaço, podem ser usadas
variáveis que capturam informações do sistema. Das variáveis disponíveis, as mais importantes para os selos promocionais são:
#discount_amount# : Valor de desconto aplicado no produto. #special_price# : Preço Especial
#special_date# : Data Especial #final_price# : Preço Final #price# : Preço
Exemplo de aplicação da variável: Se desejo exibir, no Label de Promoção, que meu produto tem 10% de Desconto, no campo Image Text posso inserir:
A par?r dessa configuração, meu selo exibirá o texto Economize 10 %! O valor de 10 será capturado automa?camente pela variável #discount_percent#.
Naturalmente, é necessário que o produto de fato tenha uma Promoção de 10% de desconto configurada. Caso contrário, não haverá valor para ser capturado pela variável.
PosiJon Style: U?lize valores da propriedade CSS Posi?on para alterar o
posicionamento do Selo.
EsJlo da Fonte: U?lize valores da propriedade CSS Font para personalizar o texto
do Label.
Round Method: Defina o arredondamento de valores quebrados. Caso uma
variável capture um desconto de, por exemplo, 9,84%, ele deve ser arredondado de que forma? Selecione:
1.1 Inserindo um Label de Sistema -‐ Promoção
Ilustração 6: Seleção do Método de Arredondamento
Arredondar: Defina o nível de detalhamento de casas decimais para exibição de
valores no label:
A próxima aba é Conteúdo (Página de Categoria). Essa guia é exatamente igual à guia anterior, entretanto, as configurações definidas aqui afetarão as Páginas de Categoria.
Ilustração 8: Guia Conteúdo (Página de Categoria)
Nesse exemplo, apenas repe?mos as configurações nas duas Guias (Produto e Categoria).
Finalmente, na guia Produtos Indexados é possível visualizar a relação de produtos para os quais o Label será aplicado. Por tratar-‐se de um Label de Promoção,
estarão elencados nessa lista os Produtos da Loja Virtual para os quais uma Regra
de Promoção está configurada.
Ilustração 9: Relação de Produtos Indexados
A seguir, a visualização do Label com as configurações desse exemplo, no front end da Loja:
Ilustração 10: Label na Página de Catálogo
Agora, adicionaremos um Label de Estoque. Na página de Labels do Sistema, clique em Adicionar Label de Estoque.
Ilustração 11: Labels do Sistema
1.2 Inserindo um Label de Sistema -‐ Estoque
3
Comece preenchendo as informações da Guia Informações Gerais
Indexação de Produtos: Mantenha como HABILITADO para que os produtos
elegíveis sejam indexados pelo Recurso Labels.
Nome: Dê um nome de iden?ficação ao Label. Esse nome é usado apenas
internamente.
Status: Mantenha como HABILITADO para que o Label criado seja exibido no
catálogo e na página de produto.
A próxima aba é Conteúdo (Página do Produto). Todas as configurações dessa Aba correspondem à exibição do Label na Página de Produto
Posição: Define a área onde o Label será exibido.
Imagem: Clique no botão Selecionar Arquivo para escolher a imagem que será
usada como Label. No caso de Labels do Sistema, o ideal é u?lizar apenas uma imagem de fundo, sem texto. O texto será preenchido no campo seguinte.
Image Text: Aqui vai o conteúdo de texto do Selo. Nesse espaço, podem ser usadas
variáveis que capturam informações do sistema. Para Labels de Estoque, u?liza-‐se a variável #stock_item# , que exibe automa?camente a quan?dade de itens em estoque.
Exibir se o Estoque é Menor que: Estabeleça o número de unidades em estoque a
par?r do qual o Label será exibido.
Habilitar Label de Sem Estoque: Selecionando SIM, um Label alterna?vo será
exibido quando o estoque dos produtos chegar a zero.
Imagem de Sem Estoque: Caso tenha habilitado a exibição no item acima, clique
no botão Selecionar Arquivo para fazer upload da imagem a ser usada no Label Sem Estoque
Texto de Sem Estoque: Preencha aqui o conteúdo a ser exibido no Label dos
produtos com estoque zero.
PosiJon Style: U?lize valores da propriedade CSS Posi?on para alterar o
posicionamento do Selo.
EsJlo da Fonte: U?lize valores da propriedade CSS Font para personalizar o texto
do Label.
Round Method e Arredondar: Defina o arredondamento de valores quebrados.
Essas opções raramente são aplicáveis à Labels de Estoque
A próxima aba é Conteúdo (Página de Categoria). Todas as configurações dessa Aba correspondem à exibição do Label na Página de Categoria
Ilustração 14: Guia Conteúdo (Página de Categoria)
Nessa aba, repe?mos as configurações da Página de Produto, fazendo apenas pequenos ajustes em PosiHon Style e EsHlo da Fonte, para melhorar a exibição do Label na Categoria.
Finalmente, na guia Produtos Indexados é possível visualizar a relação de produtos para os quais o Label será aplicado.
Ilustração 9: Relação de Produtos Indexados
A seguir, a visualização do Label com as configurações desse exemplo, no front end da Loja:
Ilustração 16: Label de Estoque na Página de Categoria
Agora, adicionaremos um Label de Estoque. Na página de Labels do Sistema, clique em Adicionar Label de Lançamento.
Ilustração 17: Labels do Sistema
1.3 Inserindo um Label de Sistema -‐ Lançamento
3
Comece preenchendo as informações da Guia Informações Gerais
Indexação de Produtos: Mantenha como HABILITADO para que os produtos
elegíveis sejam indexados pelo Recurso Labels.
Nome: Dê um nome de iden?ficação ao Label. Esse nome é usado apenas
internamente.
Status: Mantenha como HABILITADO para que o Label criado seja exibido no
catálogo e na página de produto.
A próxima aba é Conteúdo (Página do Produto). Todas as configurações dessa Aba correspondem à exibição do Label na Página de Produto
Posição: Define a área onde o Label será exibido.
Imagem: Clique no botão Selecionar Arquivo para escolher a imagem que será
usada como Label. No caso de Labels do Sistema, o ideal é u?lizar apenas uma imagem de fundo, sem texto. O texto será preenchido no campo seguinte.
Image Text: Aqui vai o conteúdo de texto do Selo. Nesse espaço, podem ser usadas
variáveis que capturam informações do sistema. Para Labels de Estoque, u?liza-‐se a variável #stock_item# , que exibe automa?camente a quan?dade de itens em estoque.
PosiJon Style: U?lize valores da propriedade CSS Posi?on para alterar o
posicionamento do Selo.
EsJlo da Fonte: U?lize valores da propriedade CSS Font para personalizar o texto
do Label.
Round Method e Arredondar: Defina o arredondamento de valores quebrados.
Essas opções raramente são aplicáveis à Labels de Lançamento
A próxima aba é Conteúdo (Página de Categoria). Todas as configurações dessa Aba correspondem à exibição do Label na Página de Categoria
Ilustração 20: Guia Conteúdo (Página de Produto)
Nessa aba, repe?mos as configurações da Página de Produto, fazendo apenas pequenos ajustes em PosiHon Style e EsHlo da Fonte, para melhorar a exibição do Label na Categoria.
Finalmente, na guia Produtos Indexados é possível visualizar a relação de produtos para os quais o Label será aplicado.
Ilustração 9: Relação de Produtos Indexados
A seguir, a visualização do Label com as configurações desse exemplo, no front end da Loja:
2. Gerenciar Labels
Além dos Labels de Sistema, cujo comportamento é restrito à condições pré-‐ determinadas, é possível inserir Labels customizados e parametrizados de acordo com condições estabelecidas livremente.
2.1 Adicionando um Label Customizado
Para adicionar um Label Customizado, acesse Catálogo > Label dos Produtos > Gerenciar Labels
Ilustração 1: Menu Labels do Sistema
Na página que deverá se abrir, clique em Adicionar Labels.
Ilustração 2: Labels do Sistema
2.1 Adicionando um Label Customizado
3
Comece preenchendo as informações da Guia Informações Gerais
Indexação de Produtos: Mantenha como HABILITADO para que os produtos
elegíveis sejam indexados pelo Recurso Labels.
Nome: Dê um nome de iden?ficação ao Label. Esse nome é usado apenas
internamente.
Status: Mantenha como HABILITADO para que o Label criado seja exibido no
catálogo e na página de produto.
A próxima aba é Conteúdo (Página do Produto). Todas as configurações dessa Aba correspondem à exibição do Label na Página de Produto
Posição: Define a área onde o Label será exibido.
Imagem: Clique no botão Selecionar Arquivo para escolher a imagem que será
usada como Label. No caso de Labels do Sistema, o ideal é u?lizar apenas uma imagem de fundo, sem texto. O texto será preenchido no campo seguinte.
Image Text: Aqui vai o conteúdo de texto do Selo. Nesse espaço, podem ser usadas
variáveis que capturam informações do sistema. Como esse exemplo é para a inserção de um Label de Marca, as variáveis não se aplicam.
PosiJon Style: U?lize valores da propriedade CSS Posi?on para alterar o
posicionamento do Selo.
EsJlo da Fonte: U?lize valores da propriedade CSS Font para personalizar o texto
do Label.
Round Method e Arredondar: Defina o arredondamento de valores quebrados.
Essas opções não serão aplicáveis nesse exemplo.
A próxima aba é Conteúdo (Página de Categoria). Todas as configurações dessa Aba correspondem à exibição do Label na Página de Categoria
Ilustração 20: Guia Conteúdo (Página de Categoria)
Agora, devemos definir as condições para exibição do Label Customizado. Nesse exemplo, a intenção é fazer com que todos os produtos da Marca Converse exibam o Label “Converse Original”.
Portanto, primeiro adicionamos a Condição Marca:
Ilustração 21: Condições
Em seguida, especificamos a marca Converse:
2.1 Adicionando um Label Customizado
Em Produtos Indexados, é possível visualizar os produtos elegíveis para exibição do Label:
Ilustração 23: Produtos Indexados
A seguir, exemplo de visualização do Label em Página de Produto e Categoria:
Ilustração 24: Label na Página de Produto