Manual de instalação
Coleção Soft Pro
- Introdução
Bem-vindo ao guia completo de configuração do tema para sua loja! Neste manual, você encontrará todas as instruções necessárias para realizar as configurações dentro do painel administrativo da sua loja e garantir a instalação completa do tema.
Certifique-se de ler todo o conteúdo deste documento e seguir cuidadosamente cada passo para garantir que seu tema seja instalado e configurado corretamente. Este tema foi cuidadosamente desenvolvido com um layout pré-determinado em mente, e ao final deste guia, você será capaz de configurá-lo na sua loja exatamente como foi apresentado no momento da aquisição.
Siga adiante e transforme a aparência da sua loja com o nosso tema exclusivo e totalmente personalizável!
Suporte
Para garantir que suas dúvidas sejam prontamente atendidas, disponibilizamos suporte exclusivamente por Whatsapp e e-mail, através de chamados. Para obter assistência, basta acessar nossa página de suporte de temas, onde você encontrará respostas rápidas para perguntas comuns e a opção de abrir um chamado para entrar em contato conosco, caso necessário.
Se precisar de suporte relacionado à plataforma, recomendamos acessar a Central de Atendimento.
Além disso, sugerimos visitar a Central de Atendimento da plataforma, onde você encontrará uma ampla variedade de artigos e instruções sobre como configurar sua loja.
TEMAS CÓPIAS E TEMAS COM EDIÇÕES HTML, NÃO RECEBEM ATUALIZAÇÕES, SOMENTE O TEMA ORIGINAL. RECOMENDAMOS FAZER UMA CÓPIA PARA BACKUP, PORÉM FAZER TODAS AS EDIÇÕES NO TEMA ORIGINAL.
Garantia
A garantia de suporte gratuito é válida por um período de 6 meses após a compra do tema. Para solicitar assistência, entre em contato com nossa equipe de suporte através da Central de Ajuda e Suporte.
O suporte inclui:
– Esclarecimento de dúvidas sobre o tema e suas configurações.
– Correção de possíveis bugs e comportamentos incorretos do tema.
– Suporte sempre considerando a versão mais recente do tema.
Por favor, observe que o suporte não cobre:
– Processo de instalação do tema.
– Cadastro ou configurações no painel do lojista.
– Recursos da plataforma que não são nativos do tema.
– Customizações e melhorias do tema.
– Cópias do tema ou versões com edições no código HTML e CSS principal.
– Garantia e atualizações de performance da loja e pontuação de pagespeed.
– Lojas onde o logo da Softcommerce foi removido do rodapé.
Se precisar de assistência dentro das diretrizes de suporte, não hesite em entrar em contato conosco. Estamos aqui para ajudar!
- Instalação do Tema
Após a confirmação do pagamento do tema, você poderá publicá-lo em sua loja virtual.
Siga o passo a passo:
1ª Acesse sua loja virtual.
2º Vá para “Configurações”.
2º Na aba “Minha loja” clique em “Editar layout”.
3º Localize o tema “Soft Pró Theme”.
4º Por fim, clique em “Publicar”.
Recomendamos que faça todas as alterações desejadas de cores e banners antes de publicar o tema. Isso evita mal funcionamento do tema, especialmente se já estiver realizando vendas.
Lembre-se de salvar as alterações para garantir que sua loja virtual esteja sempre atualizada. Pode haver um período de cache da plataforma de pelo menos 30 minutos para as mudanças serem aplicadas.
- Minha loja
Na aba “Minha loja” você irá editar informações básicas sobre loja, como: canais de atendimento, redes sociais, e a logo da sua marca.
Painel da plataforma > Configurações > Minha loja > Editar layout > Editar tema > Minha loja
Logo: Escolha a logo para desktop e mobile e demais campos, seguindo o tamanho recomendado.
Redes sociais: Cadastre a URL completa de cada perfil das suas redes sociais.
– (X) Twitter
– Youtube
– TikTok
Informações de contato: cadastre suas informações de contato, será exibido no cabeçalho e rodapé da loja.
– Telefone 01
– Telefone 02
– Horário de atendimento
– Endereço da loja
- Cores
Painel da plataforma > Configurações > Minha loja > Editar layout > Editar tema > Cores
Personalize as cores utilizadas no seu tema de acordo com a sua preferência. Defina nas abas as cores do seu tema e dos elementos da página. Clique no campo de cor para abrir o disco de seleção de cores ou informe o código hexadecimal da cor desejada. Saiba mais sobre código hexadecimal aqui.
Caso você queira uma personalização de cores mais básica, basta preencher só as cores na aba “Cores gerais do tema”. Se você quer mudar cores específicas, em cada aba você encontra campos para definir as cores. Caso não queira colocar nenhuma cor e aplicar as cores padrão, deixe o campo sem nenhum conteúdo, inclusive o #.
- Configurações
Na aba “Configurações” encontram-se todas as definições estruturais e funcionais responsáveis pelo comportamento visual e estratégico da loja virtual. As configurações disponíveis permitem personalizar desde aspectos estéticos como tipografia, estilo dos elementos e exibição de vitrines até funcionalidades comerciais que impactam diretamente a conversão, o ticket médio e a experiência do usuário.
Por meio deste painel, é possível ajustar recursos como compra rápida, carrinho lateral, barra de frete grátis, exibição de selos promocionais, contador regressivo, mensagens personalizadas, popups de captação e regras específicas de visualização de preços. Cada opção foi desenvolvida para oferecer flexibilidade e controle, permitindo que a loja seja adaptada de acordo com o modelo de negócio, seja ele B2C, B2B ou híbrido.
Além disso, o ambiente de configurações possibilita a personalização de textos estratégicos, definição de gatilhos de exibição de popups, controle de alertas de estoque e aplicação de regras adicionais de CSS, garantindo maior autonomia na gestão do layout sem a necessidade de alterações diretas no código do tema.
Recomenda-se que as configurações sejam revisadas de acordo com a estratégia comercial da loja, considerando fatores como posicionamento de marca, público-alvo, objetivos de conversão e campanhas promocionais vigentes.
Todas as alterações realizadas nesta seção podem ser visualizadas previamente antes da publicação definitiva do tema.
Fonte do tema
Permite definir a fonte principal utilizada na loja: Essa configuração impacta títulos, textos, botões e demais elementos tipográficos do layout.
– Cantos arredondados
Permite ajustar o nível de arredondamento aplicado a botões, cards e outros elementos visuais: Valores mais altos resultam em um layout mais moderno e com aparência suavizada.
– Link de rastreamento
Campo destinado à inserção do link padrão de rastreamento de pedidos: O endereço informado será utilizado no botão de acompanhamento de entrega da loja.
– Orientação da imagem do produto
Define o formato padrão das imagens exibidas nas vitrines e na página de produto: Pode-se optar entre formato quadrado ou vertical, conforme a proposta visual da loja.
– Compra Rápida
Habilitar compra rápida: Ativa a funcionalidade que permite adicionar produtos ao carrinho diretamente pela listagem, sem necessidade de acessar a página do produto.
Abrir carrinho lateral ao adicionar ao carrinho: Define se o carrinho lateral será aberto automaticamente após a inclusão de um item.
– Preços dos Produtos
Exibir preço apenas para usuários logados: Restringe a visualização dos preços a clientes autenticados na loja, funcionalidade comum em modelos B2B.
Destacar preço à vista: Ativa o destaque visual para pagamentos realizados à vista, como Pix ou boleto.
Texto no preço: Permite inserir um texto complementar exibido junto ao valor do produto, como por exemplo: “no Pix”.
– Alerta de Estoque
Exibir alerta de estoque: Ativa a exibição automática de mensagem indicando estoque baixo.
Quantidade para o alerta: Define o número mínimo de unidades para que o aviso de estoque reduzido seja exibido.
– Mensagens
Mensagem exibida quando não houver produto em estoque: Permite personalizar o texto apresentado quando o produto estiver indisponível.
Mensagem exibida quando o produto só pode ser comprado mediante consulta: Define o texto exibido em produtos que exigem orçamento ou contato direto para finalização da compra.
Mensagem enviada no botão do WhatsApp: Permite configurar o texto padrão enviado automaticamente ao iniciar contato via WhatsApp.
– Botões Flutuantes
Mostrar botão flutuante “voltar ao topo”: Ativa o botão que permite ao usuário retornar rapidamente ao topo da página.
Mostrar botão flutuante de redes sociais: Habilita a exibição de ícones sociais fixos na lateral da tela.
Posição dos botões flutuantes: Define o lado da tela em que os botões flutuantes serão exibidos: esquerdo ou direito.
– Classificação de Conteúdo
Exibir popup de confirmação de idade 18+
Ativa a exibição de aviso de confirmação de maioridade ao acessar a loja.
– Exibir barra de frete grátis
Habilita a barra progressiva que informa ao cliente quanto falta para atingir o valor mínimo de frete grátis.
– Valor para o frete grátis:
Define o valor mínimo de compra necessário para liberação do frete gratuito.
– Exibir seção “Leve junto” (Order Bump)
Ativa a exibição de produtos complementares dentro do carrinho, com objetivo de estimular aumento do ticket médio.
– Quantidade de cards por página (Carrossel)
Define a quantidade de produtos exibidos simultaneamente no carrossel de vitrines.
– Card de produto
– Cantos arredondados: Permite ajustar o nível de arredondamento aplicado aos cards de produto.
– Exibir avaliação do produto: Ativa a exibição das avaliações em formato de estrelas nos cards de produto.
– Exibir variações de cor como texto: Define se as variações serão exibidas como texto descritivo, em vez de ícones visuais.
– Imagem de produto:
– Exibir segunda imagem ao passar o mouse: Habilita o efeito de troca automática da imagem do produto ao passar o cursor sobre o card.
– Exibir botão de visualização rápida: Ativa o botão que permite visualizar detalhes do produto em modal, sem sair da página atual.
– Exibir botão WhatsApp: Habilita botão de contato via WhatsApp diretamente no card do produto.
– Selos
– Exibir selos do produto: Ativa a exibição de selos como “Lançamento”, “Destaque” e outros indicadores.
– Selos abertos: Define o estilo visual dos selos aplicados aos produtos.
– Mostrar cor de fundo nos selos: Ativa a aplicação de cor de fundo nos selos, tornando-os mais evidentes.
– Mostrar selo de desconto: Habilita a exibição automática da porcentagem de desconto em produtos promocionais.
– Imagem do selo de desconto: Permite inserir uma imagem personalizada para representar o selo de desconto.
– Texto dos selos (Lançamento, Destaque, Extra): Permite personalizar o texto exibido em cada tipo de selo.
– Contador Regressivo
– Exibir contador regressivo: Ativa a exibição de contagem regressiva para promoções. Pode ser aplicado em: Todas as listagens; Apenas vitrines promocionais.
– Exibir tarja de desconto no contador: Habilita a exibição de uma faixa promocional associada ao contador regressivo.
– Exibir popup na loja
– Ativa a exibição de popup promocional ou de captação de e-mails.
– Título e Subtítulo: Permite definir os textos principais do popup.
– Imagem de fundo: Permite inserir uma imagem de fundo para o popup, respeitando o tamanho máximo indicado.
– Momento de exibição
Define quando o popup será apresentado: Ao carregar a página; Ao tentar sair; Após determinado tempo de permanência
– Tipo de popup
Permite escolher entre: Popup de cupom de desconto ou Popup de captação de e-mails
– Informações do cupom: Permite configurar:
Código do cupom; Título; promocional; Subtítulo explicativo
Banner LGPD: Ative ou desative o banner de aviso de cookies. Certifique-se de colocar o link da sua página de política de privacidade.
Área destinada à inserção de regras CSS personalizadas, permitindo ajustes específicos de layout e estilo sem necessidade de alterar o código principal do tema.
- Cabeçalho
Na aba “cabeçalho” permite configurar os elementos estruturais superiores da loja, responsáveis pela navegação principal e pela primeira impressão visual do site. Nesta área é possível definir comportamentos e estilos que impactam diretamente a experiência do usuário, a identidade visual da marca e a clareza das informações exibidas.
Entre as opções disponíveis, destaca-se a funcionalidade de cabeçalho transparente, que possibilita a sobreposição do menu principal sobre o banner ou vídeo da primeira seção da página inicial. Essa configuração proporciona um layout mais moderno, sofisticado e alinhado às tendências atuais de design, criando uma experiência visual mais imersiva.
Como vantagem estratégica, o cabeçalho transparente valoriza imagens institucionais, campanhas sazonais e vídeos em destaque, tornando o início da navegação mais impactante e elegante.
Entretanto, é fundamental que haja atenção especial à escolha do banner ou vídeo utilizado nessa configuração. Recomenda-se que a arte possua uma área com menor carga visual ou uma faixa mais clara (ou com leve sobreposição escura, dependendo da cor do menu), garantindo contraste adequado para leitura do logotipo, menu e ícones.
Caso a imagem ocupe totalmente o espaço com informações ou cores muito intensas, pode haver comprometimento da legibilidade do cabeçalho.
Portanto, ao ativar o cabeçalho transparente, recomenda-se planejamento visual estratégico do banner principal, assegurando equilíbrio entre estética e usabilidade
– Cabeçalho fixo
Ativa o comportamento de cabeçalho fixo durante a rolagem da página.
Quando habilitado, o menu permanece visível no topo, facilitando a navegação e melhorando a experiência do usuário, principalmente em páginas longas.
– Cabeçalho transparente
– Habilitar: Permite ativar o cabeçalho em modo transparente, possibilitando que o topo da loja seja sobreposto ao banner ou vídeo da primeira seção da página inicial. Essa opção tende a gerar um visual mais moderno e imersivo, valorizando campanhas e elementos institucionais.
Recomendação importante: ao utilizar cabeçalho transparente, o banner/vídeo deve ser planejado para conter uma faixa com menor informação visual (uma “área de respiro”) na região superior, garantindo contraste e leitura adequada do logotipo, menu e ícones. Caso o conteúdo visual ocupe toda a área com alta intensidade de cores/detalhes, a legibilidade do cabeçalho pode ser comprometida.
– Efeito vidro embaçado
Ativa um efeito de “vidro” (blur) no cabeçalho transparente, aplicando desfoque ao conteúdo que está por trás do menu.
Essa opção melhora a leitura dos elementos do cabeçalho quando o banner/vídeo possui muitos detalhes.
Nível do efeito embaçado: Controla a intensidade do desfoque aplicado no cabeçalho transparente. Níveis mais altos aumentam a legibilidade e “separam” melhor o menu do fundo, porém podem reduzir o destaque do banner/vídeo.
– Posição do logo da loja
Define o alinhamento do logotipo no cabeçalho: à esquerda ou ao centro.
Ativa a barra informativa localizada no topo da loja, acima do cabeçalho principal.
Esse recurso é indicado para comunicar diferenciais e mensagens rápidas, como: “Frete rápido”, “Feito no Brasil”, “Troca facilitada”, “Parcele em até X”.
– Informações (itens configuráveis)
– Cada item permite cadastrar:
– Texto: mensagem exibida ao cliente (ex.: “Alta Performance”).
– Link: URL opcional para direcionamento (ex.: página institucional, política de entrega, catálogo, etc.).
A barra permite organizar os itens por prioridade, além de excluir itens individualmente.
Há um limite de até 8 informações, conforme indicado no painel.
Boas práticas: recomenda-se utilizar mensagens curtas, objetivas e alinhadas aos principais argumentos de venda da loja.
– Itens do menu
– Quantidade de itens no menu: Define a quantidade de itens exibidos no menu principal de categorias.
Esse controle ajuda a equilibrar visibilidade e organização, evitando excesso de categorias “competindo” no topo.
– Exibir carrossel de produtos no menu de categorias (somente desktop): Ativa a exibição de um carrossel de produtos dentro do menu de categorias (menu expandido), disponível apenas na versão desktop.
– Filtro de produtos do menu de categorias: Define o critério utilizado para exibir os produtos no carrossel do menu.
As opções disponíveis são:
Lançamentos; Destaques; Frete Grátis
Esse filtro direciona o foco do menu para uma estratégia específica (novidades, produtos prioritários ou incentivo por frete).
– Menu + Categorias
– Exibir menu “+ Categorias” no menu: Ativa o item “+ Categorias” no menu, permitindo concentrar categorias adicionais em uma área específica.
– Exibir antes ou depois das categorias: Define a posição do item “+ Categorias” em relação às categorias principais (antes ou depois).
Esse ajuste organiza o fluxo de navegação conforme a estratégia e a hierarquia de categorias.
– Produtos no menu categorias
– Seleção de produtos (máximo 12)
– Permite selecionar manualmente até 12 produtos para serem exibidos no menu (carrossel/área visual), reforçando campanhas, lançamentos ou itens de maior margem.
– Botão link adicional
– Texto do link adicional: Define o texto exibido para um link extra no menu (ex.: “Blog”, “Coleção”, “Guia de tamanhos”).
– Link adicional: Define a URL correspondente ao link adicional configurado.
– Botão Promoções
– Exibir botão “Promoções” no menu de categorias: Ativa um botão dedicado a ofertas/promoções no menu, facilitando o acesso do cliente a condições especiais.
– Texto exibido no botão promoções: Permite personalizar o rótulo do botão (ex.: “Ofertas”, “Promoções”, “Sale”).
– Ícones das categorias
– Exibir ícones no menu de categorias: Habilita a exibição de ícones associados às categorias, reforçando navegação visual e facilitando identificação rápida (especialmente em lojas com mix amplo).
– Ícones (upload por categoria): Permite enviar os ícones de cada categoria com as seguintes regras:
– Tamanho máximo: 100px × 100px
– Formatos aceitos: .jpg, .png, .svg
Recomenda-se utilizar ícones com estilo consistente (mesma família visual), boa leitura em tamanhos pequenos e contraste adequado.
– Contato
– Permite definir o ícone utilizado para a área de contato no cabeçalho.
– Conta
– Permite definir o ícone utilizado para acesso à conta/login do cliente.
– Carrinho
– Permite definir o ícone exibido no acesso ao carrinho.
– Regras e recomendações:
– Tamanho máximo: 35px × 35px
– Formatos aceitos: .jpg, .png, .svg
Recomenda-se utilizar arquivos com boa legibilidade em tamanhos reduzidos, preferencialmente com estilo uniforme entre os três ícones.
- Rodapé
A seção de Rodapé concentra informações institucionais, links estratégicos e elementos de credibilidade da loja virtual. Trata-se de uma área essencial para reforçar transparência, segurança e organização da navegação, além de servir como apoio informativo ao cliente.
O rodapé desempenha papel fundamental na experiência do usuário, pois centraliza conteúdos como políticas da loja, canais de atendimento, informações institucionais e selos de segurança. Uma estrutura bem organizada contribui para aumentar a confiança do consumidor, reduzir objeções e facilitar o acesso a conteúdos importantes.
Recomenda-se que o rodapé seja configurado de forma clara, objetiva e alinhada às diretrizes legais e comerciais da loja.
Banner rodapé: 1920px x 330px
Localização: Banner baixo
Cadastro: Marketing > banners
– Exibir seção Newsletter
– Ativa a área de captação de e-mails na loja.
– Título: Define o título principal da seção.
– Subtítulo: Define o texto complementar exibido abaixo do título.
– Texto de apresentação
Permite inserir um texto institucional que será exibido em destaque no rodapé da loja.
– Coluna 1 e 2
– Título
Define o nome da coluna (exemplo: “Institucional”, “Atendimento”, “Ajuda”).
– Itens
– Permite cadastrar links individuais, contendo:
– Texto do link (nome exibido ao cliente)
– URL de destino
Os itens podem ser reorganizados conforme prioridade e excluídos individualmente.
O limite máximo é de 20 itens por coluna, mas recomendamos até 08.
A aba de Selos permite adicionar elementos visuais que reforçam segurança e credibilidade da loja.
– Título
– Define o título da seção de selos (exemplo: “Selos de Segurança”).
– Aplicar filtro de escala de cinza: Permite aplicar efeito monocromático (preto e branco) nos selos exibidos.
Essa opção é recomendada quando se deseja manter uniformidade visual ou reduzir excesso de cores no rodapé.
– Selos
– Permite cadastrar selos individualmente com as seguintes configurações:
– Imagem do selo
– Link de destino
– Largura em pixels (px)
– É possível adicionar até 12 selos.
Recomenda-se manter proporção adequada e largura equilibrada para não comprometer o layout do rodapé.
- Página Inicial
Na aba “Layout” você irá configurar vários elementos e funcionalidades do tema.
Painel da plataforma > Configurações > Minha loja > Editar layout > Editar tema > Página inicial
Página Inicial totalmente Personalizável
A Página Inicial do nosso tema foi desenvolvida com um conceito inovador: você escolhe exatamente o que deseja exibir e em qual ordem.
Diferente de modelos engessados, aqui a home é modular. Isso significa que você pode:
✅ Adicionar apenas os elementos que fazem sentido para o seu negócio
✅ Remover seções que não deseja utilizar
✅ Reordenar os blocos conforme sua estratégia
✅ Personalizar títulos, cores, formatos e quantidades
✅ Criar uma home única, alinhada à identidade da sua marca
Basta acessar Página Inicial no editor do tema e começar a montar sua estrutura utilizando o botão “Adicionar Elemento”.
Os blocos podem ser reorganizados facilmente, permitindo total liberdade estratégica.
– Tipo de Banner
É possível definir o formato de exibição:
– Imagens: Permite utilizar banners estáticos ou em formato de carrossel.
Tamanho Desktop: 1920 px x 700px Local: Banner home desktop (Marketing > banners)
Tamanho Mobile: 430 px x 650 px Local: Banner home mobile (Marketing > banners)
– Vídeo: Permite utilizar um vídeo como plano de fundo do banner. Deve estar no youtube, você vai usar somente o link.
– Cabeçalho Transparente sobre o Banner: O tema permite a utilização do cabeçalho transparente sobre o banner (imagem ou vídeo), criando um efeito moderno e sofisticado.
Importante:
A ativação do cabeçalho transparente não é configurada nesta seção. Essa opção deve ser habilitada na aba Cabeçalho, dentro das configurações do tema.
– Tarja de Benefícios (Barra de Informações)
– Abaixo do banner principal, é possível ativar uma barra de benefícios, que pode ser: Ativada / Desativada
– A ativação é realizada por meio da opção “Exibir”.
– Configuração de Cores
– Permite personalizar: Cor do texto e cor de fundo
– Itens da Tarja
– É possível cadastrar até 12 itens, com:
– Texto personalizado
– Organização manual da ordem
– Exclusão individual
Recomenda-se utilizar mensagens curtas e objetivas para manter leitura rápida.
– Configure a régua de benefícios exibida. Escolha se os ícones serão mostrados.
– Adicione cards informativos com imagem, título e subtítulo para destacar vantagens da loja, como frete, parcelamento e brindes. É possível incluir até 12 cards, seguindo e respeitando o tamanho recomendado das imagens. Caso queira com ícones, utilize em formato SVG.
– Edite as cores de título e descrição se desejar
– O tamanho dos ícones não deve exceder 250px x 250px. Aceita os formatos: jpg, .png, .svg
– O nome do arquivo não deve ter espaços, caracteres especiais e não deve ter nomes repetidos: ex: icone01
Nosso tema possui ao todo 8 vitrines.
Sendo 3 vitrines personalizadas, você pode usar e distribuí-las ao longo da home.
– A Vitrine Personalizada permite selecionar manualmente os produtos que serão exibidos na Página Inicial. Trata-se de um recurso estratégico que oferece total controle sobre quais itens terão maior visibilidade na loja.
Nosso tema possui 3 vitrines personalizadas, você pode usar e distribuir as mesmas ao longo da home.
– Alinhamento do título
– Define o posicionamento do título da vitrine na seção (ex.: esquerda ou centralizado).
– Título da vitrine
– Permite definir o nome da seção, o título deve ser claro e alinhado ao objetivo comercial da seção.
– Subtítulo da vitrine
– Campo opcional para inserir um complemento estratégico ao título.
– Formato exibido da vitrine
– Permite escolher entre:
– Carrossel: Exibe os produtos em formato deslizante horizontal.
– Grade: Exibe os produtos em formato fixo de grade.
– Produtos da vitrine
– Permite selecionar manualmente até 12 produtos.
– Os produtos podem ser:
– Adicionados individualmente
– Reorganizados conforme prioridade
– Removidos quando necessário
Recomenda-se posicionar primeiro os produtos com maior potencial de conversão.
Nosso tema possui ao todo 8 vitrines.
Sendo uma vitrine lançamento e uma destaque, você pode usar e distribuí-las ao longo da home.
A Vitrine Destaques e Lançamentos é uma seção automática da Página Inicial que exibe os produtos marcados como destaque e lançamentos na plataforma.
Nessas vitrines os produtos não são selecionados manualmente no tema. A exibição depende da configuração realizada no cadastro do produto na plataforma.
– Como funciona
– Para que um produto apareça na Vitrine destaques ou lançamentos , é necessário:
– Acessar a listagem de produtos na plataforma.
– Editar o produto desejado.
– Ativar a opção ou selo de Produto em destaque ou lançamento.
– Salvar as alterações.
– Somente produtos com essa configuração ativa serão exibidos nesta vitrine.
Após colocar os selos nos produtos você pode configurar a vitrine de forma visual.
– Alinhamento do título
– Define o posicionamento do título da vitrine na seção (ex.: esquerda ou centralizado).
– Título da vitrine
– Permite definir o nome da seção, o título deve ser claro e alinhado ao objetivo comercial da seção.
– Subtítulo da vitrine
– Campo opcional para inserir um complemento estratégico ao título.
– Formato exibido da vitrine
– Permite escolher entre:
– Carrossel: Exibe os produtos em formato deslizante horizontal.
– Grade: Exibe os produtos em formato fixo de grade.
– Quantidade de produtos na vitrine
– Permite exibir até 12 produtos.
Nosso tema possui ao todo 8 vitrines.
Sendo uma vitrine mais vendidos e uma promoções, você pode usar e distribuí-las ao longo da home.
Nessas vitrines os produtos são selecionados de forma automática pela inteligência da própria plataforma, não é possível indicar manualmente os produtos a serem exibidos nas mesmas.
– Alinhamento do título
– Define o posicionamento do título da vitrine na seção (ex.: esquerda ou centralizado).
– Título da vitrine
– Permite definir o nome da seção, o título deve ser claro e alinhado ao objetivo comercial da seção.
– Subtítulo da vitrine
– Campo opcional para inserir um complemento estratégico ao título.
– Formato exibido da vitrine
– Permite escolher entre:
– Carrossel: Exibe os produtos em formato deslizante horizontal.
– Grade: Exibe os produtos em formato fixo de grade.
– Quantidade de produtos na vitrine
– Permite exibir até 12 produtos.
Na vitrine de promoção você pode delimitar a data que aparece da promoção, ou deixar que o sistema resgate a data, ele vai resgatar a data com maior tempo ativo de promoção.
Nosso tema possui ao todo 8 vitrines.
Sendo uma vitrine de banner você pode usar e distribuí-la ao longo da home.
A Vitrine com Banner é um recurso exclusivo do tema, desenvolvido para permitir a exibição de múltiplos produtos organizados por categoria dentro de uma única seção da Página Inicial.
Essa funcionalidade combina imagem de destaque + seleção de produtos, criando uma apresentação visual mais organizada, estratégica e comercial.
– Cada bloco da Vitrine com Banner é composto por:
– Uma imagem principal (1000x1000px recomendada)
– Um título personalizado
– Produtos selecionados manualmente, pode selecionar até 12 produtos cada vitrine
– É possível adicionar até 5 vitrines
Na Categoria Destaque, você tem duas opções de exibição:
– Com vídeo (YouTube Shorts)
– Ativar a opção “Com vídeo”
– Inserir a URL do YouTube
– O sistema puxa a thumb automaticamente
– Com imagem (modo tradicional)
– Se quiser usar imagem em vez de vídeo:
– Desative a opção “Com vídeo”
– Em cada categoria, envie a imagem
– Use o tamanho correto: 364x534px
– Ajuste do layout:
– Alinhamento do título
– Título
– Subtítulo
– Cores do botão:
– Borda: Aplicada na borda do botão
– Fundo: Aplicada no fundo do botão
– Texto: Aplicada no texto do botão
– Borda ao passar o mouse: Aplicada na borda do botão ao passar o mouse
– Fundo ao passar o mouse: Aplicada no fundo do botão ao passar o mouse
– Texto ao passar o mouse: Aplicada no texto do botão ao passar o mouse
– Desative nome da categoria
– Desative botão “ver mais”
– A seção “Quem somos” é exibido na home da loja. Você pode cadastrar um título, descrição e imagem ou vídeo.
– A imagem da seção quem somos deve ser cadastrada em Marketing > Banners > Banner Extra 04
– Tamanho da imagem: 1120 px × 510 px
– Título: Ajuste negrito, alinhamento e nome
– Texto: Ajuste negrito, alinhamento e descreva o texto desejado.
– Cores: Ajuste as cores da sessão
– Fundo: Aplicada no fundo da Seção
– Título: Aplicada no título da Seção
– Texto: Aplicada no texto da Seção
– Configure a seção de vídeos da loja, ativando sua exibição na página inicial.
– Nesta seção, destaque a história inspiradora por trás da sua empresa, os valores fundamentais que a guiam e o compromisso com a excelência no atendimento ao cliente.
– Título: Define o título principal da seção exibido acima do vídeo.
– Subtítulo: Texto complementar exibido abaixo do título para reforçar a mensagem da seção.
– Texto da direita: Campo descritivo ao lado do vídeo. Serve para explicar o conteúdo apresentado e contextualizar o visitante.
– Vídeo do canal: URL de um vídeo do YouTube que será incorporado na seção.
– Link do canal: Link direcionável ao clicar no botão ou área relacionada ao vídeo (pode levar para YouTube, página interna ou externa).
Cor de fundo: Define a cor de fundo da seção inteira.
Produtos do canal: Permite selecionar até 12 produtos para exibição junto ao vídeo.
– Carrossel de vídeos é um carrossel de vídeos dos shorts do youtube.
– Não repita links pode ocasionar a quebra da sessão.
– Alinhamento do título: Define o posicionamento do título da seção (esquerda, centro).
– Título da vitrine: Texto principal exibido acima do carrossel de vídeos.
– Subtítulo da vitrine: Texto complementar exibido abaixo do título principal.
– Vídeos: Campo para inserir URLs de vídeos do YouTube Shorts que serão exibidos em formato de carrossel deslizante.
– Limite de vídeos: Permite inserir até 12 vídeos na seção.
– Configure o carrossel de marcas disponíveis na loja.
– Alinhamento do título: Define o posicionamento do título da seção (esquerda, centro).
– Título: Texto principal exibido acima do carrossel de marcas.
– Subtítulo: Texto complementar exibido abaixo do título.
– Configurações do Carrossel
– Transição automática: Ativa ou desativa o deslizamento automático das marcas.
– Intervalo da transição (segundos): Define o tempo entre cada transição automática do carrossel.
Marcas imagens
– Tamanho recomendado: até 300x300px. Formatos aceitos: JPG, PNG e SVG.
– Link da marca cadastrada na loja: URL para onde o usuário será direcionado ao clicar na marca
– O nome do arquivo não deve ter espaços e não deve ter nomes repetidos.
– Limite de marcas: Permite inserir até 12 marcas na seção.
– Título da vitrine: Texto principal exibido acima dos depoimentos.
– Subtítulo da vitrine: Texto complementar exibido abaixo do título.
– Cores
– Fundo do card: Define a cor de fundo de cada card de depoimento.
– Nome do cliente: Define a cor aplicada ao nome do cliente exibido no depoimento.
– Mensagem: Define a cor do texto da mensagem do depoimento.
– Carrossel
– Transição automática
– Intervalo da transição (segundos)
– Depoimentos
– Com imagem: Ativa ou desativa a exibição de imagem, aqui você pode usar para colocar prints de depoimentos que recebe.
– Tamanho das imagens não deve exceder 364px x 534px. Aceita os formatos .jpg, .jpeg, .png
– Depoimentos em textos:
– Nome do usuário: Nome da pessoa que fez o depoimento.
– Link do perfil do usuário: URL opcional vinculada ao nome do cliente (ex: rede social ou página externa).
– Depoimento do usuário: Texto do comentário ou avaliação do cliente.
– Limite de depoimentos: Permite inserir até 12 depoimentos na seção.
Ative o carrossel de imagens do Instagram na página inicial.
– Titulo da seção
– Alinhamento de título: a esquerda ou central
– Texto do título
– Nome do seu perfil das redes sociais
– Link do seu perfil
– Detalhes da imagem:
– Tamanho das imagens não deve exceder 700px x 700px. Aceita os formatos .jpg ou .png
– O nome do arquivo não deve ter espaços e não deve ter nomes repetidos.
– Alinhamento do título: define o posicionamento do título da seção (ex: esquerda, centro).
– Título da vitrine: texto principal que aparecerá como título da seção na página inicial.
– Subtítulo da vitrine: texto complementar exibido abaixo do título.
-Imagem: Sugerimos seguir o tamanho de 400px x 400px
Essa seção controla um carrossel manual de banners/imagens na home, você pode usar como desejar.
– Alinhamento do título: Define o posicionamento do título da seção.
– Título da vitrine: Texto principal exibido acima do carrossel.
– Subtítulo da vitrine: Texto complementar abaixo do título.
– Texto do botão inferior: Texto de um botão exibido abaixo do carrossel.
– Link do botão inferior: URL para onde o botão inferior irá redirecionar.
– Cada bloco corresponde a uma imagem do carrossel.
– Para cada item você tem:
– Imagem (thumbnail à esquerda)
– Link para redirecionar: URL que será aberta ao clicar na imagem.
– Tamanho dos ícones não deve exceder 700px x 700px. Aceita os formatos .jpg, .jpeg, .png, .svg
- Categoria e busca
A seção Categorias e Busca permite configurar o comportamento e a estrutura das páginas de listagem da loja virtual, incluindo categorias, resultados de busca e filtros de navegação.
Essas páginas exercem papel estratégico na jornada do cliente, pois organizam o catálogo, facilitam a descoberta de produtos e influenciam diretamente na conversão. Uma configuração adequada melhora a experiência de navegação, otimiza a usabilidade e pode impactar positivamente indicadores como tempo de permanência e taxa de cliques.
As opções disponíveis permitem personalizar filtros, paginação, exibição de banners, notificações promocionais e conteúdos multimídia associados às categorias.
– Exibir filtro de produtos na página de busca e categorias
– Permite ativar o sistema de filtros laterais (como preço, tamanho, cor, marca, entre outros).
– Recomenda-se manter ativo em lojas com maior volume de produtos, pois facilita a navegação segmentada.
– Posição do filtro
– Define o formato de exibição do filtro:
– Fixo: exibido permanentemente na lateral da página.
– Bandeja: exibido em formato retrátil (abrindo sob demanda).
– Opções do filtro abertas
– Quando ativado, mantém as categorias de filtro expandidas por padrão, facilitando visualização imediata das opções disponíveis.
– Tipo de paginação
– Define o modelo de carregamento de produtos:
– Infinita: os produtos são carregados automaticamente à medida que o usuário rola a página.
– Numerada: exibição tradicional por páginas numeradas.
– A paginação infinita tende a aumentar o tempo de navegação; a numerada facilita controle e referência de páginas específicas.
– Ordenar itens (Banner / Descrição / Produtos)
Permite reorganizar a estrutura da página de categoria, definindo a ordem de exibição dos seguintes elementos:
– Banner; Descrição da categoria; Lista de produtos
– Essa organização pode ser ajustada conforme a estratégia visual e comercial.
– Exibir Descrição
– Ativa a exibição do texto descritivo da categoria na página: Recomendado para fins de SEO e contextualização do cliente.
– Exibir Banner
– Ativa a exibição do banner específico da categoria: Indicado para reforçar campanhas visuais e identidade da seção.
– Permite configurar notificações promocionais associadas a categorias específicas.
– Cada notificação permite configurar:
– Categoria: define em qual categoria a notificação será exibida.
– Título da notificação: texto principal da oferta (ex.: “Oferta Imperdível”).
– Texto do botão: chamada para ação (ex.: “Comprar Agora”).
– Produto: produto vinculado à notificação.
– Validade: pode ser indeterminada ou com data específica.
É possível adicionar até 12 notificações.
– Configuração do vídeo
– Para cada vídeo, é possível definir:
– Categoria: categoria em que o vídeo será exibido.
– URL do vídeo (YouTube): link do vídeo incorporado.
– Formato Shorts ou vídeo 16:9 padrão: permite indicar se o vídeo é no formato vertical (Shorts) ou padrão.
Recomenda-se utilizar vídeos objetivos, com boa qualidade visual e alinhados à identidade da loja.
– Para cada regra, define-se:
– Categoria: categoria que exigirá confirmação de maioridade.
– Esse recurso é indicado para lojas que comercializam produtos com restrição legal de idade.
- Página de produto
A seção Página do Produto concentra as configurações responsáveis pela estrutura, funcionalidades e elementos estratégicos da página mais importante da loja virtual: a página de conversão.
É nesse ambiente que o cliente toma a decisão de compra. Por isso, as opções disponíveis nesta seção permitem otimizar a experiência visual, reforçar credibilidade, facilitar contato e estimular a venda por meio de recursos complementares.
Uma configuração adequada da página do produto impacta diretamente a taxa de conversão, o ticket médio e a percepção de confiança da marca.
– Galeria de Imagem e Vídeo
– Quantidade de imagens na galeria: Define o número de imagens exibidas simultaneamente na galeria do produto.
– Tocar vídeo ao carregar a página: Quando ativado, o vídeo do produto é reproduzido automaticamente ao acessar a página.
– Formulário
– Exibir avaliações dos produtos: Ativa a exibição de avaliações (reviews) na página do produto.
– Exibir botão WhatsApp: Habilita o botão de contato direto via WhatsApp dentro da página do produto.
– Exibir compra rápida: Permite ativar a funcionalidade de compra rápida diretamente na página do produto.
– Vitrines da Página
– Exibir produtos relacionados: Ativa a exibição de produtos relacionados ao item visualizado.
– Exibir produtos visualizados: Permite exibir uma vitrine com produtos recentemente visualizados pelo cliente.
Adicione tabelas de medida associando cada imagem ao ID da categoria correspondente. É possível enviar imagens seguindo o tamanho recomendado e incluir até 20 tabelas diferentes para organizar melhor as informações de tamanhos dos produtos.
- Páginas internas
A seção Páginas Internas permite estruturar e personalizar páginas institucionais ou promocionais específicas da loja, como Black Friday, campanhas sazonais, landing pages e conteúdos especiais.
⚠ Importante:
Para que a configuração funcione corretamente, é obrigatório que a página seja previamente criada na plataforma.
O processo deve seguir o caminho:
Configurações → Minha Loja → Páginas Internas
Nesta etapa, o lojista deverá:
– Criar a nova página interna.
– Definir o slug da página.
– Inserir o título e o conteúdo principal.
⚠ Após a criação na plataforma, o mesmo slug deve ser informado na área de configuração do tema, na seção Páginas Internas.
O título e o conteúdo textual principal exibidos na página serão sempre os cadastrados diretamente na plataforma.
O editor do tema permite complementar essa estrutura com vitrines, banners, vídeos e outros elementos visuais.
– Limite de Páginas
– É possível cadastrar até 8 páginas internas dentro do tema.
– Cada página deve possuir slug previamente criado na plataforma para funcionamento correto.
– Considerações Estratégicas
– A seção de Páginas Internas é ideal para:
– Landing pages promocionais
– Black Friday
– Campanhas sazonais
– Páginas institucionais diferenciadas
– Lançamentos de coleção
– Eventos específicos
Recomenda-se planejamento visual e estratégico antes da publicação, garantindo coerência entre:
– Conteúdo textual (plataforma)
– Elementos visuais (tema)
– Identidade da campanha
– Slug da página
Campo responsável por identificar qual página criada na plataforma será utilizada. O slug informado no tema deve ser exatamente igual ao cadastrado na plataforma.
– Cor de fundo da página
Permite definir a cor de fundo específica para a página interna.
– Cor dos títulos
Define a cor padrão dos títulos exibidos dentro da estrutura da página criada pelo tema.
Recomenda-se manter contraste adequado com o fundo para garantir legibilidade.
– Elementos da Página
A página interna permite a adição de múltiplos blocos estruturais, que podem ser organizados conforme estratégia da campanha.
– Título da Página
– Permite adicionar um título adicional personalizado dentro da estrutura visual do tema.
– Alinhamento do título: Define o alinhamento do título (ex.: esquerda, centro).
Observação: o conteúdo textual principal continua sendo o definido na plataforma.
– Vitrine Personalizada (1, 2 e 3)
– Permite criar vitrines independentes para destacar produtos específicos.
– Cada vitrine possibilita configurar:
– Alinhamento do título
– Título da vitrine
– Subtítulo da vitrine
– Cor do título
– Formato de exibição
– Carrossel ou Grade
– Cor de fundo dos cards
– Cor do texto dos cards
– Seleção manual de produtos (máximo de 12 produtos por vitrine)
– Banners
– Permite adicionar um carrossel de banners dentro da página interna.
– Configurações disponíveis:
– Transição automática
– Pausar ao passar o mouse
– Velocidade de transição (ms)
– Intervalo entre transições (segundos)
– É possível cadastrar até 12 banners.
– Shorts (Carrossel de Vídeos)
– Permite adicionar um carrossel de vídeos no formato vertical (YouTube).
– Configurações:
– Alinhamento do título
– Título da seção
– Subtítulo
– Cor do título
– Cadastro das URLs dos vídeos
– Limite de até 12 vídeos
– Conteúdo da Página
– Este bloco exibe o conteúdo textual cadastrado diretamente na página interna criada na plataforma.
Reforçando:
– O texto exibido nesse espaço é sempre aquele definido em:
Configurações → Minha Loja → Páginas Internas
– O tema apenas estrutura a apresentação visual.
- Edição no código
Antes de fazer qualquer edição nos códigos HTML e CSS do seu tema, é altamente recomendável criar uma cópia de segurança. Isso garantirá que, caso ocorra algum problema, você possa facilmente restaurar o tema para sua funcionalidade original. É importante ressaltar que a Softcommerce não se responsabiliza por quaisquer problemas decorrentes de edições no código. Não oferecemos suporte técnico e garantia para temas que sofreram alterações no código.
Lembre-se de que a edição do código do seu tema requer conhecimento avançado em HTML, CSS e JS. Caso contrário, há o risco de o tema deixar de funcionar corretamente na sua loja. Nosso tema foi projetado com várias personalizações através do painel do tema e do painel administrativo da plataforma, facilitando assim o controle da sua loja. No entanto, entendemos que você possa desejar fazer modificações mais profundas.
- Dicas Essenciais
Para você extrair o máximo de performance do tema Soft Slim, separamos algumas dicas para você aplicar na sua loja.
Otimização de Imagens
– Prefira o formato JPG caso sua imagem não precise ter fundo transparente.
– Respeite as dimensões do gabarito de banners, evite cadastrar imagens com dimensões superiores as recomendadas.
Formatação
Nos campos de descrição do produto e páginas institucionais, evite colar texto com formatação de outros site, isso carrega linhas de CSS que não são necessárias. Sempre que for colar algum texto, utilize o comando CTRL+SHIFT+V para colar o texto sem formatação