Olá, tudo bem?
Primeiramente, agradecemos por adquirir o Tema GK Digital V1 – Roupas. Será um prazer te acompanhar na configuração da sua loja e ajudar você a deixá-la com uma identidade visual profissional, moderna e focada em vendas 🚀
Este manual foi criado para orientar você no uso do nosso tema dentro da plataforma Loja Integrada, de forma simples e prática. Aqui você vai encontrar:
Também colocaremos neste manual todos os nossos canais de atendimento e suporte.
Lembre-se: o suporte técnico referente ao tema é de responsabilidade da GK Digital — e não da plataforma Loja Integrada.
Caso você ainda não tenha adquirido o tema para sua loja, entre em contato com nosso time comercial para garantir o seu.
Se você ainda não possui uma loja na plataforma Loja Integrada, podemos te orientar no processo de contratação.
Além do desenvolvimento de temas, a GK Digital também oferece:
Para orçamento sem compromisso, é só chamar nossa equipe
A GK Digital é uma agência especializada em desenvolvimento de soluções para e-commerce, com foco na criação de temas otimizados para vendas e personalizações sob medida para a plataforma Loja Integrada. Nosso objetivo é ajudar sua loja a crescer de forma profissional, sustentável e escalável.
Saiba mais sobre nós:
Site: www.agenciagkdigital.com.br
Instagram: @gkdigital.agencia
Facebook: GK Digital
WhatsApp Comercial: (99) 99161-4347
Contato de Suporte: suporte@gkdigital.com.br
Qualquer dúvida referente à instalação, configuração ou funcionamento do tema, entre em contato diretamente com nosso suporte.
⚠️ Direito de suporte incluído:
Você tem direito ao suporte do tema por 90 dias, com respostas em até 48 horas úteis.
Informações importantes sobre o suporte:
Caso precise de suporte sobre a plataforma, recomendamos que entre em contato com a Loja Integrada.
Saiba como conseguir suporte da Loja Integrada aqui.
Talvez você encontre a resposta de forma simples e rápida nos artigos da Central de ajuda da Loja Integrada.
Para clientes no plano grátis, temos também a Comunidade da Loja Integrada.
Após a confirmação do pagamento pela Hotmart, nossa equipe receberá automaticamente os dados do comprador e iniciará o processo de contato para instalação do tema.
Como o Tema GK Digital V1 – é um tema externo e não está listado na Loja Integrada como tema oficial, sua instalação é realizada manualmente pela nossa equipe técnica.
Após a confirmação do pagamento na Hotmart
Entraremos em contato pelo WhatsApp cadastrado na compra
Vamos solicitar o convite ou acesso ao painel da sua loja na Loja Integrada
Faremos a instalação completa do tema dentro da sua loja
Aplicaremos as configurações iniciais necessárias
Além da instalação, você receberá os arquivos incluídos:
manual completo
banners e criativos do tema
instruções adicionais
Os arquivos, como banners e guias adicionais, poderão ser enviados via WhatsApp, e-mail ou link direto após a liberação da compra.
Caso deseje baixar novamente posteriormente, basta solicitar ao suporte.
Após configurarmos o tema na sua loja, recomendamos seguir as orientações abaixo:
revise e personalize as configurações disponíveis no painel tema
apenas configure as caixas apresentadas no manual
itens não listados aqui não precisam ser alterados
⚠️ Após realizar qualquer modificação e publicação no tema, recomendamos:
✔ adicionar um produto ao carrinho
✔ aguardar a atualização do cache padrão da plataforma (aprox. 15 minutos)
Esse processo força a atualização visual do tema na loja.
Acesse seu painel da loja virtual, no menu esquerdo, clique em "Visual" e selecione "Visual da loja".

Acesse: Disposição de Layout
Tamanho do Layout: Médio
Disposição do logotipo: Logo a Esquerda
Disposição dos itens da loja: Disposição 03
Disposição da coluna lateral: Sem coluna
Selecione:
- Exibir menu superior
- Categorias
- Compactar subcategorias do menu lateral

