Super Progressive Web Apps

Descrizione

Progressive Web Apps (PWA) è una nuova tecnologia che combina il meglio del Web mobile e la migliore delle app mobili per creare un’esperienza Web mobile di qualità superiore. Sono installati sul telefono come una normale app (web app) e sono accessibili dalla schermata principale.

Home | Documentazione | Aiuto | Caratteristiche della versione Premium

Gli utenti possono tornare al tuo sito web lanciando l’app dalla schermata principale e interagire con il tuo sito web attraverso un’interfaccia simile a un’app. I visitatori di ritorno sperimenteranno tempi di caricamento quasi istantanei e godranno dei grandi vantaggi prestazionali del tuo PWA!

Le app Web Super Progressive semplificano la conversione istantanea del tuo sito Web WordPress in un’app Web progressiva!

Una volta installato SuperPWA, gli utenti che navigano sul tuo sito Web da un dispositivo mobile supportato visualizzeranno un avviso “Aggiungi alla schermata Home” (dalla parte inferiore dello schermo) e potranno “installare il tuo sito web” nella schermata iniziale della loro dispositivo. Ogni pagina visitata viene archiviata localmente sul proprio dispositivo e sarà disponibile per la lettura anche quando sono offline!

SuperPWA è facile da configurare, ci vuole meno di un minuto per configurare la tua Progressive Web App! SuperPWA esegue una disinstallazione pulita rimuovendo tutte le voci di database e i file creati. Infatti, nessuna delle impostazioni predefinite viene salvata nel database finché non la si salva manualmente la prima volta. Vai avanti e provaci.

E la parte migliore? Se ti blocchi, siamo qui per guardarti le spalle! Apri un ticket di supporto se hai una domanda o hai bisogno di una funzione. Siamo davvero entusiasti di ascoltare il tuo feedback e vogliamo davvero aiutarti a creare la migliore app web progressiva per il tuo sito Web WordPress!

Demo veloce?

• Apri SuperPWA.com in un dispositivo supportato.
• Aggiungi il sito Web alla schermata iniziale dal prompt Aggiungi alla schermata iniziale (Chrome per Android) o dal menu del browser.
• Apri l’app dalla schermata Home e vedrai la schermata iniziale.
• Disattiva i dati e la connessione Wi-Fi per andare offline e aprire l’app. Potrai comunque vedere l’app e sfogliare le pagine che hai già visitato.
• Accedi a una pagina che non hai mai visitato prima. Verrà visualizzata la pagina offline.

Grazie agli appassionati di PWA!

Siamo umiliati dal feedback della community. Grazie a tutti coloro che hanno creduto in noi e hanno provato il nostro plugin. Il tuo feedback è stato inestimabile e abbiamo imparato molto dalla tua esperienza. Grazie per il vostro amore e supporto e speriamo di restituire l’amore sforzandoci di offrirvi il miglior plug-in Progressive Web Apps per WordPress!

Cosa c’è nella scatola

Ecco le caratteristiche attuali di Super Progressive Web Apps:

