Let op: Er is geen bestaande documentatie beschikbaar voor dit item, dus u ziet de huidige documentatie.
Apple heeft iOS en iPadOS 16.4 uitgebracht, dat ondersteuning biedt voor web pushmeldingen voor web-apps die aan het beginscherm zijn toegevoegd op iPhone- en iPad-apparaten. In deze handleiding helpen we u uw website in te stellen om meldingen te verzenden naar iPhone- en iPad-gebruikers die uw website bezoeken.
Ontgrendel Onbeperkt Bereik op iOS-apparaten. Mis het Momentum Niet.
Stel het vandaag nog in en breng uw websitebezoekers terug voordat ze u vergeten. Begin gratis, verzend slimmer en groei met een plan dat bij uw site past.
Web Pushmeldingen zijn beschikbaar voor de Safari-browser, Google Chrome en Edge op iPhone en iPad met iOS en iPadOS 16.4. iOS vereist dat de gebruiker uw website toevoegt aan hun beginscherm en vervolgens de web-app opent door op het pictogram te tikken. De web-app opent als elke andere native app op iOS of iPadOS in plaats van te openen in een browser. Gebruikers kunnen toestemming geven om pushmeldingen te ontvangen en die toestemmingen vervolgens beheren in Meldingeninstellingen, net als elke andere app op iPhone en iPad.
Voordat u begint
U heeft een paar dingen nodig om de web pushcampagnes op iOS-apparaten te laten draaien.
- Uw web-app moet een Web Application Manifest-bestand (manifest.json) leveren met het display-lid ingesteld op standalone of fullscreen.
- De gebruikers moeten op iOS of iPadOS 16.4 of hoger zitten.
- De gebruiker moet de web-app op hun beginscherm installeren door op de Deelknop te tikken om het deelmenu te openen en vervolgens op "Toevoegen aan beginscherm" te tikken.
- Een gebruikersgebaar, zoals een klik of tik op een knop, is vereist om de native toestemmingsprompt weer te geven en toestemming te geven om pushmeldingen te ontvangen.
Als uw website al een Progressive Web App (PWA) is, hoeft u geen aanvullende updates uit te voeren om u voor te bereiden op iOS/iPadOS Web Push. Als u niet zeker weet of uw website een PWA is, neem dan contact op met uw ontwikkelingsteam of gebruik Lighthouse in Chrome DevTools.
Uw website instellen voor iOS en iPadOS Web Pushmeldingen
Volg de stappen om pushmeldingen voor Safari op iPhone en iPad in te schakelen en te verzenden:
- 1. Voeg een Web App Manifest-bestand toe aan uw website.
- 2. Integreer PushEngage op uw website.
- 3. Implementeer en test uw website-manifest.
- 4. Test de modal van het abonnementsvenster en de toestemmingsprompt.
1. Voeg een Web App Manifest-bestand toe aan uw website
Het web-app-manifest is een JSON-bestand dat de browser vertelt over uw Progressive Web App (PWA) en hoe deze eruit moet zien en zich moet gedragen wanneer deze op het desktop- of mobiele apparaat van de gebruiker is geïnstalleerd. Het bevat metadata zoals de naam, beschrijving, pictogrammen, kleurenschema en de URL die moet worden geopend wanneer de app wordt gestart.
U kunt elke online tool gebruiken om snel een manifestbestand te genereren. Het manifestbestand kan elke naam hebben, maar wordt meestal manifest.json genoemd en moet worden geüpload naar de hoofdmap van uw website. Als u hulp nodig heeft bij het toevoegen van code aan uw WordPress-site, probeer dan de WPCode-plugin.
Een typisch manifest ziet er ongeveer zo uit:
{
"name": "PushEngage",
"short_name": "PushEngage",
"start_url": "/",
"display": "standalone",
"theme_color": "#3b43ff",
"background_color": "#ffffff",
"icons": [
{
"src": "icon/icon-128x128.png",
"sizes": "128x128",
"type": "image/png"
},
{
"src": "img/icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "img/icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}
Opmerking: De waarde van het display-lid in het manifest moet worden ingesteld op standalone of fullscreen.
Nadat u het manifestbestand hebt gemaakt, verwijst u naar het manifest op de HTML-pagina van uw website met behulp van een <link> tag in de <head> sectie van de pagina.
Bijvoorbeeld:
<link rel="manifest" href="/manifest.json">
2. Integreer PushEngage op uw website
De volgende stap is het integreren van PushEngage op uw website om het registreren en installeren van de Service Worker op de pagina af te handelen.
Als u de installatie nog niet hebt voltooid, vindt u hier de handleiding voor het installeren van PushEngage. Als u een WordPress-gebruiker bent, kunt u de PushEngage WordPress Plugin gebruiken, die de registratie van de service worker afhandelt.
U kunt de stappen volgen die hier worden vermeld als u uw service worker al hebt en deze wilt samenvoegen met de service worker van PushEngage.
3. Implementeer en test uw website manifest
Nadat u het manifest hebt geüpload en PushEngage hebt geïntegreerd, is de volgende stap het testen van uw web-app om er zeker van te zijn dat uw web-app manifest correct is geïmplementeerd. U kunt uw website op verschillende apparaten en browsers testen door deze toe te voegen aan uw startscherm.
Volg deze stappen:
- 1. Open de website in de Safari-browser op iOS 16.4 of hoger
- 2. Klik op de knop "Delen" om het deelmenu te openen.
- 3. Klik op de optie "Toevoegen aan beginscherm".
- 4. Sla de app op uw beginscherm op.
Als uw website succesvol is geconfigureerd voor web push, wordt de web-app geopend zoals elke andere app op iOS of iPadOS in plaats van in een browser te worden geopend en slechts als snelkoppeling te fungeren.
U moet uw gebruiker informeren door een banner op het app-scherm te tonen, waarin de gebruiker wordt gevraagd uw app toe te voegen aan het beginscherm van hun iOS-apparaat en zich te abonneren op de web pushmeldingen.
4. Test het abonnementsdialoogvenster
Een web-app op het beginscherm op iOS en iPadOS vereist directe gebruikersinteractie, zoals tikken op een knop op de pagina om het abonnementsdialoogvenster voor toestemming weer te geven. Volg deze stappen om te testen of de toestemmingsprompt werkt:
- 1. Open de web-app door op het app-pictogram vanaf het beginscherm op uw apparaat te tikken.
- 2. Wacht tot het PushEngage abonnementsdialoogvenster op de pagina verschijnt.
- 3. Klik op de knop "Toestaan" in de PushEngage Popup modal om de toestemmingsprompt weer te geven.
- 4. Klik op de knop "Toestaan" in de toestemmingsprompt.
Opmerking: Het abonnementsdialoogvenster verschijnt alleen als uw website HTTPS gebruikt en de app vanaf het beginscherm is gestart. U kunt het ontwerp en gedrag van het abonnementsdialoogvenster aanpassen via het PushEngage-dashboard.
Verzend een web pushcampagne naar iOS- en iPadOS-gebruikers
Nadat u de bovenstaande stappen voor iOS- en iPadOS-webpushmeldingen hebt voltooid, kunt u nu beginnen met het verzenden van een pushmelding met behulp van het PushEngage-dashboard.
Web pushmeldingen op iOS werken vergelijkbaar met andere systeemeigen apps. Web pushmeldingen worden op het scherm weergegeven als een heads-up melding, in het meldingscentrum en ook op het vergrendelscherm. Gebruikers kunnen hun meldingsvoorkeuren ook beheren vanuit iOS Instellingen. Zodra u op de melding klikt, wordt u naar de gewenste bestemmingspagina binnen de web-app geleid.
De structuur van een iOS Web Pushmelding
iOS Safari pushmeldingen ondersteunen momenteel geen rich media, geanimeerde GIF's of video's. Zodra deze functies worden toegevoegd, zullen we ze ook inschakelen. Volg de onderstaande richtlijnen om uw meldingen voor iOS-gebruikers op te stellen.
Web pushmeldingen op iOS en iPadOS bevatten de volgende elementen:
- 1. Pictogram – Het pictogram dat is opgegeven in het manifestbestand. Het kan niet worden gewijzigd voor individuele berichten.
- 2. Titel – De titel is beperkt tot 30-40 tekens, waarna deze wordt afgekapt.
- 3. App Naam – De appnaam wordt opgegeven in het manifestbestand en kan niet worden gewijzigd voor individuele berichten.
- 4. Bericht – De tekst is beperkt tot 120-150 tekens, waarna deze wordt afgekapt.
- 5. Tijdstempel – Dit toont hoe lang geleden de melding op het apparaat is afgeleverd.
Dit is alles wat u nodig heeft om abonnees te verzamelen en campagnes te verzenden naar uw iPhone & iPad-gebruikers.
Als u problemen ondervindt, neem dan contact met ons op door hier te klikken. Ons ondersteuningsteam zal u kunnen helpen.
