Black Friday - Página Exclusiva
12 min
Criado por Marina Peres em 23/10/2023 11:15
Atualizado por Willian Borges em 25/10/2023 09:00

Olá, nesse tutorial vamos aprender sobre página exclusiva black friday além de selos, ofertas e banner.



Para a criação da página primeiro será necessário o desenvolvimento de uma coleção.

Em seu console, vá em Catálogo > Coleção


Vá em + para criar uma nova coleção.



Na aba "Padrão" é necessário inserir o nome da coleção (não podendo ser o mesmo que marca, ou categoria), 
A opção "Exibir na loja" será a ultima etapa que iremos habilitar.
No campo "atualização automática" pode ser habilitado quando utilizamos o marketplace caso queira que a coleção seja atualizada automaticamente conforme os filtros inseridos, nós não iremos habilitar.


Na aba "Filtros" é possível controlar se deseja inserir produtos de uma determinada marca, categoria e faixas de valores. Entretanto, nós não vamos utilizar quaisquer filtro, mantenha o valor zerado.



Na aba "SEO" os campos título da página, e URL são gerados automaticamente com base no nome da coleção, mas podem ser personalizados (não podendo conter caracteres especiais, ou igual a outra já existente).
Em "meta de description" deve ser preenchido uma breve descrição para os motores de busca e "meta keyword" são palavras chaves para os motores de busca, utilize o "tab" ou a "vírgula" para inserir mais de uma palavra.


Em "Detalhes" é possível inserir todos os detalhes da coleção, o campo aceita texto corrido e também html.


Na aba "Adicionar sku's" é possível adicionar produtos manualmente, clique em "adicionar outro adicionar sku" utilize a lupa para procurar sku desejados. Em nosso exemplo vamos utilizar o método de importação assim conseguimos vincular muitos produtos de uma só vez.


A aba de "Remover sku" é utilizado para excluir determinado itens da coleção ou seja os produtos inseridos nesse local não será exibido na coleção.

Vamos conferir os dados e clica em salvar e continuar editando, recebemos uma mensagem que a coleção foi criado com sucesso.


Agora vamos importar os skus selecionado, clique em "Importar arquivos" nessa opção é possível importar das seguintes maneiras: ID do SKU, ID do produto, Código do EAN, Código de referência do ERP.
Vamos obter o ID do SKU, clique "Escolher arquivo" navegue pelo seu sistema e selecione o arquivo que seu time preparou, lembrando que o arquivo deve estar na extensão TXT e conter um código por linha, após selecionado o arquivo clique em "Importar", caso esteja tudo certo vamos receber uma mensagem de sucesso. Clique no "X" para fechar a tela de importação.

Habilite a opção "Exibir na loja" e clique em "salvar", com isso nossa coleção de produto irá iniciar um processo de indexação. 

Agora vamos aprender como organizar e fazer upload de todas as mídias do black friday para sua loja.



Em seu console navegue por "CMS" e clique sobre "Media Server" esse é o local que fica armazenado os arquivos em sua loja, utilizado o campo de busca e procure por Banner, caso não exista nenhuma pasta de Banner clique em "+ nova pasta", caso ja exista acesse a pasta. Pensando em ter uma organização melhor clique em "Nova pasta" e defina o nome para a pasta, clique no botão "Salvar" e clique sob a nova pasta e selecione a opção "Carregar" na sequencia em "Upload" navegue pelo sistema e selecione todos as imagens referente a black friday. Aguarde finalizar o upload das imagens e volte um nível clicando na pasta, desta forma temos todas as imagens salvas no media server.