• Genera un manifest per il tuo sito web e aggiungilo alla testa del tuo sito web.
• Imposta l’icona dell’applicazione per la tua Progressive Web App.
• Imposta il colore di sfondo per la schermata iniziale della tua Progressive Web App.
• Il tuo sito web mostrerà la notifica “Aggiungi alla schermata home ” quando si accede a un browser supportato.
• Caching aggressivo delle pagine usando CacheStorage API.
• Le pagine una volta memorizzate nella cache vengono pubblicate anche se l’utente è offline.
• Imposta pagina offline personalizzata: seleziona la pagina che desideri venga visualizzata dall’utente quando si accede a una pagina non presente nella cache e l’utente è offline.
• Novità della versione 1.2: supporto per la proprietà meta del colore del tema. Cambia il colore della barra degli indirizzi del browser di Chrome, Firefox OS e Opera per abbinare i colori del tuo sito web.
• Novità della versione 1.2: ora è possibile modificare il nome dell’applicazione e il nome breve dell’applicazione.
• Novità della versione 1.2: imposta la pagina iniziale del tuo PWA.
• Novità della versione 1.2: Imposta la versione accelerata delle pagine mobili (AMP) della pagina iniziale. Plugin supportati: AMP per WordPress, AMP per WP, Better AMP, AMP Supremacy, WP AMP.
• Novità della versione 1.3: Aggiunto il supporto per la schermata iniziale di alta qualità. Ora puoi impostare l’icona 512×512 per la schermata iniziale della tua Progressive Web App.
• Novità della versione 1.3: le app Web Super Progressive ora tengono conto degli aggiornamenti dei contenuti e aggiornano la cache man mano che si aggiorna il sito Web.
• Novità della versione 1.3: Miglioramento della gestione degli aggiornamenti dei servizi di manutenzione nel browser.
• Novità della versione 1.4: ora puoi impostare l’orientamento predefinito del tuo PWA. Scegli tra “qualsiasi ” (Segui orientamento dispositivo), “Ritratto ” e “Paesaggio “.
• Novità della versione 1.4: ora è possibile impostare la proprietà theme_color nel manifest.
• Novità della versione 1.5: integrazione di OneSignal per le notifiche push.
• Novità della versione 1.6: compatibilità di rete multisito WordPress.
• Novità della versione 1.7: ecco i componenti aggiuntivi per SuperPWA! Spedisce con UTM Tracking Add-On per tracciare le visite provenienti dal tuo PWA.
• Novità della versione 1.8: i problemi di compatibilità con OneSignal sono ora risolti!
• Novità della versione 1.8: Nuovo componente aggiuntivo: Icone Apple Touch che imposta le icone delle tue app come icone Apple Touch.
• New in version 2.0: SuperPWA is now compatible with WordPress installed in a sub-folder.
• Novità della versione 2.0: Ora puoi impostare la proprietà di visualizzazione dalle impostazioni di SuperPWA.
• Novità della versione 2.1.1: SuperPWA ora supporta le icone mascherabili.
• Novità della versione 2.1.15: SuperPWA supporta ora le icone monocromatiche.
• Changelog completo

Funzioni imminenti:

• Avviso Indicatore Offline.

PRO Version support additional advance feature
* Call To Action (CTA) More Info
* Android APK APP Generator More Info
* Data Analytics More Info
* Pre-Loader More Info
* App Shortcuts More Info
* QR Code Generator More Info

Requisiti minimi dell’applicazione Web progressiva

Le Web App progressive richiedono che il tuo sito Web WordPress sia fornito da un’origine sicura, vale a dire che il tuo sito web deve essere HTTPS e non HTTP. Se il tuo sito web non è HTTPS, ti preghiamo di contattare l’host in merito. Puoi anche chiederci se hai bisogno di aiuto.

Supporto per dispositivi e browser per PWA

Le app web progressive necessitano di browser che supportano manifest e service worker. Attualmente Google Chrome (versione 57+), Chrome per Android (62), Mozilla Firefox (57), Firefox per Android (58) sono i principali browser che supportano PWA.

L’elenco è in rapida crescita e sarà probabilmente supportato nella maggior parte dei principali browser entro la fine di quest’anno.

Come convertire il tuo sito Web WordPress in un’applicazione Web progressiva

Installazione di WordPress

• Visita Admin WordPress & gt; Plugin & gt; Aggiungere nuova
• Cerca “Super Web Progressive App”
• Fare clic su “Installa ora ” e quindi su “Attiva ” applicazioni Web super progressive

Installare manualmente:

• Carica la cartella super-progressive-web-apps nella directory /wp-content/plugins/ sul tuo server
• Vai a Admin WordPress & gt; plugin
• Attiva il plugin Super Progressive Web Apps dall’elenco.

Personalizzazione della tua app Web progressiva

