Een app bouwen van je WordPress website met Reactor

Een app bouwen van je WordPress website met Reactor

WordPress is in de afgelopen jaren uitgegroeid van een blog tot een content management systeem, tot een uitgebreid platform dat vele mogelijkheden biedt. Nieuwe technologie, zoals de WP API, heeft ervoor gezorgd dat je nu ook een mobiele app kan bouwen van je WordPress site.

Een app bouwen van je WordPress website

Natuurlijk hebben niet alle WordPress sites een bijbehorende mobiele app nodig. Als je WordPress gebruikt om voor de lol af en toe wat te bloggen, dan heb je waarschijnlijk geen behoefte aan een app. Maar omdat steeds meer mensen via hun smartphone of tablet het World Wide Web opgaan, zullen ondernemingen, professionele bloggers en webshops ondervinden dat een mobiele app hen vele voordelen biedt. Een mobiele app van je website biedt je bezoekers sneller en makkelijker toegang tot je content, en interactiviteit die op een website niet mogelijk is. Zo kan een app gebruik maken van de features van een apparaat, bijvoorbeeld geolocation en de camera, en kunnen er push notifications worden verzonden.

Als je besloten hebt dat een mobiele app voor je WordPress site toegevoegde waarde heeft, dan heb je een aantal opties. Je kunt natuurlijk iemand inhuren om een custom app voor je te bouwen, maar dit kan behoorlijk in de kosten lopen. Als je geen groot budget hebt, dan kun je ook gebruik maken van één van de app builders om zelf een app te maken. Er zijn vele verschillende app builders. In dit artikel gaan we ons richten op een nieuwe builder genaamd Reactor.

Waarom Reactor?

Anders dan andere app builders is Reactor specifiek ontworpen om heel makkelijk een app te bouwen die verbindt aan je WordPress website. Zo kun je o.a. WordPress posts, pagina’s, foto’s, video’s en events toevoegen. Ook biedt het integratie met diverse plugins zoals WooCommerce, en kun je gebruik maken van features zoals push notifications en een live app preview. Andere app builders zijn vaak lastig om te configureren, maar Reactor maakt alles heel makkelijk.

Wat heb je nodig?

Om een app te bouwen met Reactor moet je eerst de Reactor Core plugin installeren. Je logt in op je Dashboard, en gaat naar Plugins > Add New. Zoek naar Reactor Core, en installeer en activeer de plugin.

Het daadwerkelijke bouwen van de app wordt gedaan via de app building interface van Reactor. Hiervoor heb je een Reactor account nodig. Op deze pagina kun je je aanmelden voor een gratis trial versie.

Wat moet je eerst doen?

Zodra je de Reactor Core plugin heb geactiveerd en je Reactor account hebt aangemaakt, kun je aan de slag. Je logt in op je Reactor app building dashboard. Het zal je ongetwijfeld opvallen dat de interface er precies zo uitziet als het WordPress dashboard, dus je zult je meteen thuis voelen. Het bouwen van je app lijkt eigenlijk heel erg op het bouwen van je website zelf: je maakt wat pagina’s aan, zet ze in een menu, en zet alles bij elkaar onder Apps.

App pagina’s aanmaken

Laten we beginnen met het aanmaken van een nieuwe pagina.

Ga naar App Pages > Add New.

Je hebt hier de keuze uit verschillende pagina types:

 

  • List
  • Media List
  • Card List
  • WooCommerce
  • WooCommerce Two Column
  • Page From Site
  • Photo Gallery
  • Google Map

Elk pagina type doet weer iets anders. Kies je bijvoorbeeld voor een List, dan wordt er gevraagd wat voor soort content je in die lijst wil. Je kunt bijvoorbeeld posts of custom post types laten weergeven, en deze optioneel koppelen aan een categorie of tag. De posts die je selecteert worden vervolgens in een lijst weergegeven. Door op een lijst item te klikken krijgt de gebruiker een volledige schermweergave van dat item.

Als je gebruik maakt van WooCommerce, kun je een WooCommerce productlijst gebruiken om je producten te laten zien. Je klanten kunnen dan de product details bekijken en aankopen doen via de app.

Je kunt ook HTML pagina’s creëren die alleen in de app worden getoond en niet op je WordPress site. Op elke pagina kun je, als je dat wilt, een slider of social media buttons toevoegen.

https://www.youtube.com/watch?v=65L90xeK-4c

Een app menu aanmaken

Nadat je een aantal app pagina’s hebt aangemaakt, moet je ze in een menu toevoegen om ze ook daadwerkelijk zichtbaar te maken in je app. Dit proces lijkt erg op het toevoegen van een custom menu in WordPress. Je kunt pagina’s aan je menu toevoegen, de volgorde van de pagina’s veranderen, en zelfs icoontjes toevoegen; Reactor maakt gebruik van het Iconic Framework, met vele kant-en-klare icoontjes.

Een preview van je app bekijken

Nu wil je natuurlijk weten hoe je app eruit ziet! Ga naar Apps in het menu aan de linkerkant, en klik op je app. Hier kun je een preview bekijken en de app testen.

Je voegt de URL van je website toe, en vervolgens kies je het app menu dat je net hebt aangemaakt, en het design. Daarna kun je je app opslaan door op de blauwe update button aan de rechterkant te klikken.

Nu kun je zien hoe je app eruit komt te zien. Klik er op je gemak doorheen om te controleren of alles naar behoren werkt. Let wel op, sommige features (zoals social sharing en het aankopen van producten) werken niet in de preview. Deze moet je straks dus op je smartphone testen.

Het bouwen van je app

Om je app op een apparaat te kunnen bekijken, heb je een gratis Phonegap Build account nodig. Daarna moet je de authorisatie token van je Phonegap Build account aan Reactor toevoegen: dat kun je doen bij Apps > Phonegap Account.

Vink het “Build app” vinkje aan en klik op de blauwe update button. Nu wordt je app daadwerkelijk gebouwd. Dit duurt nog geen halve minuut. Als je nu de pagina ververst, krijgt je een QR code te zien. Scan deze code met een willekeurige QR scanner app. Nu wordt je app naar je smartphone gedownload en kun je hem daar testen.

Ziet je app er goed uit en werkt alles naar behoren? Dan kun je hem aan de app store toevoegen!

Wil jij meer leren over Wordpress?

In de kennisbank vertellen we je alles over de belangrijkste onderwerpen

  • Snel en gemakkelijk contact met een WordPress expert
  • Ontvang als eerste nieuwtjes & leuke acties
  • Overleg met andere WordPress fans

Je WordPress vraag of probleem razendsnel opgelost met de hulp van een echte WordPress developer!

Join de grootste WordPress community van Nederland & stel je vraag via ons WordPress ticketsysteem.

Medaille-buddy

Blijf op de hoogte van het laatste WordPress nieuws.

Schrijf je in voor onze wekelijkse nieuwsbrief.