PS PrestaShop PrestaShop Gemiddeld

DataFirefly PWA: volledige gids

Installeer, configureer en gebruik de PWA: installeerbare winkel, rijke en geplande pushcampagnes, productmeldingen, klantvoorkeuren en offlinemodus voor PrestaShop 8 en 9.

Bijgewerkt Moduleversie 1.4.1

Overzicht

De module DataFirefly PWA (dfpwa) verandert uw PrestaShop-winkel in een Progressive Web App: klanten installeren hem op hun beginscherm, ontvangen webpushmeldingen en blijven offline browsen. De module is volledig zelfstandig: de versleuteling draait in native PHP, zonder Composer, zonder externe dienst en zonder abonnement.

Vier pijlers: een installeerbare winkel, een professionele pushmotor (rijke, geplande, gesegmenteerde campagnes), automatiseringen (bestellingen, winkelwagens, voorraad, prijzen) en een offlinemodus.

Compatibiliteit en vereisten

  • PrestaShop 8.0 tot 9.x, enkele winkel en multishop
  • Module vertaald in 7 talen: FR, EN, ES, DE, IT, NL, PL
  • Geen afhankelijkheden: geen Composer, geen framework, geen externe dienst
  • HTTPS vereist: PWA’s en webpush bestaan niet via HTTP
  • PHP-extensie openssl met de curve prime256v1, voor VAPID-versleuteling
  • Crontaak voor geplande campagnes, productmeldingen en winkelwagenherstel

Als openssl of prime256v1 ontbreekt, wordt de installatie geblokkeerd met een duidelijke melding. Vraag uw host de extensie in te schakelen.

Installatie

  1. Back office: Modules > Modulebeheer.
  2. Een module uploaden en selecteer dfpwa.zip.
  3. Klik op Configureren.
  4. Kopieer de cron-URL op het dashboard en laat uw planner deze elke 5 tot 15 minuten aanroepen.

Bij de installatie genereert de module uw VAPID-sleutels en een crontoken, maakt de tabellen aan, installeert de campagnepagina en voegt de link “Meldingsvoorkeuren” toe aan het klantaccount. Er worden geldige PWA-pictogrammen meegeleverd, dus de winkel is meteen installeerbaar, nog voordat u eigen pictogrammen uploadt.

Configuratie

Applicatie en installatie

  • Naam en korte naam: getoond onder het pictogram na installatie.
  • Themakleur en achtergrondkleur: systeembalk en opstartscherm.
  • Weergavemodus: standalone aanbevolen. De modus browser verhindert elke installatie.
  • Start-URL: pagina die bij het starten van de app opent.
  • Pictogrammen 192 en 512 px: vierkante PNG of WebP. Een te klein of niet-vierkant pictogram wordt geweigerd en het meegeleverde standaardpictogram blijft behouden, zodat de installeerbaarheid nooit breekt.
  • Installatiebanner, vertraging en iOS-hulp.

Installeerbaarheidsdiagnose

Het dashboard controleert punt voor punt wat Chrome vereist voordat het installatie aanbiedt: HTTPS, een compatibele weergavemodus, geldige pictogrammen van 192 en 512 px, een beschikbare offline fallbackpagina en een ingeschakelde module. Een link opent het gegenereerde manifest.

Op iPhone en iPad bestaat geen automatische prompt: Safari vereist de handmatige stap “Zet op beginscherm”. Dat is normaal, en de module legt het aan de bezoeker uit. De diagnose geldt dus voor Android en desktopbrowsers. In de winkel geeft het commando dfpwaDiagnose() in de browserconsole precies aan wat blokkeert.

Webpush

  • VAPID-subject: contactadres dat naar de pushdiensten gaat, als mailto: of https://.
  • Bezoekers automatisch vragen en toestemmingsbericht: een zachte prompt vóór het native browserdialoogvenster, AVG-conform.
  • Abonneerbel: zes posities, verbergbaar in winkelwagen en afrekenen. Zodra de bezoeker is aangemeld, wordt de bel een snelkoppeling naar zijn voorkeuren.
  • Afstanden van de bel: vier waarden in pixels, horizontaal en verticaal, apart ingesteld voor desktop en mobiel (onder 768 px breed). Daarmee houdt de bel een chatbubbel, een toegankelijkheidswidget of een vastgezette winkelwagenbalk van het thema vrij. Bij de middenposities verschuift de verticale waarde de bel alleen ten opzichte van het midden. Toegestaan bereik: 0 tot 2000.
  • Levensduur van het bericht: hoe lang een pushdienst een niet-afgeleverde melding bewaart.
  • Maximum aantal meldingen per apparaat per dag: 0 schakelt de limiet uit. Transactionele berichten verbruiken hem nooit.
  • Stille uren: campagnes die in dat venster in de wachtrij komen, worden daarna door de cron verzonden. Twee gelijke waarden schakelen de functie uit.
  • Berichten per cronuitvoering: verlaag dit als uw host een korte PHP-timeout afdwingt.

