Aparência
Testar e publicar
Selecionar ou trocar um tema
No editor, use Trocar tema para abrir o catálogo de temas em /admin/temas. Escolha um tema, confira sua demonstração e prepare a instalação no editor. A loja continua com o tema publicado até você usar Publicar. Se houver alterações pendentes ao sair do editor, confirme o descarte ou continue editando.
Atualizações dos temas oficiais, incluindo informações de produto, formulários de senha e menu de conta, entram em lojas existentes por uma nova revisão. Restaurar o original prepara os arquivos oficiais atuais; revise suas personalizações antes de publicar.
Primeiro tema após o cadastro
Ao criar uma loja no Node, a pergunta O que sua loja irá vender? permite preparar seu primeiro tema com IA em background. O painel mostra o andamento enquanto você continua a configuração. Esse fluxo pode publicar automaticamente a primeira revisão, desde que você ainda não tenha publicado um tema. Uma publicação sua durante a preparação é preservada.
A instância que recebe o cadastro inicia a preparação logo após confirmar a loja, sem esperar uma consulta periódica da fila. Tema e imagens avançam em paralelo. Se o servidor for interrompido, após três minutos o acompanhamento oferece Tentar novamente; a retomada reaproveita o trabalho já salvo.
Na etapa Imagens, o painel informa quantas fotos já estão prontas. Se uma geração exceder o tempo disponível, a preparação oferece Tentar novamente e reaproveita as fotos já gravadas. Falhas isoladas de acompanhamento preservam a última etapa; se a sessão for recusada, use Entrar novamente para retomar o acompanhamento.
Os seis produtos fictícios vêm identificados como exemplos. Revise seus dados no cadastro de produtos antes de vender. O tema deve usar os objetos Liquid para exibir os dados do catálogo, preservando a identificação dos exemplos. Eles são criados com estoque zero e venda sem estoque habilitada; seus cards e ações de compra seguem a disponibilidade comercial normal na primeira Home. A preparação completa as fontes das listagens iniciais do Aura e retira filtros de estoque dessas vitrines. Depois, você pode definir filtros comerciais pelo editor normalmente.
A adaptação inicial personaliza a Home ao ramo, incluindo banner, categorias, vitrines, apresentação da marca e três depoimentos preenchidos sem rótulos de exemplo na vitrine. Ela começa em paralelo à geração das imagens, depois de salvar o catálogo; não espera as fotos para gerar os arquivos. A IA recebe todos os arquivos editáveis e gera alterações localizadas, preservando logo, capas e fotos cadastradas. A tarefa é enviada diretamente à geração de código, sem uma chamada extra de interpretação. Usa esforço de raciocínio baixo no mesmo modelo, sem reduzir a qualidade das imagens. O banner editorial também é gerado em paralelo, usando o ramo e as categorias da loja. A IA já conhece o caminho assets/images/banner.webp e o usa no tema, sem solicitar outra imagem depois da resposta. O arquivo substitui o banner original no bundle; a prévia aguarda sua conversão para WebP e a publicação só ocorre após conferir também a logo, as capas e as fotos. Se o banner falhar, a preparação oferece retomada. Essa antecipação se limita à criação inicial; as edições posteriores continuam escolhendo imagens conforme o pedido. Categorias sem capa podem usar fotos de produtos vinculados. O tempo ainda depende do provedor; os diagnósticos de etapas e tokens continuam ativos. Os logs no terminal identificam o início e o encerramento das tarefas por loja e trabalho. A criação só conclui após confirmar a logo associada e disponível no contexto da vitrine. Uma logo ausente interrompe a publicação inicial e permite retomar a preparação, reaproveitando as imagens já gravadas.
A geração inicial usa cache explícito do manual e do bundle completo quando esse prefixo já foi processado. Os dados de cada loja vêm depois do prefixo; nenhuma resposta gerada é reutilizada. A primeira Home também passa por revisão do HTML: produtos, fotos, capas e logo cadastradas devem aparecer. Se um bloco perder seu vínculo comercial, a preparação recupera o Liquid funcional daquele bloco sem outra chamada à IA e preserva a personalização dos demais arquivos. Se a vitrine ainda estiver incompleta, ela não é publicada automaticamente.
As edições posteriores continuam livres para alterações amplas conforme seu pedido.
A geração pelo catálogo, a edição e a troca de temas depois dessa preparação inicial continuam sendo rascunhos que você revisa e publica explicitamente.
Prepare uma alteração revisável
Exporte a revisão aberta pelo menu •••, guarde o original e edite uma cópia. Ao gerar o ZIP, selecione os arquivos e pastas internos: theme.json precisa estar na raiz.
A importação valida o pacote e prepara uma revisão-base não ativa. O JavaScript importado deve permanecer idêntico ao da revisão-base. Consulte os limites e formatos aceitos.
Confira a prévia
Verifique as páginas afetadas, navegação, modos desktop e celular, foco de teclado, textos longos, listas vazias e produtos sem imagem. Preserve os hooks data-* quando alterar a estrutura de compra.
A prévia não comprova uma compra real: o runtime bloqueia mutações de carrinho, checkout e pagamentos nesse contexto. Conta e pedidos usam dados fictícios nas prévias de conta. Fluxos comerciais exigem homologação própria em ambiente autorizado.
Em um Codespace ou servidor de desenvolvimento com origem local configurada, Visitar loja pode abrir a revisão publicada usando o código desse servidor. A loja é selecionada pelo endereço público validado, e a navegação continua na mesma origem local. Essa visita usa a revisão publicada; alterações em rascunho continuam disponíveis pela prévia do editor. Em produção, o link continua abrindo o domínio público da loja.
Publique explicitamente
Use Publicar e confirme. Uma revisão publicada é imutável. No editor e no catálogo, alterar arquivos localmente, importar ou gerar uma proposta pela IA não substitui automaticamente a revisão ativa.
A criação inicial autorizada no cadastro prepara e publica a primeira vitrine. Nesse fluxo, a IA gera em paralelo uma logo com o nome e o ramo da loja, capas para as categorias que criou e fotos dos produtos de exemplo. O tema usa a logo global e as capas cadastradas. A adaptação do tema começa junto às imagens; depois da gravação, as cores da logo são aplicadas às variáveis de marca do CSS sem outra chamada de IA. Uma troca de logo pelo lojista preserva a nova identidade. A revisão final e a publicação aguardam todas as imagens e usam o contexto atualizado da loja. Revise o resultado antes de vender. Imagens enviadas pelo lojista e vitrines já publicadas são preservadas; edições posteriores seguem a publicação explícita descrita nesta página.
As capas geradas no cadastro são artes de coleção com o nome da categoria, composição quadrada e margem para recorte. No Aura, o CSS contém essas imagens em cards quadrados com object-fit: cover; suas dimensões originais não aumentam a altura do card. O nome e o link também permanecem no HTML. Fotos de produto e banners continuam usando suas orientações próprias. As mudanças de prompt e do tema-base não refazem capas nem substituem revisões de lojas já publicadas.
Os outros temas preservam seu formato: Brisa usa recorte 4 / 5, Nova e Cobalto usam 4 / 3, e Fluxo contém a foto dentro do card. Esses recortes não deixam a altura original da foto ampliar o bloco. Lumen e Vértice não possuem cards de capa na Home-base; Pulso apresenta categorias como links de texto.
Se outra operação publicou uma revisão enquanto você trabalhava, preserve seu rascunho e siga a indicação do editor para resolver a divergência. Não repita importações ou publicações indiscriminadamente após uma falha de rede.
A troca de logo também aguarda Publicar, mesmo quando nenhuma alteração de layout foi feita. Antes disso, somente a prévia mostra a imagem nova. Descartar troca de logo mantém a imagem publicada. Logo e layout são ativados juntos; se outra operação alterou o tema ou a logo global, resolva a divergência antes de publicar. A logo pertence à loja e permanece ao trocar de tema; não integra o ZIP.
Enquanto a loja não tiver uma logo publicada, o cartão Logo da loja fica visível no editor. Depois da publicação, abra Mais opções (•••) e escolha Alterar logo da loja para mostrar novamente o cartão, inclusive a opção de usar suas cores no tema.
No cartão Favicon da loja, você pode enviar uma imagem ou usar Gerar a partir da logo. Se a IA falhar, o editor cria o favicon diretamente da logo e avisa qual método foi usado. O favicon gerado também aguarda Publicar. Enquanto não houver um favicon publicado, o cartão fica visível no editor. Depois, use Mais opções (•••) → Alterar favicon da loja para abri-lo novamente.
Edite imagens no contexto da página
Use Trocar banner para escolher o banner da página e descrever a alteração. Você pode anexar uma nova arte ao pedido. Para imagens de outros elementos, descreva a mudança ao assistente ou use a ação específica do elemento quando disponível. A IA conhece os caminhos das imagens existentes no tema.
Não há recorte automático para celular. Prefira artes sem texto embutido e deixe títulos e botões no HTML do tema, que se adapta a cada tela. As alterações ficam no rascunho e entram na loja ao Publicar.
Histórico e restauração
O histórico resume as diferenças de arquivos entre cada versão e sua origem na mesma loja. Ao usar Visualizar versão, o editor abre uma página afetada quando possível, rola até os elementos identificados e os destaca brevemente. Uma alteração removida ou sem elemento visível pode não ter um ponto para destacar. A primeira versão sem origem indica a instalação inicial; cópias e revisões originadas no tema oficial são identificadas. Publicações novas informam trocas confirmadas de logo e favicon, mesmo quando o bundle não mudou. Revisões antigas sem esse registro não permitem identificar qual imagem foi alterada. Os horários são exibidos no fuso de São Paulo.
Restaurar uma versão ou o tema original prepara outra cópia para revisão; publicar continua sendo uma ação explícita. As versões posteriores são preservadas. O histórico exibe e mantém a logo global atual, sem restaurar logos antigas. Preparar uma restauração descarta a troca de logo ainda pendente.
Rascunhos e saída
Alterações da IA e a logo pendente ficam na memória do navegador e são descartadas ao sair confirmando o descarte. Rascunhos importados ou restaurados têm uma revisão-base persistida, mas alterações posteriores ainda precisam de publicação. Não há promessa de salvar e continuar entre sessões para todo o rascunho.
No menu Mais opções (três pontinhos), o link Documentação de temas abre em outra aba para você consultar os recursos sem sair da edição.
Disponibilidade da assinatura
Novas lojas criadas pelo cadastro Node recebem uma avaliação de sete dias, quando a estrutura comercial estiver provisionada. Ao terminar a avaliação sem contratação, o tema, as revisões e os demais dados da loja são preservados. A publicação e os recursos pagos ficam pausados; o titular pode entrar no painel para consultar a assinatura e contratar posteriormente.
A IA possui créditos separados das permissões de edição. Consultas de texto e imagens podem consumir quantidades diferentes. Consulte Minha conta → Assinatura para o consumo e a política aplicável. A contratação depende da integração com o faturamento da plataforma; o painel informa quando ela ainda não está disponível. Contratos legados conservam suas condições até uma migração controlada.