Gebruik de Wordpress plugin recranet-elements-wordpress als basis voor de integratie in Wordpress. De header wordt door de plugin van de juiste base tag voorzien op de pagina Reserveren. Verder zijn functies toegevoegd waarmee /reserveren/* kan worden gebruikt als URL segment voor Recranet Booking.
Gebruik de handleiding Integratie in website voor uitgebreidere aanpassingen aan de Wordpress website die niet zijn voorzien in de basis plugin.
Belangrijk: Onderstaande stappen zijn benodigd om jouw integratie goed te laten draaien.
1. Installatie en configuratie (plugin)
- Download de laatste versie van de recranet/recranet-elements-wordpress in het .zip formaat.
- Ga in WordPress naar 'Plugins' -> 'Nieuwe plugin' -> 'Plugin uploaden'.
- Selecteer de zojuist gedownloade plugin en klik op Nu installeren
- De plugin is nu geïnstalleerd, klik op Plugin activeren
- De header moet worden voorzien van het recranetConfig object.
<script type="text/javascript">
window.recranetConfig = {
organization: '1000',
locale: 'nl',
currency: 'EUR'
};
</script>
2. HTML5 Routing instellen
De ondersteuning voor HTML5 routing is verplicht. Voeg aan het .htaccess bestand de volgende regels toe. Deze regel gaat uit van de url /reserveren als pagina waarop de (hoofd) Recranet module is ingeladen.
De pagina id 999 dient te worden vervangen door de daadwerkelijke pagina id van de url.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^reserveren/.* /index.php?page_id=999 [L]
</IfModule>
Het uiteindelijke bestand wordt dan het volgende. Neem de code na #BEGIN WORDPRESS niet over, dit is enkel ter verduidelijking opgenomen:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^reserveren/.* /index.php?page_id=999 [L]
</IfModule>
# BEGIN WordPress
# De richtlijnen (regels) tussen `BEGIN WordPress` and `END WordPress` worden
# dynamisch aangemaakt en zouden enkel aangepast mogen worden via WordPress filters.
# Elke wijziging aan deze richtlijnen tussen deze markeringen worden overschreven.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
De HTML5 Routing Mode kan worden getest door te navigeren naar een accommodatie detailpagina en vervolgens de pagina te verversen. Als vervolgens opnieuw dezelfde pagina wordt geladen is de HTML5 Routing Mode juist geconfigureerd.
In Wordpress moeten ook de 'Permalink instellingen' worden aangepast naar onderstaande configuratie.
3. Reserveren pagina (accommodatie overzicht)
De onderstaande shortcode geeft het accommodatie overzicht weer, deze wordt meestal op de pagina 'Reserveren' geplaatst. Op deze pagina wordt ook automatisch een base tag toegevoegd voor de routing.