Offlinemodus

  • Cachestrategie: stale-while-revalidate (aanbevolen), netwerk eerst of cache eerst.
  • Titel en bericht van de fallbackpagina, plus een lijst met vooraf gecachete URL’s.

Winkelwagen, afrekenen en klantaccount blijven altijd buiten de cache. De offlinemodus uitschakelen maakt de winkel niet on-installeerbaar: de fallbackpagina wordt nog steeds geleverd, omdat een browser alleen een app installeert die offline kan antwoorden.

Wilt u helemaal geen pop-up in de winkel, schakel dan de installatiebanner, de automatische meldingsvraag en de zwevende bel uit en plaats gewoon links “Klik hier om onze app te installeren”. De bezoeker klikt wanneer hij dat zelf wil.

Beschikbare plaatsingen

  • Footer (standaard aan)
  • Bovenste navigatie
  • Klantaccount (standaard aan)
  • Bestelbevestigingspagina (standaard aan), meteen na de aankoop
  • Productpagina
  • Transactionele e-mails (standaard aan)

Elke plaatsing heeft een eigen schakelaar. Er zijn drie weergaven: knop, tekstlink of brede banner, en de tekst is per taal aanpasbaar.

Overal elders: de widget

Voor een plek die de module niet dekt, bijvoorbeeld het bedankbericht na een beoordeling of een blok van uw thema, voegt u deze regel toe aan het betreffende sjabloon:

{widget name='dfpwa'}

In e-mails

Een e-mail kan geen installatie starten, dus opent de link de winkel met de parameter ?dfpwa_install=1, die het proces meteen start zodra de klant aankomt, zonder de gebruikelijke vertraging. Geef de betreffende sjablonen op, gescheiden door komma’s (bijvoorbeeld order_conf,shipped), of laat het veld leeg voor alle e-mails. Voor mailprogramma’s zonder HTML wordt een tekstversie toegevoegd.

De link verschijnt alleen als installatie werkelijk mogelijk is. Hij blijft verborgen wanneer de app al is geïnstalleerd, wanneer de browser hem niet kan installeren, of zolang Chrome de criteria niet heeft goedgekeurd. Op de iPhone opent een klik meteen de handleiding “Zet op beginscherm”, omdat Safari geen native prompt kent.

Een campagne verzenden

  1. Open PWA Push in het beheermenu.
  2. Voer een titel in (ongeveer 50 tekens) en een bericht (ongeveer 120 tekens).
  3. Voeg een bannerafbeelding toe door te uploaden (JPG, PNG of WebP, max. 2 MB, ideale verhouding 2:1) of via een URL. Een geüpload bestand heeft voorrang.
  4. Voeg maximaal twee actieknoppen toe, elk met een eigen label en URL.
  5. Richt op taal, klantengroep, apparaat (iOS, Android, desktop) en doelgroep (iedereen, geregistreerde klanten, gasten).
  6. Laat Plannen voor leeg om nu te verzenden, of voer een datum in als JJJJ-MM-DD UU:MM.
  7. Gebruik de testmodus om de melding eerst naar uzelf te sturen.

De testmodus richt zich alleen op apparaten die gekoppeld zijn aan een klantaccount met uw medewerker-e-mailadres. Komt geen enkel account overeen, dan wordt de verzending geweigerd in plaats van naar het hele segment te gaan.

Verzendwachtrij

Elke verzending komt in de wachtrij en wordt in batches verwerkt. Een deel gaat meteen uit, de rest wordt door de cron bezorgd. Een bestand van tienduizenden abonnees veroorzaakt dus geen time-out en geen afgekapte statistieken. Het dashboard toont hoeveel meldingen wachten en laat u een verwerking forceren.

Geschiedenis en statistieken

De geschiedenis toont de laatste dertig campagnes met status, ontvangers, afleveringen, mislukkingen, kliks en klikratio. Een klik wordt toegewezen aan de campagne die de melding voortbracht, en de teller kan nooit hoger uitkomen dan het aantal werkelijk afgeleverde berichten. Abonnees exporteert u naar CSV.

