Documentação do App Shopify
Tudo que você precisa para configurar e personalizar a conversão de moedas na sua loja Shopify
Índice
1 Instalação
Instalar pela Shopify App Store
- Acesse a página do app Currency.Wiki na Shopify App Store
- Clique em 'Adicionar app' e autorize a instalação
- O app será aberto e irá guiá-lo pelo assistente de configuração
- Conclua o assistente para começar a converter preços
Dica: O assistente de configuração leva cerca de 2 minutos e orienta em cada etapa.
2 Assistente de Configuração
O assistente de configuração ajuda a configurar o app corretamente. Ele orienta na atualização do formato de moeda e ativação da incorporação do app.
Passo 1: Bem-vindo
Revise o que envolve o processo de configuração e clique em 'Vamos Começar'.
Passo 2: Atualize o Formato de Moeda
Vá em Shopify Admin → Configurações → Geral → Padrões da loja. Encontre sua moeda e clique no menu de três pontos → 'Alterar formatação de moeda'. Atualize os campos HTML com nossa classe wrapper:
HTML com moeda:
<span class="cwiki">${{amount}} USD</span>
HTML sem moeda:
<span class="cwiki">${{amount}}</span>
Importante: A classe wrapper cwiki é essencial. Ela indica ao app quais elementos da página são preços, para converter apenas valores reais e não telefones ou IDs de pedidos.
Passo 3: Ative a Incorporação do App
Ative o app na seção de incorporações do seu tema:
- Vá em Loja Virtual → Temas → Personalizar
- Procure por 'App embeds' na barra lateral esquerda
- Encontre 'Currency.Wiki App' e ative
- Clique em Salvar no editor de temas
Passo 4: Verifique a Configuração
Clique em 'Escanear Minha Loja' para verificar se a configuração está completa. O assistente checará a classe wrapper cwiki e a incorporação do app. Se tudo estiver certo, você está pronto!
3 Estilos do Widget
Escolha entre 6 estilos de widget para combinar com o design da sua loja. Cada estilo pode ser personalizado com as cores da sua marca.
Menu Suspenso Minimalista
Integração compacta no cabeçalho com lista simples. Melhor para o topo direito do cabeçalho.
Botão Flutuante
Botão flutuante para mobile com painel expansível. Ótimo para lojas mobile-first. Posiciona nos cantos.
Painel Lateral
Painel deslizante de altura total com busca. Ideal para lojas com muitas moedas.
Popup Modal
Sobreposição centralizada com layout em grade. Torna a seleção de moeda uma experiência focada.
Abas em Linha
Abas horizontais para moedas populares. Troca rápida sem abrir menus.
Ícone de Canto
Ícone minimalista no canto que expande ao clicar. Menos intrusivo para designs limpos.
Dica: Use a página de configurações do widget no painel do app para visualizar todos os estilos com as cores da sua loja.
4 Painel Administrativo
O painel administrativo oferece controle total sobre como a conversão de moedas funciona em sua loja.
Início do Painel
Ative/desative o widget, veja estatísticas de conversão e visualize seu widget ao vivo.
Configurações do Widget
Escolha o estilo, posição, cores, tamanho, bordas e opções de bandeira do widget.
Gerenciamento de Moedas
Ative/desative moedas, reordene a lista, configure detecção automática e preferências de taxas.
Análises
Veja gráficos de conversão, moedas mais usadas e distribuição de clientes internacionais.
Tema & Aparência
Escolha modo de tema (auto, claro, escuro, personalizado), defina cores, ative efeitos de glassmorphism e configure o modo escuro.
Mensagem no Checkout
Ative uma mensagem no carrinho/checkout para informar sobre a moeda do pagamento.
5 Configurações Avançadas
As configurações avançadas dão mais controle aos usuários Pro sobre formatação e comportamento da conversão.
Formatação de Preços (Pro)
- Casas Decimais - Controle quantas casas decimais exibir (0-6).
- Formato do Número - Escolha o estilo (Auto, US, EU, Indiano, Espaço•Ponto, Espaço•Vírgula).
- Posição do Símbolo - Coloque o símbolo antes ou depois do valor, ou automático por moeda.
- Arredondamento - Padrão, sempre para cima, sempre para baixo ou sem arredondamento. Opção para arredondar para .99.
Integração com Tema (Pro)
Incorpore manualmente o widget ou aviso do carrinho em qualquer lugar do tema usando estes trechos de HTML:
Incorporação do widget (adicione em header.liquid ou qualquer seção):
<div class="cwiki-widget"></div>
Aviso do carrinho (adicione em cart.liquid):
<div class="cwiki-banner"></div>
Opções para Desenvolvedores (Pro)
- Sobreposição de Estilos - Insira CSS personalizado para ajustar o estilo do widget.
- Listeners de Clique - Reconverta preços ao clicar em elementos específicos (ex: tamanhos, opções de produto).
- Elementos de Preço Extras - Alvo para elementos de preço além do padrão .cwiki.
- Padrões de URL - Reescaneie preços quando a URL contiver strings específicas (para AJAX, rolagem infinita).
- Atraso na Conversão - Aguarde antes de converter preços (para conteúdo que carrega após a página pronta).
Atenção: Essas opções são para usuários avançados. Teste em um tema de pré-visualização antes de publicar.
6 Solução de Problemas
Preços não estão sendo convertidos?
Certifique-se de que a classe wrapper cwiki está nas configurações de formato de moeda. Vá em Configurações → Geral → Padrões da loja e verifique o HTML. Também confira se a incorporação do app está ativada no personalizador de tema.
Widget não aparece?
Verifique se a incorporação do app está ativada na seção App Embeds do seu tema. Abra o personalizador de tema, encontre App Embeds e ative o Currency.Wiki. Salve e atualize sua loja.
Preços piscando ao carregar?
Nosso app foi projetado para carregamento sem piscar. Se notar isso, verifique se há plugins de cache interferindo. Certifique-se também de que a incorporação do app está carregando no head do tema.
Moeda errada sendo detectada?
A detecção é baseada no IP do visitante. VPNs ou redes corporativas podem afetar. Visitantes sempre podem selecionar a moeda manualmente. Você também pode definir uma moeda padrão nas configurações.
Widget não combina com meu tema?
Use as configurações de Tema & Aparência para personalizar as cores, ou ative o modo Auto para detectar as cores do tema automaticamente. Também é possível usar CSS personalizado nas Configurações Avançadas.
Precisa de Ajuda?
Nossa equipe de suporte está pronta para ajudar com dúvidas sobre configuração ou uso.