La tua app Web progressiva dovrebbe essere pronta a testare con le impostazioni predefinite all’attivazione. Puoi personalizzarlo ulteriormente e renderlo veramente tuo.

• Vai a Admin WordPress & gt; SuperPWA
• Impostare un colore di sfondo per la schermata iniziale da visualizzare quando il PWA viene aperto su un dispositivo mobile.
• Imposta l’icona dell’applicazione. Questa sarà l’icona del tuo PWA quando viene aggiunta alla schermata iniziale in un dispositivo mobile. L’icona deve essere un’immagine PNG e di dimensioni esattamente 192 x 192 pixel.
• Imposta la pagina offline. Questa pagina verrà visualizzata se l’utente è offline e la pagina richiesta non è già memorizzata nella cache. Idealmente dovresti creare una pagina WordPress dedicata e impostarla qui. All’interno della pagina che crei, puoi aggiungere una nota che legge, “Sembra che tu sia offline e che la pagina richiesta non sia disponibile al momento. Ricontrolla di nuovo una volta che sei online. “.
• Fai clic su “Salva impostazioni “.

Test della tua app Web progressiva

• Apri un browser supportato in un dispositivo supportato (ad esempio: Chrome per Android (62 o versione successiva) in un telefono Android)
• Inserisci il tuo sito Web e aspetta che si carichi completamente
• Dovresti vedere una finestra popup con l’icona dell’applicazione e un pulsante che legge “AGGIUNGI ALLA SCHERMATA HOME “.
• Fare clic su di esso e il tuo PWA verrà aggiunto alla schermata iniziale. Attendere il completamento dell’installazione.
• Vai alla schermata iniziale e apri il tuo PWA. Cerca in alcune pagine se vuoi. Chiudi l’app.
• Disconnettiti da Internet e apri di nuovo il tuo PWA. Dovresti essere in grado di vedere tutte le pagine che hai precedentemente sfogliato.
• Prova a visitare una pagina che non hai visitato prima. Dovresti vedere la pagina che hai impostato come “Pagina Offline ” nelle impostazioni di SuperPWA.

Risoluzione dei problemi della tua app Web progressiva

Uh Oh. Il tuo PWA non ha funzionato come previsto? Non vedi la notifica “Aggiungi alla schermata Home “?

• Assicurati che sul tuo sito web sia installato un certificato SSL. vale a dire il tuo sito web dovrebbe essere https anziché http (come in https://your-domain.com).
• Assicurati di utilizzare un dispositivo supportato e un browser supportato. Fare riferimento all’elenco di “Supporto per dispositivi e browser per PWA ” sopra.
• Assicurati che l’icona dell’applicazione e l’icona della schermata iniziale siano di formato PNG e 192px X 192px e 512px X 512px rispettivamente.
• Cancella la cache del browser e riprova. In Chrome per Android, vai in Impostazioni & gt; Privacy & gt; “Cancella dati di navigazione”.
• Se l’icona dell’applicazione non viene aggiornata dopo la prima installazione, eliminare PWA dal telefono, svuotare la cache del browser e installarla di nuovo. (Stiamo lavorando per renderlo migliore).
• Crea un nuovo ticket di supporto e condividi un link al tuo sito web. Daremo un’occhiata e capiremo per voi.

Richieste di funzionalità, problemi, richieste di pull

Ecco il nostro repository su GitHub . Inviaci le tue richieste di pull, richieste di funzionalità o problemi, se presenti.

Chi siamo

Siamo un duo che si è entusiasmato per l’idea. La nostra missione è semplice: aiutaci a creare un fantastico PWA che i tuoi utenti vorranno avere sulla loro schermata iniziale.

Quando abbiamo sentito parlare di PWA per la prima volta, volevamo imparare tutto su di esso. Abbiamo trascorso infinite ore ad apprendere e vogliamo condividerlo con il mondo.

Vi preghiamo di darci il vostro feedback e supporto costruttivo.