Agora vamos configurar os banner, em seu console navegue em "Vitrines" e clique em "Vitrines" procure seu top banner e clique sobre ele, vamos configurar uma data para desativar os banner que estão ativos na loja, e vincular os banner exclusivos da black friday.
Clique na aba "imagens", primeiro vamos definir um horários de termino para todas as imagens referente a outros banner, no primeiro item clique sob dele e informe uma data de termino, informe a data e a hora de termino para a virada da black friday, vamos replicar para os demais do top banner. Agora podemos iniciar vincular as novas imagens do black friday, iremos utilizar duas imagens uma para mobile/desktop mais fique a vontade para utilizar quantas imagens for necessárias. Vamos começar pela imagem do "desktop", clique em adicionar nova imagem e selecione nova opção, em titulo aconselhamos sempre preencher, em "imagem" clique na lupa vamos navegar pelos arquivos media server e selecione a imagem desejável, em "link" selecione a coleção que criamos, se necessário navegue pelo console para consultar o link clicando em pelo "ver no site". A opção a baixo "abrir link em uma nova janela" está atrelada ao link fazendo que o novo direcionamento seja aberto uma nova janela ou guia no navegar
Na "cor de fundo" caso sua imagem não ocupe toda a tela de exibição do cliente será exibido a cor selecionada ou a cor padrão assume transparente.
Em "imagem de fundo" tem a mesma mecânica da cor porém irá assumir uma imagem como fundo.
Em "repetir" não iremos utilizar.
Em "style" é utilizado para aplicar tributos CSS na imagem.
Em "classes" é quando a imagem for exclusiva para o mobile utilizar "M", nesse exemplo esta imagem será para desktop, ou seja não é necessário informar.
A opção de "ativo" é responsável por controlar a exibição da loja, configurando data e hora para ativar e desativas os bannes, única diferença do procedimento anterior é que iremos informar um "M", no campo de classe.
Confirma todos as informações do banner, caso estiver tudo certo clicar em "salvar". 

Agora vamos criar o "selo"

Em seu console, vá até Catálogo > Selos.


Clique em "+" para a criação de um novo selo.

Texto de Selo:
Dê um título intuitivo para que a sua equipe localize mais facilmente o seu selo.
Em "texto" é onde irá inserir o texto que quer que apareça no selo para o cliente.
Em "tamanho do texto" colocar o tamanho desejável.
Para "cor de texto" é possível inserir a cor que deseja inserir na fonte do texto.
Em "estilo do texto" é possível inserir texto em negrito, itálico ou sublinhado.


Aparência do Selo:
"Posição" você pode inserir onde deseja que seja visualizado na listagem dos produtos. (Caso deseje que o selo não seja exibido na imagem do produto clique sobre limpar posição para voltar para a posição padrão).
Em "arredondamento" é possível definir o contorno do selo, e a forma que deseja que seja exibido.
Em "cor de fundo" é possível inserir uma cor para que apareça no fundo do seu selo.
Também possível inserir uma imagem em seu selo, é necessário apenas que já tenha a imagem criada em seu console.
Em "largura" e "altura" são definidos medidas que deseja inserir em seu selo.
Em "espaçamento horizontal" é para controlar o espaço do texto com bordas da horizontal e "espaçamento vertical" é o espaço do texto com bordas da vertical, podendo utilizar o valor de 0 a 5.


Após inserir todas as informações, salve. É necessário vincular em uma oferta para que seja visível em sua loja.

Vá em Ofertas > Promoções regulares, vá em "+" e insira um nome intuitivo para o seu time.


Insira o nome, data e descrição da oferta, insira um efeito para que possa inserir em todos os produtos de escolha no site.
Informe a data de inicio e fim da oferta, e informe o valor de desconto, em nosso exemplo não será necessário pois é para apenas a aplicação do selo.


Insira o selo criado anteriormente e salve a oferta.

Em "valor" para o nosso exemplo vamos utilizar 10, ou seja, está oferta irá aplicar 10% de desconto em cada produto participante.
E em selecione em quais itens essa promoção será aplicada podendo escolher em qual marca, categorias, coleções ou SKUS`s esta oferta será aplicada.
Vamos aproveitar a Coleção que criamos com os produtos selecionados para que o desconto seja aplicado exclusivamente nesses produtos. Utilize a lupa e selecione a coleção de "Black Friday"
Na aba de "Condições", é responsável por definir condições para a Oferta funcionar. Para o nosso exemplo não iremos configurar nenhuma condição.
Em "Restrições e Limitações",é possível definir regras para limitar o funcionamento da oferta, não iremos utilizar nenhuma restrição para o nosso exemplo.
Na aba de "Cupons", aqui é possível configurar o uso de cupom. Para o nosso exemplo, não vamos utilizar.
Vamos conferir os dados preenchidos e se estiver tudo certo, ative a oferta e clique em SALVAR.




Aqui está um exemplo de como ficou os novos banners para a Black Friday, e a nossa página exclusiva com os produtos.
Você também pode adquirir um layout exclusivo para a Black Friday como as trocas das cores, banners para a web e mobile e selo. Procure nosso departamento comercial para um orçamento! 
Acesse nossos artigos e vídeos para outros tutoriais. Até a próxima!

O que você achou deste artigo?
Últimos artigos visitados