Applications Web super progressistes
Applications Web super progressistes
SuperPwa aide à convertir facilement votre site Web WordPress en applications Web progressives.
Visitez le site Web »
Rapport Bug · Plugin WordPress · Revues · FAQ · Contributions
Bienvenue dans le référentiel Super PWA Github
⚡️ démo: superpwa.com cochez les vidéos pour savoir comment cela fonctionne
Qu'est-ce que les applications Web progressives
Les applications Web progressives (PWA) sont une nouvelle technologie qui crée un terrain d'entente entre un site Web et une application mobile. Ils sont installés sur le téléphone comme une application normale (application Web) et sont accessibles à partir de l'écran d'accueil.
Les utilisateurs peuvent revenir sur votre site Web en lançant l'application à partir de leur écran d'accueil et interagir avec votre site Web via une interface de type d'application. Vos visiteurs de retour connaîtront des temps de chargement presque instants et profiteront des avantages sociaux de votre PWA!
Les applications Web super progressistes vous permettent de convertir facilement votre site Web WordPress en une application Web progressive!
Soutenir le projet
Si vous vous sentez super excité et que vous souhaitez nous soutenir d'une petite manière, veuillez envisager de jouer et / ou de partager le repo! Cela nous aide à faire connaître et à développer la communauté.
Vous pouvez également nous soutenir en suivant les réseaux sociaux et partager sur nous.
? Installation
Une fois la superpwa ⚡️ installée, les utilisateurs naviguant sur votre site Web à partir d'un appareil mobile pris en charge verront un avis "Ajouter à l'écran d'accueil" (en bas de l'écran) et pourra "installer votre site Web" sur l'écran d'accueil de leur appareil. Chaque page visitée est stockée localement sur son appareil et sera disponible pour lire même lorsqu'elle est hors ligne!
SuperPWA est facile à configurer, il faut moins d'une minute pour configurer votre application Web progressive! SuperPwa fait une désinstallation propre, en supprimant chaque entrée et fichier de base de données qu'il crée. En fait, aucun des paramètres par défaut n'est enregistré dans la base de données jusqu'à ce que vous l'enregistrez manuellement la première fois. Allez-y et essayez-le.
Exigences minimales de l'application Web progressive
Des vidéos sur la façon dont l'ajout de l'écran d'accueil et des applications Web progressives fonctionne sur différents navigateurs
Google Chrome pour Android |
Mozilla Firefox pour Android |
Microsoft Edge pour Android |
Internet Samung pour Android |
PWA sur iOS - SAFARI BROWNER |
|---|
Documents détaillés pour tester PWA sur les navigateurs
- PWA sur Chrome pour Android
- PWA sur le bureau - Chrome
- PWA sur le périphérique iOS - SAFARI BROWSER
- PWA sur le navigateur Microsoft Edge pour Android
- PWA sur le navigateur Internet Samsung pour Android
? Qu'y a-t-il dans la boîte
Voici les fonctionnalités actuelles des applications Web super progressistes:
- Générez un manifeste pour votre site Web et ajoutez-le à la tête de votre site Web.
- Définissez l'icône de l'application pour votre application Web progressive.
- Définissez la couleur d'arrière-plan pour l'écran Splash de votre application Web progressive.
- Votre site Web affichera l'avis "Ajouter à l'écran d'accueil" lorsqu'il est accessible dans un navigateur pris en charge.
- Cache agressive des pages à l'aide de l'API de cachestorage.
- Les pages une fois mises en cache sont servies même si l'utilisateur est hors ligne.
- Définissez la page hors ligne personnalisée: Sélectionnez la page que vous souhaitez que l'utilisateur voient quand une page qui n'est pas dans le cache est accessible et que l'utilisateur est hors ligne.
- Nouveau dans la version 1.2: Prise en charge de la couleur thème.
- Nouveau dans la version 1.2: Vous pouvez désormais modifier le nom de l'application et le nom court de l'application.
- Nouveau dans la version 1.2: Définissez la page Démarrer de votre PWA.
- Nouveau dans la version 1.2: Définissez la version accélérée des pages mobiles (AMP) de la page Démarrer. Plugins pris en charge: AMP pour WordPress, AMP pour WP, meilleur ampli, suprématie AMP, AMP WP.
- Nouveau dans la version 1.3: Ajout de la prise en charge de l'écran d'éclaboussures de haute qualité. Vous pouvez désormais définir l'icône 512x512 pour l'écran Splash de votre application Web progressive.
- Nouveau dans la version 1.3: les applications Web super progressistes expliquent désormais les mises à jour du contenu et mettra à jour le cache lorsque vous mettez à jour le site Web.
- Nouveau dans la version 1.3: amélioration de la mise à jour des travailleurs de service dans le navigateur.
- Nouveau dans la version 1.4: Vous pouvez désormais définir l'orientation par défaut de votre PWA. Choisissez parmi "n'importe quel" (suivez l'orientation de l'appareil), "portrait" et "paysage".
- Nouveau dans la version 1.4: vous pouvez désormais définir la propriété thème_color dans le manifeste.
- Nouveau dans la version 1.5: Intégration Onesignal pour les notifications push.
- Nouveau dans la version 1.6: Compatibilité du réseau multisite WordPress.
- Nouveau dans la version 1.7: Les modules complémentaires pour Superpwa sont là! Navire avec un module complémentaire de suivi UTM pour suivre les visites provenant de votre PWA.
- Nouveau dans la version 1.8: les problèmes de compatibilité avec OnesIgnal sont maintenant résolus!
- Nouveau dans la version 1.8: Nouveau module complémentaire: icônes Apple Touch qui définissent vos icônes d'application sous forme d'icônes Apple Touch.
- Nouveau dans la version 2.0: SuperPWA est désormais compatible avec WordPress installé dans un sous-dossier.
- Nouveau dans la version 2.0: vous pouvez désormais définir la propriété Affichage à partir des paramètres SuperPWA.
- Nouveau dans la version 2.1.1: Prise en charge des icônes Maskabale.
? Fonctionnalités à venir:
- Avis d'indicateur hors ligne.
Prise en charge de l'appareil et du navigateur pour PWA
| Chrome | Incendier | Bord | Opéra | Safari | Samsung | Navigateur UC | Courageux |
|---|
| Ajouter à l'écran d'accueil | | | | | | | | |
| Employés de service | | | | | | | | |
| Push et notifications Web | | | | | | | | |
| API de demande de paiement | | | | | | | - | - |
| Couleur du thème méta- | | - | - | - | - | | - | |
Beta soutenu ou soutien partiel dans le développement
Les applications Web progressives ont besoin de navigateurs qui prennent en charge les manifestes et les travailleurs des services. Actuellement, Google Chrome (version 57+), Chrome pour Android (62), Mozilla Firefox (57), Firefox pour Android (58) sont les principaux navigateurs qui prennent en charge PWA.
La liste est en croissance rapide et devrait être soutenue dans la plupart des principaux navigateurs d'ici la fin de cette année.
Pourquoi créer des applications Web progressives?
Comment convertir votre site Web WordPress en une application Web progressive
Installation WordPress
- Visitez WordPress Admin> Plugins > Ajouter un nouveau
- Rechercher des applications Web super progressistes
- Cliquez sur " Installer maintenant " puis " activer " des applications Web super progressistes
Pour installer manuellement:
- Téléchargez le dossier super progressif-web-apps dans le répertoire / wp-content / plugins / répertoire sur votre serveur
- Aller à WordPress Admin> Plugins
- Activez le plugin d'applications Web Super Progressive à partir de la liste.
Personnalisation de votre application Web progressive
Votre application Web progressive doit être prête à tester avec les paramètres par défaut lors de l'activation. Vous pouvez le personnaliser davantage et en faire vraiment le vôtre.
- Accédez à WordPress Admin> " SuperPwa "> Paramètres
- Définissez une couleur d'arrière-plan pour que l'écran Splash soit affiché lorsque votre PWA est ouvert sur un appareil mobile.
- Définissez l'icône de l'application. Ce sera l'icône de votre PWA lorsqu'elle sera ajoutée à l'écran d'accueil dans un appareil mobile. L'icône doit être une image PNG et exactement 192 x 192 pixels.
- Définissez la page hors ligne. Cette page sera affichée si l'utilisateur est hors ligne et que la page qu'il a demandée n'est pas déjà mise en cache. Idéalement, vous devez créer une page WordPress dédiée et la définir ici. Dans la page que vous créez, vous pouvez ajouter une note qui se lit comme suit: "Il semble que vous soyez hors ligne et que la page que vous avez demandée n'est pas disponible pour le moment. Veuillez revoir une fois que vous êtes en ligne.".
- Cliquez sur "Enregistrer les paramètres".
Tester votre application Web progressive
- Ouvrez un navigateur pris en charge dans un appareil pris en charge (pour EG: Chrome pour Android (62 ou plus) dans un appareil Android)
- Entrez votre site Web et attendez qu'il se charge complètement
- Vous devriez voir une fenêtre contextuelle qui a votre icône d'application et un bouton qui lit "Ajouter à l'écran d'accueil".
- Cliquez dessus et votre PWA sera ajoutée à votre écran d'accueil. Attendez que l'installation se termine.
- Allez sur votre écran d'accueil et ouvrez votre PWA. Parcourez quelques pages si vous le souhaitez. Fermez l'application.
- Débranchez-vous d'Internet et ouvrez à nouveau votre PWA. Vous devriez être en mesure de voir toutes les pages que vous avez déjà parcourues.
- Essayez de visiter une page que vous n'avez pas visionnée auparavant. Vous devriez voir la page que vous définissez comme votre "page hors ligne" dans les paramètres de SuperPWA.
? À propos de nous
Nous sommes un duo qui s'est enthousiasmé par l'idée. Notre mission est simple: vous aider à créer un PWA impressionnant que vos utilisateurs voudraient avoir sur leur écran d'accueil. Lorsque nous avons entendu parler de PWA pour la première fois, nous voulions tout apprendre à ce sujet. Nous avons passé d'innombrables heures à apprendre et vouloir le partager avec le monde. Veuillez nous donner vos commentaires et votre soutien constructifs.
⛷️ Support
Il s'agit d'un portail d'un développeur pour les applications Web super progressistes et ne doit pas être utilisé pour l'assistance. Veuillez visiter les forums d'assistance.
? Rapports de bugs
Si jamais vous êtes coincé, nous sommes là pour surveiller votre dos! Ouvrez un nouveau billet de sujet d'assistance si vous avez une question ou si vous avez besoin d'une fonctionnalité. Nous sommes très heureux d'entendre vos commentaires et nous voulons vraiment vous aider à créer la meilleure application Web progressive pour votre site Web WordPress!
? Contributions
Tout le monde est invité à contribuer à Super PWA pour le rendre super.
Il existe différentes façons de contribuer:
- Soulevez un problème sur Github.
- Suivez et engagez avec nous sur les réseaux sociaux
Partager sur Twitter
Partager sur Facebook
Partager sur LinkedIn
? Changelog
superpwa.com/changelog/.
Crédits emoji: Emojipedia Icône des médias sociaux Crédits: Flaticon
⬆ Retour en haut