Acesse: Botões
Cor padrão para os botões: (cor padrão do tema ou conforme desejar em hexadecimal)
Texto do botão na Página de Produto: "Comprar" ou adicionar o texto desejado para apresentação
Defina a ação deste botão: "Adicionar produto e ir para o carrinho" ou conforme desejar
Texto do botão na Listagem de Produtos: "Comprar" ou adicionar o texto desejado para apresentação
Defina a ação deste botão: "Adicionar produto e permanecer na página" ou conforme desejar
Não mostrar o botão de listagem: caso selecione este item o botão comprar não irá apresentar na home e na listagem do produto, somente irá apresentar dentro da página do produto
Acesse: Página do produto
Disposição das miniaturas do produto: Horizontal
Valor do produto em destaque: "Destacar parcela" ou conforme desejar
Selecione conforme desejar os itens abaixo:
- Exibir a quantidade em estoque disponível para compra
- Exibir campo para alterar a quantidade que será adicionado ao carrinho
Acesse: Monte sua vitrine
Selecione:
- Lançamentos
- Mais vendidos
- Destaques
Ordenar por: "Produtos em ordem aleatória" ou conforme desejar
Por categoria - caso deseje colocar uma categoria em destaque na home há uma limitação de 10 categorias para esta exibição
Quantos produtos mostrar: 8 ou conforme desejar
Exibir produtos em carrossel: selecione caso deseje
Quando selecionado carrossel, no mobile tem que apresentar somente 1 produto por linha. Caso deseje apresentar 2 produtos por linha no mobile, o carrossel deverá ser desativado.
Acesse: Marketing » Newsletter
Título: Newsletter ou conforme desejar
Texto Capa: Receba nossas ofertas por e-mail ou conforme desejar
Texto Sucesso: Obrigado por se inscrever! Aguarde novidades da nossa loja em breve ou conforme desejar
Ativar caixa de captação de e-mails no menu lateral: selecione
Ativar barra de captação de e-mails: Sim
Acima do rodapé: Sim
Cor de fundo da barra: insira a cor padrão do tema ou conforme desejar
Ativar caixa de captação de e-mails no Pop-up: Sim
Quando mostrar a Janela? - Após 10 Segundos ou conforme desejar
Onde mostrar a janela para o cliente?
Qualquer página ou conforme desejar
Acesse: Configurações » Gerenciador de arquivos
Para implementar as imagens dos selos de envio e obter os links, é necessário subir o arquivo que deseja, em Gerenciador de arquivos e copiar os links (URLs) e colar na configuração dos selos.
Tamanho para imagens de Forma de Envio: 95 x 25 px
Envie o arquivo desejado para a plataforma:
Após o arquivo upado, ele ficará disponível para ser utilizado na sua loja virtual
O upload é fundamental tanto para os selos quanto para inserir os banners seções e mobile no seu tema.
Para o seu tema funciona 100%, é necessário a configuração abaixo:
Descrição: Seletor Geral Tema
Local publicação: Rodapé
Página publicação: Todas as páginas
Tipo: JavaScript
Insira o código abaixo no campo Conteúdo, altere os elementos conforme as orientações individuais e não deixe espaço entre as ‘aspas’, lembrando para alterar somente os elementos destacados entre as aspas: ‘ ‘.
Código para copiar logo abaixo da imagem:
Esse script serve como uma configuração geral do tema/loja.
Ele funciona assim:
cada var ... = ... define uma informação que o tema vai usar
a maioria das alterações é apenas trocar textos dentro das aspas " " ou ' '
se quiser desativar algo, normalmente é só mudar 'sim' para 'não'
sempre manter a estrutura e sintaxe corretas (ponto e vírgula, vírgulas nas listas, aspas)
var categorias_limite = [{ qtd: '9' }];controla quantas categorias aparecem no menu
troque '9' pelo número desejado (recomendado 7 a 9)
var ofertas_menu = [{
ativado: 'sim',
titulo: 'TOP 20',
link: '/ofertas'
}];ativa ou desativa o botão de ofertas: 'sim' ou 'não'
altera o texto exibido no menu: "titulo"
muda o link da página de ofertas "link"
var nomecategorias = 'CATEGORIAS'
aparece como Todas as Categorias o menu de todas as categorias
const texto = "<b>*ATENÇÃO:</b> 40% de DESCONTO na compra do seu tema!";texto exibido em destaque
pode usar HTML dentro das aspas
Cada bloco segue a mesma estrutura:
var infoimagem1 = '<svg .... ></svg>'
var textoinfo1 = 'Frete Grátis'
var subtextoinfo1 = 'Compras acima de R$ 220,00'
Cada grupo altera:
infoimagemX = ícone (usa SVG) (Recomendamos não alterar)
textoinfoX = título da vantagem
subtextoinfoX = texto complementar
Para trocar o ícone, substitua o conteúdo entre aspas por outro <svg> completo.
var ativarbannersextras = 'sim'
'sim' = ativa a seção
'não' = oculta completamente
var menudropdowntelefone = '(99) 99230-4326'
var menudropdownwhatsapp = '(99) 99230-4326'
var menudropdownemail = 'suporte@agenciagkdigital.com.br'
altera textos de contato exibidos no menu
pode remover parenteses se quiser
var ativarcarroselcategorias = 'sim'
var titulosecaocategorias = 'Escolha por categoria'
ativa/desativa carrossel
altera o título exibido acima
var section_categorias = [
{ href: '/proteinas', src: 'url...', title: 'Proteínas' },
{ href: '/carboidratos', src: 'url...', title: 'Carboidratos' },
];Cada objeto dentro do array representa uma categoria.
Pode alterar ou adicionar mais copiando o formato.
var ativaravaliações = 'sim'
var avaliacoes = [
{ nome: "Gustavo R.", cidade: "SP", comentario: "Entrega super rápida..." }
]você pode remover/editar/adicionar avaliações seguindo a estrutura
sempre separar com vírgula os objetos dentro do array
Para evitar erros ao alterar:
sempre mantenha aspas
' ' ou " " arrays precisam de colchetes
[ ] objetos precisam de
{ } sempre colocar vírgula depois de cada item da lista
não apagar ponto e vírgula final quando existir
todo texto que aparece no site está entre aspas
todo ícone que aparece é um <svg> completo dentro de aspas
valores "sim" ou "não" controlam visibilidade
links devem começar com /
Para o seu tema funciona 100%, é necessário a configuração abaixo:
Descrição: Seção de Ofertas
Local publicação: Cabeçalho
Página publicação: Todas as páginas
Tipo: JavaScript
Insira o código abaixo no campo Conteúdo, altere os elementos conforme as orientações individuais e não deixe espaço entre as 'aspas', lembrando para alterar somente os elementos destacados entre as aspas: ' '.
Código para copiar:
var ativarsuperoferta = 'n'
var slcsuperoferta = ''
var datainiciosuperoferta = '2024/08/20 00:00:00'
var datafimsuperoferta = '2024/08/31 00:00:00'
var textosuperoferta = 'TOP 20 - Aproveite!'
Para o seu tema funciona 100%, é necessário a configuração abaixo:
Descrição: Personalização de Cores e Frase
Local publicação: Rodapé
Página publicação: Todas as páginas
Tipo: CSS
Insira o código abaixo no campo Conteúdo, altere os elementos conforme as orientações individuais e não deixe espaço entre as 'aspas', lembrando para alterar somente os elementos destacados entre as aspas: ' '.
Código para copiar:
Acesse: Produtos » Marcas
O carrossel de marcas é uma funcionalidade padrão da plataforma Loja Integrada, cadastre a marca desejada e para que a mesma fique ativa e apresentando na loja virtual selecione:
Marca ativa: Sim
Marca em destaque: Sim - só assim essa marca irá refletir no tema
Nome da marca: coloque o nome da sua marca ou fabricante conforme desejar
Logo da marca: selecione a imagem desejada, no tamanho 300 x 100px em PNG sem fundo
Lembre-se que as marcas não apresentam na versão mobile.
Acesse: Visual » Banners
Tamanhos recomendados e posições:
Banner Tarja: 812x 334px
Full Banner: 1920 x 492px
Full Banner Mobile: 880x 700px
Categorias: 180x200px
Mini Banners: 400x400px
Banners Extras Rodape: 542x964px
Saiba como adicionar os banners no painel da Loja Integrada, e lembre-se que para rotacionar os full banners, deverá ser cadastrado mais de um, e o procedimento ocorre automaticamente.
Recomendamos que insira o logotipo com as dimensões mais próximas possíveis do logotipo oficial do tema.
Dimensões:
Logotipo: 300 x 100 px ou 600 x 200 px em PNG sem fundo
Favicon: 128 x 128 px em tamanho máximo de 100KB em formato .ico
Evite inserir logotipos com sombras e bordas brancas na própria imagem. Reduza o máximo possível ou mesmo completamente as bordas brancas antes de subir o logotipo na plataforma.
Evite também inserir imagens com tamanhos maiores na vertical, pois isso vai fazer com que o topo da loja fique muito grande, prejudicando assim a usabilidade do seu layout.
Para inserir o logotipo e favicon siga o passo a passo da plataforma.
Para apresentar os dados no rodapé do tema, é necessário inserir uma descrição da loja diretamente no painel da sua loja virtual.
Para inserir as informações, acesse Configurações » Dados da Loja e siga o passo a passo da Loja Integrada.
Para o seu tema funciona 100%, é necessário a configuração abaixo:
Descrição: Personalização de Cores e Frase
Local publicação: Rodapé
Página publicação: Todas as páginas
Tipo: CSS
Insira o código abaixo no campo Conteúdo, altere os elementos conforme as orientações individuais e não deixe espaço entre as ‘aspas’, lembrando para alterar somente os elementos destacados entre as aspas: ‘ ‘.
Código para copiar abaixo da imagem:
O código abaixo é responsável por controlar as principais cores, textos, tamanhos e estilos do tema utilizando variáveis CSS dentro do :root.
Essas variáveis tornam o painel mais organizado, tornando possível alterar diversas partes da interface apenas modificando os valores dentro das aspas.
Todo o bloco deve permanecer dentro da tag <style> no cabeçalho do tema.
Para modificar qualquer item basta alterar o valor após : mantendo a sintaxe.
Exemplo real:
--cor_botao: black;
Pode ser trocado para:
--cor_botao: #ff0000; /* vermelho */
Ou nomes de cores válidos:
--cor_botao: blue;
Nenhuma dessas alterações exige conhecimento avançado — apenas manter o valor dentro das aspas OU após os :.
Abaixo segue o significado e propósito de cada linha
| Variável | Função |
|---|---|
--texto_global |
Cor padrão do texto em todo o site |
--cor_barratopo |
Fundo da barra superior (área acima do menu) |
--cor_texto_barratopo |
Cor do texto na barra superior |
--cor-menu-superior |
Cor do fundo do menu do topo |
--texto_menucategorias |
Cor do texto dos itens de categoria |
--texto_todascategorias |
Cor dos textos em “todas categorias” |
| Variável | Função |
|---|---|
--cor-cabeçalho |
Cor de fundo do cabeçalho |
--cor_buscadesktop |
Cor de fundo da barra de busca |
--corlinkdropboxcb |
Cor de links no dropdown |
--cor_icones4info |
Cor dos ícones de informações |
--cor_texto_cabecalho |
Cor do texto no cabeçalho |
--cor-icones_cabecalho |
Cor dos ícones da barra superior |
--cor-icones |
Cor geral de ícones |
--cor-icone_carrinho |
Cor do ícone do carrinho |
| Variável | Função |
|---|---|
--cormenu_textohover |
Cor ao passar o mouse no menu |
--cor_icone_departamentos |
Cor do ícone departamentos |
--texto_titulotodascategorias |
Cor título “todas categorias” |
--cor-texto_subcategorias |
Cor dos textos das subcategorias |
--texto_submenutodascategorias |
Cor dos itens do submenu |
| Variável | Função |
|---|---|
--cor-quantidadecart |
Cor do fundo da bolinha de quantidade |
--cor-textoquantidadecart |
Cor do texto dentro da bolinha |
| Variável | Função |
|---|---|
--cor-botaobusca |
Cor do botão buscar desktop |
--cor-botaobuscamobile |
Cor do botão buscar mobile |
| Variável | Função |
|---|---|
--cor_botao_hover |
Cor ao passar mouse no botão |
--cor_texto_botao_hover |
Cor do texto no hover |
--cor_botao |
Cor padrão do botão |
--cor_texto_botao |
Cor do texto dentro do botão |
--cor_botao_comprar |
Cor do botão comprar |
| Variável | Função |
|---|---|
--cor_icones_hover |
cor ao passar mouse |
--cor_texto_icones |
texto junto aos ícones |
| Variável | Função |
|---|---|
--cor_newsletter |
fundo seção newsletter |
--cor_texto_newsletter |
texto |
--cor_topofertasfundo |
fundo barra ofertas |
--cor_topofertastexto |
texto da barra ofertas |
--cor_botaonewsletter |
botão newsletter |
--cor_textobotaonewsletter |
texto botão newsletter |
| Variável | Função |
|---|---|
--corpagamentosselosrodape |
cor selos pagamento |
--cor_footer |
cor fundo rodapé |
--cor_titulosrodape |
cor títulos |
--cor_texto_footer |
cor textos |
--texto_rodapemobile |
cor textos mobile rodapé |
| Variável | Função |
|---|---|
--cor_maisvendidos |
fundo seção mais vendidos |
--cor_textomaisvendidos |
texto mais vendidos |
--cor_textoavista |
cor texto “à vista/pix desconto” |
--backPixpg |
fundo destaque pix |
--cPixIcone |
cor ícone pix |
--textdescontopix |
mensagem exibida após valor |
--ativarestrelasproduto |
ativa estrelas nos produtos |
--qtdeavaliacoes |
quantidade padrão para avaliações |
| Variável | Função |
|---|---|
--removeroutrascategorias |
oculta outras categorias |
--font_family |
fonte principal |
--font_family_secundario |
fonte secundária |
--cor_closebuttoncarrinholateral |
cor botão fechar carrinho lateral |
--textosobrelojarodape |
texto exibido no rodapé sobre loja |
--tamanhodeconteiner |
largura máxima container |
--tamanhodeconteinerprodutos |
container da página produto |
--tamanhodeconteinerrodapes |
container rodapé |
sempre mantenha o
; no final sempre coloque cores usando:
nome da cor
código hexadecimal (#000)
rgba()
textos precisam ficar entre aspas
não retire variáveis do
:root
» Qualidade das imagens:
Nós, da GK Digital , recomendamos cadastrar os produtos com as imagens padrões, sendo todas do mesmo tamanho de 1000 x 1000px ou inferior para ficar conforme o demonstrativo.
A própria plataforma da Loja Integrada explica sobre a qualidade das imagens e sua resolução: esclarecimento Loja Integrada.
» PageSpeed:
Muitos lojistas ficam preocupados com as notas alcançadas por suas lojas no PageSpeed, e nós da GK Digital recomendamos comprimir sempre as imagens dos produtos e banners, podendo usar o site de compressão: https://compresspng.com/
A plataforma da Loja Integrada disponibilizou um artigo explicando mais sobre o PageSpeed: Como Melhorar a Minha Nota.
» Remoção do Logotipo da Loja Integrada:
É proibida a remoção do logotipo da Loja Integrada do rodapé da loja virtual, saiba mais nos Termos de Uso da plataforma.
» Remoção do Logotipo da agência:
É possível estar realizando a remoção do logotipo da agência do tema sim, porém todo o suporte do mesmo é perdido, conforme termos da plataforma.
As informações disponíveis pela Loja Integrada referente a Termos de Uso de compra de temas e serviços ficam disponíveis também no momento da compra.
Você finalizou todo o passo a passo e seu tema está prontinho!
Desejamos ótimas vendas e que seu novo tema deixe seus clientes ainda mais engajados com seus produtos ❤️
É um prazer tê-lo conosco na GK Digital!
A GK Digital cria e-commerces de alta performance nas principais plataformas como Loja Integrada, Tray e Nuvemshop — com foco total em vendas.
© 2025 AGÊNCIA GK DIGITAL – . Todos os direitos reservados - Proibida a reprodução total ou parcial sem autorização prévia.