Novo Módulo - App na Tela Inicial (PWA)
Novo
O módulo App na Tela Inicial (PWA) transforma sua loja Magento 1 em um aplicativo que o cliente instala na tela inicial do celular, com ícone próprio e abertura em tela cheia. Não é preciso publicar nada na Play Store ou na App Store — o aplicativo roda sobre o site que você já tem. Uma faixa de convite aparece na loja e explica ao cliente como instalar: com um toque no Android e com um passo a passo ilustrado no iPhone.
O que o módulo faz
- Permite que o cliente instale a loja como aplicativo na tela inicial do celular, com ícone e nome próprios
- Abre a loja em tela cheia, sem a barra de endereço do navegador
- Gera automaticamente todos os tamanhos de ícone a partir de uma única logo enviada no painel
- Exibe uma faixa de convite personalizável, com texto e comportamento diferentes para Android, iPhone e computador
- Instala com um único toque no Android, pelo botão da própria faixa
- Cria sozinho a página com o tutorial ilustrado de instalação, necessária no iPhone
- Mostra uma tela de abertura com a logo da loja enquanto o aplicativo carrega
- Exibe uma página personalizada quando o cliente está sem conexão
- Permite configurar todos os nomes, textos e cores diretamente pelo painel administrativo
- Nunca guarda preços, carrinho ou checkout — essas páginas são sempre buscadas atualizadas
- Pode ser ativado e configurado de forma independente para cada visão de loja
Onde fica
Caminho no admin
Sistema → Configuração → Tema Mageshop → App na Tela Inicial (PWA)
Configurações disponíveis
Bloco: Geral
| Campo | Descrição |
| Habilitar PWA | Ativa o aplicativo na loja. Ao ativar, a página com o tutorial de instalação é criada automaticamente, se ainda não existir. |
| Nome do App | Nome completo do aplicativo. Se ficar vazio, usa o nome da loja. |
| Nome Curto | Nome exibido embaixo do ícone na tela inicial do celular. O ideal é até 12 caracteres. |
| Descrição | Frase curta que descreve o aplicativo. |
| URL de Início | Página que o aplicativo abre ao ser iniciado. O padrão inclui uma marcação que permite medir, nos relatórios, os acessos vindos do app. |
Bloco: Aparência
| Campo | Descrição |
| Modo de Exibição | Como o aplicativo abre: como aplicativo sem barra do navegador (recomendado), tela cheia total, com uma barrinha do navegador ou como o site normal. |
| Cor de Fundo ao Carregar | Cor exibida atrás da logo enquanto a loja abre dentro do aplicativo. |
| Tela de Abertura | Liga a tela que mostra a logo da loja durante o carregamento do aplicativo. |
| Mostrar em | Em quais aparelhos exibir a tela de abertura: iPhone e Android (padrão) ou somente iPhone. |
| Texto | Frase exibida abaixo do indicador de carregamento na tela de abertura. |
| Cor do Texto | Cor do texto e do indicador de carregamento da tela de abertura. |
| Orientação da Tela | Trava o aplicativo na vertical ou na horizontal. Vale apenas para Android. |
| Cor da Barra do Sistema | Cor da barra superior do celular com o aplicativo aberto. Vale apenas para Android. |
| Barra de Status | Aparência da barra com relógio e bateria no iPhone. O padrão é barra sólida escura. |
Bloco: Ícone do App
| Campo | Descrição |
| Logo / Ícone | Imagem quadrada em PNG, com no mínimo 512x512 pixels. Todos os tamanhos de ícone e as telas de abertura são gerados a partir dela. |
| Cor de Fundo do Ícone | Cor aplicada atrás da logo ao gerar os ícones. Essencial para logos com fundo transparente. Deixe vazio para manter a transparência. |
Bloco: Banner de Instalação
| Campo | Descrição |
| Exibir Banner de Instalação | Liga a faixa que convida o cliente a instalar o aplicativo. |
| Exibir Ícone/Logo no Banner | Define onde mostrar a miniatura da logo dentro da faixa: celular e computador, somente celular, somente computador ou não exibir. |
| Título do Banner | Título em destaque da faixa de convite. |
| Mensagem (Android) | Texto exibido no Android, onde a instalação acontece com um toque. |
| Mensagem (iOS) | Texto exibido no iPhone, onde a instalação é manual. |
| Mensagem (Computador) | Texto exibido no computador, onde a faixa é informativa e leva ao tutorial. |
| Texto do Botão Instalar (Android) | Texto do botão de instalação com um toque, exibido só no Android. |
| URL do Tutorial de Instalação (iOS) | Endereço da página com o passo a passo. Já vem preenchido com a página criada automaticamente pelo módulo. |
| Texto do Botão do Tutorial (iOS) | Texto do botão que abre a página do tutorial, exibido no iPhone e no computador. |
| Abrir Tutorial em Nova Aba (iOS) | Define se a página do tutorial abre em nova aba, mantendo a loja aberta. |
| Reexibir após (dias) | Quantos dias esperar para mostrar a faixa novamente depois que o cliente a fecha. |
Bloco: Cores do Banner
| Campo | Descrição |
| Cor de Fundo do Banner | Cor de fundo da faixa de convite. |
| Cor do Título | Cor do título em destaque da faixa. |
| Cor da Mensagem | Cor do texto explicativo da faixa. |
| Cor de Fundo do Botão | Cor de fundo do botão de instalar ou do botão do tutorial. |
| Cor do Texto do Botão | Cor do texto dentro do botão. |
Bloco: Página Offline
| Campo | Descrição |
| Título | Título exibido quando o cliente abre o aplicativo sem conexão. |
| Mensagem | Texto explicativo exibido na página sem conexão. |
| Texto do Botão | Texto do botão que recarrega a página quando a internet volta. |
| Cores da página | Cor de fundo, cor do texto, cor de fundo do botão e cor do texto do botão. Deixando a cor de fundo vazia, ela acompanha a cor da tela de carregamento. |
Principais vantagens
- Presença no celular do cliente sem a burocracia e o custo de manter um aplicativo em loja de aplicativos
- Recompra mais fácil: a loja fica a um toque, ao lado dos aplicativos que o cliente mais usa
- Uma única logo gera todos os ícones e telas de abertura, sem trabalho adicional de design
- Convite adaptado a cada aparelho, com tutorial ilustrado já pronto para o iPhone
- Identidade visual da loja preservada do ícone à tela de abertura, com cores configuráveis
- Seguro para e-commerce: preços, carrinho e checkout nunca são armazenados no aparelho
- Ativação e desativação pelo próprio painel, de forma independente para cada visão de loja
Quer essa funcionalidade na sua loja?
Entre em contato com a equipe mageshop e saiba como ativar o módulo App na Tela Inicial (PWA).
Fale com a mageshop