Automatiseringen

Bestelopvolging

Vink de statussen aan die een melding activeren. Standaard: betaling geaccepteerd, verzonden, geleverd. Niets aanvinken betekent melden bij elke statuswijziging.

Verlaten winkelwagens terughalen

De cron zoekt winkelwagens met artikelen, gekoppeld aan een aangemelde klant en zonder bestelling, binnen het ingestelde venster (1 tot 168 uur).

Meldingen voor voorraad en prijsverlaging

Op de productpagina verschijnt een knop. De voorraadknop verschijnt alleen als het product niet leverbaar is; die voor prijsverlaging wordt altijd aangeboden. De bezoeker heeft geen account nodig: de melding hangt aan het abonnement van zijn apparaat. De prijs op het moment van de aanvraag wordt bewaard, en u bepaalt het minimale verlagingspercentage dat de melding activeert.

Welkomstmelding

Wordt eenmalig verzonden, bij de eerste aanmelding van een apparaat. Ze bevestigt de aanmelding en wordt nooit geblokkeerd door de klantvoorkeuren.

Voorkeuren van de klant

Vanuit zijn account opent de klant Meldingsvoorkeuren en zet vier categorieën aan of uit:

  • Bestelupdates: verzending en statuswijzigingen
  • Productmeldingen: weer op voorraad en prijsverlagingen
  • Winkelwagenherinneringen: terughalen van de verlaten winkelwagen
  • Aanbiedingen en nieuws: marketingcampagnes

Standaard staat alles aan, ook voor bestaande abonnees na een update. De keuze geldt voor alle apparaten van de klant, en een nieuw apparaat neemt zijn voorkeuren over. Een uitgeschakelde categorie wordt nooit verzonden, zelfs niet bij transactionele berichten die de daglimiet en stille uren negeren.

AVG

  • Toestemming wordt met een expliciet bericht gevraagd vóór elke aanmelding
  • De klant beheert zijn categorieën vanuit zijn account en kan alles uitzetten
  • Het verwijderen van een klantaccount wist abonnementen, productmeldingen en berichten in de wachtrij, via de AVG-hook van PrestaShop
  • Er gaan geen gegevens naar een externe dienst: de versleuteling gebeurt op uw server

Aanpassing via het thema

  • data-dfpwa-bell op een element maakt er een abonneerknop van en vervangt de zwevende bel.
  • data-dfpwa-share op een element maakt er een native deelknop van.
  • De klasse dfpwa-prefs-form blijft bewust zonder stijl voor uw eigen CSS.

FAQ en probleemoplossing

De installatiebanner verschijnt niet op Android

Chrome toont niets zolang de winkel niet aan de criteria voldoet. Raadpleeg de diagnose op het dashboard en voer daarna dfpwaDiagnose() uit in de browserconsole op de winkel: het oordeel noemt wat ontbreekt. Als u de PWA al op het apparaat had geïnstalleerd, verwijder hem dan en wis de sitegegevens voordat u opnieuw test. Een door de bezoeker onthouden weigering vervalt na 30 dagen, of meteen met dfpwaResetPrompts().

Er installeert niets op de iPhone

Dat is het normale gedrag van Safari, dat geen automatische prompt kent. De handleiding “Zet op beginscherm” van de module legt de stappen uit. Webpush werkt daar pas vanaf iOS 16.4 en alleen met een geïnstalleerde winkel.

Meldingen worden niet verzonden

Controleer of push ingeschakeld is, of de VAPID-sleutels aanwezig zijn en of klanten zich hebben aangemeld. De testmodus valideert de hele keten. Blijven berichten in de wachtrij staan, controleer dan of de cron werkelijk wordt aangeroepen.

Een campagne blijft in afwachting

Ze is gepland voor een latere datum, staat in de wachtrij tijdens stille uren, of wordt in batches bezorgd. Via het dashboard forceert u een verwerking.

Een klant zegt niets meer te ontvangen

Bekijk zijn meldingsvoorkeuren: mogelijk heeft hij een categorie uitgezet. Controleer ook de daglimiet per apparaat en de stille uren.

Productmeldingen gaan niet af

Ze zijn afhankelijk van de cron. Controleer of die draait, of het meldingstype is ingeschakeld en, voor prijsverlagingen, of de korting het ingestelde minimumpercentage haalt.

Was deze pagina nuttig?

Loopt u nog vast? Neem contact op met support