Aplicativos da Web super progressivos
Aplicativos da Web super progressivos
O Superpwa ajuda a converter seu site WordPress em aplicativos da Web progressivos com facilidade.
Visite o site »
Relatório Bug · Plug -in WordPress · Revisões · FAQ · Contribuições
Bem -vindo ao Repositório Super PWA Github
⚡️ Demo: superpwa.com Verifique os vídeos para saber como funciona
O que são aplicativos da Web progressivos
O Progressive Web Apps (PWA) é uma nova tecnologia que cria um meio termo entre um site e um aplicativo móvel. Eles são instalados no telefone como um aplicativo normal (aplicativo da web) e podem ser acessados na tela inicial.
Os usuários podem voltar ao seu site lançando o aplicativo na tela inicial e interagem com seu site através de uma interface semelhante ao aplicativo. Seus visitantes de retorno experimentarão tempos de carregamento quase instantâneos e desfrutarão dos ótimos benefícios de desempenho do seu PWA!
Os aplicativos da Web super progressivos facilitam a conversão do site WordPress em um aplicativo da Web progressivo facilmente!
Apoie o projeto
Se você se sentir super animado e quiser nos apoiar de uma maneira pequena, considere estrelar e/ou compartilhar o repositório! Isso nos ajuda a ser conhecidos e a aumentar a comunidade.
Além disso, você pode nos apoiar por meio das seguintes mídias sociais e compartilhar sobre nós.
? Instalação
Depois que a Superpwa ⚡️ estiver instalada, os usuários navegando no seu site a partir de um dispositivo móvel suportado verão um aviso "Adicionar à tela inicial" (da parte inferior da tela) e poderá 'instalar seu site' na tela inicial do dispositivo. Cada página visitada é armazenada localmente em seu dispositivo e estará disponível para ler mesmo quando estiver offline!
O Superpwa é fácil de configurar, leva menos de um minuto para configurar seu aplicativo da Web progressivo! O Superpwa faz uma desinstalação limpa, removendo todas as entradas e arquivos do banco de dados que ele cria. De fato, nenhuma das configurações padrão é salva no banco de dados até você salvá -lo manualmente pela primeira vez. Vá em frente e experimente.
Requisitos mínimos progressivos do aplicativo da web
Vídeos sobre como adicionar à tela inicial e aplicativos da Web Progressive funciona em diferentes navegadores
Google Chrome para Android |
Mozilla Firefox para Android |
Microsoft Edge para Android |
Samung Internet para Android |
PWA no iOS - navegador Safari |
|---|
Documentações detalhadas para testar PWA em navegadores
- PWA no Chrome para Android
- PWA na área de trabalho - Chrome
- PWA no dispositivo iOS - navegador Safari
- PWA no navegador Microsoft Edge para Android
- PWA no navegador da Internet Samsung para Android
? O que está na caixa
Aqui estão os recursos atuais dos aplicativos da Web super progressivos:
- Gere um manifesto para o seu site e adicione -o ao chefe do seu site.
- Defina o ícone do aplicativo para o seu aplicativo da Web Progressive.
- Defina a cor de fundo para a tela Splash do seu aplicativo da Web progressivo.
- Seu site mostrará o aviso "Adicionar à tela inicial" quando acessado em um navegador suportado.
- Cache agressivo de páginas usando API de CacheStorage.
- As páginas após o cache são servidas mesmo que o usuário esteja offline.
- Defina a página offline personalizada: selecione a página que deseja que o usuário veja quando uma página que não está no cache é acessada e o usuário está offline.
- Novo na versão 1.2: Suporte para tema-cor.
- Novo na versão 1.2: agora você pode editar o nome do aplicativo e o nome do aplicativo.
- Novo na versão 1.2: defina a página inicial do seu PWA.
- Novo na versão 1.2: defina a versão acelerada de páginas móveis (AMP) da página inicial. Plugins suportados: AMP para WordPress, AMP para WP, Better AMP, AMP Supremacia, WP AMP.
- Novo na versão 1.3: Suporte adicionado para tela de respingo de alta qualidade. Agora você pode definir o ícone 512x512 para a tela Splash do seu aplicativo da Web progressivo.
- NOVO NA VERSÃO 1.3: Os aplicativos da Web Super Progressive agora são responsáveis por atualizações de conteúdo e atualizam o cache ao atualizar o site.
- NOVO NA VERSÃO 1.3: Manipulação aprimorada de atualização do trabalhador de serviço no navegador.
- Novo na versão 1.4: agora você pode definir a orientação padrão do seu PWA. Escolha em "qualquer" siga a orientação do dispositivo), "retrato" e "paisagem".
- Novo na versão 1.4: agora você pode definir a propriedade tema_color no manifesto.
- Novo na versão 1.5: Integração OneSignal para Notificações de Push.
- Novo na versão 1.6: compatibilidade com rede multisite do WordPress.
- Novo na versão 1.7: os complementos para Superpwa estão aqui! Navios com o complemento de rastreamento UTM para visitas de faixa provenientes do seu PWA.
- Novo na versão 1.8: Os problemas de compatibilidade com o OneSignal agora estão resolvidos!
- Novo na versão 1.8: Novo complemento: ícones Apple Touch que define seus ícones de aplicativos como ícones do Apple Touch.
- Novo na versão 2.0: o Superpwa agora é compatível com o WordPress instalado em um subpasto.
- Novo na versão 2.0: agora você pode definir a propriedade Display das configurações Superpwa.
- Novo na versão 2.1.1: Suporte para ícones Maskabale.
? Próximos recursos:
- Aviso de indicador offline.
Suporte de dispositivo e navegador para PWA
| Cromo | Firefox | Borda | Ópera | Safári | Samsung | Navegador UC | Corajoso |
|---|
| Adicionar à tela inicial | | | | | | | | |
| Trabalhadores de serviço | | | | | | | | |
| Push e notificações na web | | | | | | | | |
| API de solicitação de pagamento | | | | | | | - | - |
| META TEMA COR | | - | - | - | - | | - | |
Beta apoiado ou apoio parcial no desenvolvimento
Os aplicativos da Web progressivos precisam de navegadores que apóiam manifestos e trabalhadores de serviço. Atualmente, Google Chrome (versão 57+), Chrome for Android (62), Mozilla Firefox (57), Firefox para Android (58) são os principais navegadores que suportam a PWA.
A lista está crescendo rapidamente e provavelmente será apoiada na maioria dos principais navegadores até o final deste ano.
Por que criar aplicativos da Web progressivos?
Como converter seu site WordPress em um aplicativo da Web progressivo
Instalação do WordPress
- Visite WordPress Admin> Plugins > Adicionar novo
- Procure aplicativos da Web super progressivos
- Clique em " Instalar agora " e depois " Ativar " Aplicativos da Web Super Progressive
Para instalar manualmente:
- Faça upload da pasta superprogressiva-web-apps no/wp-content/plugins/diretório em seu servidor
- Vá para o WordPress Admin> Plugins
- Ative o plug -in de aplicativos da web super progressivo da lista.
Personalizando seu aplicativo Web progressivo
Seu aplicativo da Web progressivo deve estar pronto para testar com as configurações padrão após a ativação. Você pode personalizá -lo ainda mais e torná -lo realmente seu.
- Vá para o WordPress Admin> " Superpwa "> Configurações
- Defina uma cor de fundo para a tela Splash a ser mostrada quando o seu PWA é aberto em um dispositivo móvel.
- Defina o ícone do aplicativo. Este será o ícone do seu PWA quando for adicionado à tela inicial em um dispositivo móvel. O ícone deve ser uma imagem PNG e exatamente 192 x 192 pixels de tamanho.
- Defina a página offline. Esta página será exibida se o usuário estiver offline e a página solicitada ainda não estiver em cache. Idealmente, você deve criar uma página dedicada do WordPress e defini -la aqui. Na página que você cria, você pode adicionar uma nota que diz: "Parece que você está offline e a página solicitada não está disponível agora. Verifique novamente quando estiver online.".
- Clique em "Salvar configurações".
Testando seu aplicativo Web progressivo
- Abra um navegador suportado em um dispositivo suportado (para por exemplo: Chrome para Android (62 ou superior) em um dispositivo Android)
- Digite seu site e espere até que ele carregue totalmente
- Você deve ver um pop-up que tenha seu ícone de aplicativo e um botão que diz "Adicionar à tela inicial".
- Clique nele e seu PWA será adicionado à tela inicial. Aguarde a conclusão da instalação.
- Vá para a tela inicial e abra seu PWA. Navegue em algumas páginas, se quiser. Feche o aplicativo.
- Desconecte -se da Internet e agora abra seu PWA novamente. Você deve ver todas as páginas que você navegou anteriormente.
- Tente visitar uma página que você não visitou antes. Você deve ver a página definida como sua "página offline" nas configurações do Superpwa.
? Sobre nós
Somos uma dupla que ficou empolgada com a ideia. Nossa missão é simples: ajude você a criar um PWA incrível que seus usuários desejam ter na tela inicial. Quando ouvimos falar da PWA, queríamos aprender tudo sobre isso. Passamos inúmeras horas aprendendo e queremos compartilhá -lo com o mundo. Por favor, dê -nos seu feedback e suporte construtivos.
⛷️ Suporte
Este é o portal de um desenvolvedor para aplicativos da Web super progressivo e não deve ser usado para suporte. Visite os fóruns de suporte.
? Relatórios de bugs
Se você ficar preso, estamos aqui para assistir suas costas! Abra um novo ticket de tópico de suporte se você tiver uma pergunta ou precisar de um recurso. Estamos super empolgados em ouvir seus comentários e queremos ajudá -lo a criar o melhor aplicativo da Web progressivo para o seu site WordPress!
? Contribuições
Qualquer um pode contribuir com o Super PWA para torná -lo super.
Existem várias maneiras de contribuir:
- Levantar um problema no Github.
- Siga e se envolva conosco nas mídias sociais
Compartilhe no Twitter
Compartilhe no Facebook
Compartilhe no LinkedIn
? Changelog
Superpwa.com/changelog/.
Créditos emoji: Ícone de mídia social emojipedia Créditos: FLATICON
⬆ de volta ao topo
