Skip to main content
⚠️ Aviso importante Esta personalização funciona apenas com a Versão 1 dos módulos de carrinho do Upcart. Se você atualizou recentemente seu carrinho para a Versão 2, essas personalizações podem não funcionar. Você precisará usar os novos seletores fornecidos para a Versão 2 no guia de migração. Se suas personalizações não estiverem funcionando como esperado, você também pode reverter seu carrinho para a Versão 1 em vez de usar a Versão 2. No momento, estamos trabalhando em novos modelos de personalização para a Versão 2 dos módulos, e eles estarão disponíveis em breve.

Visão geral

Se as imagens dos seus produtos parecem esticadas, achatadas ou cortadas no Upcart, isso geralmente é causado por um conflito de estilo do tema. Alguns temas do Shopify aplicam estilos globais de imagem que afetam como as imagens de produto são exibidas dentro do Upcart. Você pode corrigir esse problema adicionando uma pequena personalização de CSS diretamente nas configurações do editor do Upcart.

Como corrigir

Siga estes passos para aplicar uma personalização de CSS que preserva as proporções das imagens dos seus produtos.

Acessando as configurações de CSS personalizado

  1. Abra o app Upcart no seu painel do Shopify.
  2. Navegue até o Cart Editor.
  3. Abra Settings e selecione a aba Custom CSS. Settings é uma linha de abas — se você não vir Custom CSS, ela está atrás de More settings.

Adicionando o CSS

  1. Copie e cole o seguinte trecho de CSS no campo Custom CSS:
  1. Salve suas alterações.
  2. Atualize sua loja e abra o Upcart para confirmar que as imagens agora são exibidas corretamente.

Por que isso acontece

Alguns temas do Shopify aplicam regras de CSS globais que redimensionam ou cortam imagens de formas que afetam como elas aparecem em apps de terceiros como o Upcart. Essas regras podem sobrepor o estilo padrão do Upcart e distorcer as proporções das imagens. O trecho de CSS acima garante que as imagens de produto mantenham sua proporção original e sejam exibidas corretamente tanto em desktop quanto em dispositivos móveis.