The "reserve" extension offers the option of reserving time slots for visits to zoos, libraries, stores and much more.
Visitors can reserve a ticket for themselves and possibly other people and then receive one or more QR codes by email. These codes can then be scanned by employees of the event or facility upon entry.
The extension was originally developed for one of our customers during the first lockdown of the Corona pandemic to regulate access control in a wildlife park, but is now publicly available in the TYPO3 Extension Repository.
In the following videos, we show what the extension can do and how to install and configure it.
Overview in the backend
The extension comes with two plugins:
- For the display of time slots and reservations in the frontend
- For scanning the QR codes
A certain folder/page structure is recommended for the whole thing to work properly. In this video, we take a closer look at the structure and data of the demo installation.
Create a facility
The first step is to create a so-called facility. This can be a store, a zoo, a shopping center, a library or much more.
The bookable time slots must then be created within this facility. Here you can also set the maximum number of people who can book a time slot and whether more than one person can book per reservation. The appearance of the QR code can also be customized to a certain extent.
Create protected pages for employees
The second plugin of the extension is used to manage the booked reservations. The QR codes can then be scanned or manual check-ins can be carried out.
The page on which this plugin is located can then be called up directly on a smartphone or tablet, for example, so that the device's built-in camera can be used to scan the QR code.
To ensure that only authorized users can access this page, the page must be protected. Only people who have previously authenticated themselves in the front end with their user name and password can access the page and use the scanner.
Route Enhancer in the Site Config
In order for the scanning of QR codes and the manual redemption of bookings to work, the Site Configuration needs to be expanded. Firstly, the route enhancer area should be added as described in the documentation.
On the other hand, another parameter needs to be added. A specific page type, which is used by the scanner, must be added in the mapping area. This point is currently still missing in the documentation, but will certainly be added in the near future.
The site configuration can be found in a file called config.yaml. Depending on whether you are working with a Composer- or Symlink-based TYPO3 installation, this file can be found in two different locations:
- In Composer installations:
In the directory config/sites/<designator>/config.yaml - In Symlink installations:
In the typoconf/sites/<designator>/config.yaml directory
<designator> stands for a freely selectable directory name, which is usually assigned by the website administrator when setting up the Site Configuration. In the sample project, for example, this directory is called "main".
The complete site configuration of the demo installation from the video can be found below the video.
Site configuration of the demo installation
base: 'https://reserve.ddev.site/'
errorHandling:
-
errorCode: 404
errorHandler: Page
errorContentSource: 't3://page?uid=18'
languages:
-
title: German
enabled: true
languageId: 0
base: /
typo3Language: de
locale: de_DE.UTF-8
iso-639-1: de
navigationTitle: DE
hreflang: de-DE
direction: ltr
flag: de
websiteTitle: ''
-
title: English
enabled: true
base: /en/
typo3Language: default
locale: en_US.UTF-8
iso-639-1: en
websiteTitle: 'TYPO3 template from jweiland.net'
navigationTitle: EN
hreflang: en-US
direction: ''
fallbackType: strict
fallbacks: ''
flag: en-us-gb
languageId: 1
rootPageId: 1
routeEnhancers:
ReservePlugin:
type: Extbase
extension: Reserve
plugin: Reservation
routes:
- routePath: '/checkout/list'
_controller: 'Checkout::list'
- routePath: '/checkout/form/{period_uid}'
_controller: 'Checkout::form'
_arguments:
period_uid: period
- routePath: '/checkout/create'
_controller: 'Checkout::create'
- routePath: '/checkout/confirm/{order_email}/{order_activation_code}'
_controller: 'Checkout::confirm'
_arguments:
order_email: email
order_activation_code: activationCode
- routePath: '/checkout/cancel/{order_email}/{order_activation_code}'
_controller: 'Checkout::cancel'
_arguments:
order_email: email
order_activation_code: activationCode
requirements:
period_uid: '^[0-9]+$'
order_activation_code: '^[a-zA-Z0-9]+$'
defaultController: 'Checkout::list'
aspects:
period_uid:
type: PersistedAliasMapper
tableName: tx_reserve_domain_model_period
routeFieldName: uid
NewsPlugin:
type: Extbase
extension: News
plugin: Pi1
routes:
-
routePath: '/{news_title}'
_controller: 'News::detail'
_arguments:
news_title: news
defaultController: 'News::detail'
aspects:
news_title:
type: PersistedAliasMapper
tableName: tx_news_domain_model_news
routeFieldName: path_segment
PageTypeSuffix:
type: PageType
default: .html
map:
sitemap.xml: 1533906435
yoast-snippetpreview.json: 1480321830
feed.xml: 9818
reserve-scanner.html: 1589460150
routes:
-
route: robots.txt
type: staticText
content: "## Use the following lines during development of a website to disallow robots to spider the website\r\nUser-agent: *\r\nDisallow: /\r\n\r\n## Use the following lines to ALLOW robots the access to the website\r\n## Remove the # at the beginning of each line\r\n#User-agent: *\r\n#Disallow: /fileadmin/_temp_/\r\n#Disallow: /t3lib/\r\n#Disallow: /typo3/\r\n#Disallow: /typo3_src/\r\n#Disallow: /clear.gif\r\n#Allow: /typo3/sysext/frontend/Resources/Public/*"
settings:
redirects:
autoUpdateSlugs: true
autoCreateRedirects: true
redirectTTL: 0
httpStatusCode: 301
websiteTitle: 'TYPO3 sample project from jweiland.net'
