Skip to main content

Visão geral

Se um HTML inválido ou quebrado for adicionado ao campo Custom HTML do Cart Editor, ele pode quebrar o layout e tornar a interface do editor inutilizável. Este guia mostra como corrigir temporariamente o layout para que você possa remover o código quebrado com segurança e restaurar a funcionalidade completa.

O que causa o problema

Esse problema geralmente ocorre quando um lojista:
  • Insere tags <style> ou <script> sem a estrutura adequada
  • Deixa tags HTML sem fechamento ou incompatíveis
  • Adiciona conteúdo que quebra o layout ao campo Custom HTML
Como resultado, o Cart Editor fica ilegível ou inutilizável e pode impedir os usuários de editar ou até de rolar a página.

Correção temporária usando as ferramentas de desenvolvedor

Siga estes passos para corrigir temporariamente o layout usando as Developer Tools do seu navegador e assim conseguir acessar o campo Custom HTML.

Passo 1: Abra o DevTools

  1. Abra o Cart Editor no app Upcart
  2. Clique com o botão direito em qualquer lugar da página e selecione Inspect, ou pressione:
    • Cmd + Option + I (Mac)
    • Ctrl + Shift + I (Windows)

Passo 2: Encontre o contêiner de layout quebrado

  1. Na aba Elements do DevTools, clique na ferramenta de seleção (canto superior esquerdo do DevTools)
  2. Passe o mouse sobre o layout do Cart Editor e encontre a seção destacada em verde à esquerda do painel de configurações. Ela deve estar rotulada como:
  3. Suba seis níveis na hierarquia até chegar a:

Passo 3: Desative a posição fixa

  1. Com .Polaris-Frame__Content selecionado, olhe na aba Styles
  2. Encontre a propriedade position: fixed e desmarque-a
Isso deve destravar a página e permitir que você role pelo layout novamente.

Remova o HTML inválido

Agora que o layout está acessível novamente:
  1. Role até o campo Custom HTML
  2. Procure qualquer HTML quebrado ou CSS incorporado que possa ter causado o problema
Exemplo do que costuma quebrar o layout:
  1. Copie o conteúdo para outro lugar como backup e depois exclua-o
  2. Salve suas alterações

Confirme que foi corrigido

Depois de salvar, o Cart Editor deve carregar normalmente de novo. Se o problema persistir, verifique novamente se há tags inválidas restantes ou entre em contato com o lojista para confirmar o que foi adicionado.

Boas práticas para evitar esse problema

  • Insira apenas HTML completo e válido
  • Evite adicionar blocos <style> inline diretamente nos locais de HTML
  • Use a seção Custom CSS em vez de adicionar CSS nos campos de HTML
  • Sempre visualize suas alterações no modo Sandbox se tiver dúvidas