Apps zijn hot. En ze zijn ook nog eens hartstikke handig voor je klanten. Het geeft hen meer vrijheid met betrekking tot de manier waarop ze met je site bezig zijn. Tegenwoordig bezoeken meer mensen het internet via mobiele apps dan via desktop browsers; alle reden dus om ook van jouw WordPress site een app te maken!
Vroeger zat er behoorlijk wat werk in het bouwen van een app. Het was ook behoorlijk lastig om te doen, dus het bouwen werd meestal uitbesteed, wat flink in de kosten liep. Maar tegenwoordig heb je helemaal niet zoveel geld of expertise meer nodig om een goede app te bouwen.
Wat je moet doen voor je begint met het bouwen van je app
In de afgelopen jaren zijn er talloze gratis app builders verschenen. Eén van de simpelste gratis app builders is Adobe PhoneGap Build. Hiermee kun je simpelweg je website bestanden uploaden en PhoneGap tovert deze om in een mooie app die je direct kunt downloaden. Het mooie van Adobe PhoneGap Build is dat je drie apps tegelijk kunt bouwen: één voor iOS, één voor Android en één voor Windows. Dat scheelt je flink wat tijd!
Deze builder ‘verkleedt’ je homepage in feite als een app. Je bezoekers worden naar dezelfde mobiele website geleidt die ze zouden zien als ze hem op hun smartphone zouden bekijken. Met andere woorden, als je wil dat deze methode effectief is, moet je een site hebben die geoptimaliseerd is voor mobiel. Daarom moet je zorgen dat je WordPress site een mobiele versie heeft.
Als je WordPress website niet responsive is, heeft het weinig zin om er een app van te maken. Je eerste stap is dus om te zorgen dat je site een mobiele versie heeft. Er zijn tal van plugins verkrijgbaar waarmee je dat kun bereiken, zoals WPtouch, iThemes Mobile en het WordPress Mobile Pack. Ook Any Mobile Theme Switcher is een goede optie. Deze detecteert wat voor apparaat je bezoeker gebruikt en geeft een specifiek thema weer dat geschikt is voor dat apparaat.
Zodra je een goede mobiele versie van je site hebt, kunnen we verder gaan met het daadwerkelijk bouwen van je app.
Stap 1: Voorbereiding
Maak een PhoneGap Builder account aan. Als je van plan bent om slechts één app te bouwen, dan is de gratis account prima. Wil je meerdere apps maken, dan moet je een premium account hebben.
Stap 2: App bestanden creëren
Je root directory moet de volgende bestanden bevatten:
- index.html
- config.xml
- Een aantal standaard icoontjes in .png formaat
Als je geen expert bent met Photoshop of Illustrator kun je altijd nog gebruik maken van een app creator, zoals bijvoorbeeld The iOS and Android App Icon Size Generator of App Icon Maker.
Stap 3: De app configureren
Config.xml bepaald de meeste functies van je app. Het werkt op alle platformen, dus je hoeft niet voor elk besturingssysteem dingen aan te passen. Je moet wel de onderstaande zaken aanpassen:
- widget @id
Gebruik de domeinnaam van je site en voeg er .app aan toe
- name
De titel van je site
- description
Een korte beschrijving van je site
- author (@email, @href)
Jouw gegevens
- content@src
Vul hier je homepage in
Stap 4: Het bouwen van de app
Goed, nu kunnen we met het echte werk beginnen. Je gaat naar de PhoneGap Builder website en logt in. Hier krijg je de lege app schermen te zien. Via de knop aan de rechterzijde kun je al je app bestanden uploaden. Vervolgens wordt de data door het programma geanalyseerd en wordt er een scherm getoond met alle details van je app. Nu hoef je alleen nog maar op ‘ready yo build’ te klikken.
Het is wel belangrijk om te weten dat PhoneGab Builder alleen met iOS werkt als je lid bent van het iOS Developer Program.
Stap 5: Testen
Zodra je app klaar is kun je gaan testen. Als je bijvoorbeeld een smartphone met een Android besturingssysteem hebt, klik je op het Android icoontje om de app te downloaden. Als er geen icoontje wordt weergegeven, heb je waarschijnlijk de verkeerde URL in je config.xml bestand staan. Dan is het een kwestie van aanpassen, opnieuw uploaden en opnieuw bouwen.
Als alles in orde is, kun je er mee gaan spelen en kijken of alles goed werkt.
Alternatieve app builders
We hebben hier PhoneGap Build als voorbeeld genomen, maar er zijn nog talloze andere app builders en plugins die je kunt gebruiken, waarmee je in elk geval kosteloos een Android app kunt bouwen. Een erg populaire app builder voor WordPress is AppPresser. Een groot voordeel van AppPresser is dat je app automatisch wordt geüpdate zodra je iets aan je site aanpast. Daarbij biedt het ook volledige ondersteuning voor e-commerce. Een andere WordPress plugin is WP Webapp. Deze plugin werkt min of meer hetzelfde als PhoneGab, maar net even iets makkelijker. Zo hoef je bijvoorbeeld niet het config.xml bestand aan te passen.
Tot slot
Het lijkt in de eerste instantie wellicht hoog gegrepen om zelf een app te bouwen, maar met alle tools die er tegenwoordig beschikbaar zijn is het helemaal niet zo moeilijk. Zorg in elk geval altijd dat je een goede mobiele versie van je site hebt, en je zult niet snel problemen ervaren.
