Introduction
The Restaurant Booking particle allows you to manage your online reservations. It is dedicated to restaurants but can be used for many other sectors of activity. This particle uses a platform dedicated to forms, Simple Form, which makes the interface between your site and your mail. Simple Form fits easily into Gantry 5 particles.
This particle follows the general principle of the "Booking Form" particle of RocketTheme presented with the Sienna template.
Simple Form usage
On the Simple Form site, you enter your email address to receive a code called token. Warning This email address is the one to which all requests via the form will be sent.
You will quickly receive an email with 3 important informations
- Your Token (a series of numbers and letters of more than 30 characters) you will enter in a field of the particle
- 1 link to personalize the email received with each use of the form
https://getsimpleform.com/instructions?api_token=VOTRE_TOKEN_ICI. We will see below an example of customization but the default form remains readable. - 1 link to see all the messages received with each use of the form
https://getsimpleform.com/messages?api_token=VOTRE_TOKEN_ICI. VYou know that it exists but its use is not necessary since you find all the information of reservation on your mail.
Configuration
The particle is separated into three parts: Main informations, static fields (Name, Email, Comments, Button) and variable fields.
Main informations
| Option | Description |
|---|---|
| Name of the particle | Enter the name you wish to assign to the particle. It appears only in the administration. |
| Simple Form token | Enter the token you received from the Simple Form website here. This tells the particle which account to send the submitted form to. |
| CSS Classes | Add any CSS classes you wish to have apply to the particle. |
| Title | Define the title of the particle that will appear in front. |
| Description | Introductory text of the form (under the title). |
| Footer | Text under the form. |
| Thank You Message | Enter text that appears once the form is submitted here. |
| Error Message | Enter text that appears in the event of an error in the form here. |
Static fields
| Option | Description |
|---|---|
| Name label | This is where you put the front end label that appears next to the Name field in the form prior to submitting. |
| Name placeholder | You can set a default placeholder text that appears in the Name field here unless altered by the visitor. |
| Email label | This is where you put the front end label that appears next to the Email field in the form prior to submitting. |
| Email placeholder | You can set a default placeholder text that appears in the Email field here unless altered by the visitor. |
| See comments | Uncheck if you do not want to see the comments text box. |
| Comments label | Label for the Comments form field. |
| Comments placeholder | This is where you put the front end label that appears next to the Comment field in the form prior to submitting. |
| Submit button text | This sets the text that appears in the submit button that submits the form. |
| Button classes | CSS classes name for the submit button |
For static fields, the variables used for the customization of the Email Simple Form are: Name, Email et Comment. Respect the case of these elements.
Collection fields
Select first your calendar language (EN, FR, DE, ES, IT, PT). In production mode, delete your gantry cache to validate your language modification.
Then, create below 4 items max, Date (date picker), Hours (text), Peoples (Spinner), Telephone (text). These items will be display on same line.
| Option | Description |
|---|---|
| Languages | Select your calandar language |
| Name | Set the name of the item you wish to use for backend reference. This does not appear on the front end. The name you will define for each field will also be used to customize the Simple Form Email. At this level, the Twig file removes the blanks for the dedicated variable. It is better to define a name without a special character. |
| Type | Set the type of picker the item will have. You can choose between Text, Number Input (with spinners), and Date. |
| Label | This is the label for the item that appears in the front end. |
| Placeholder | Placeholders are useful if you have a common default answer you want to place in the field in the event the user doesn't state otherwise. |
| Required | This sets whether or not the item is required to be set by the user before the form can be submitted. |
| Minimum value | Only used for Number Input item types, this enables you to set a minimum value for the number spinner. |
| Maximum value/td> | Only used for Number Input item types, this enables you to set a maximum value for the number spinner. |
For "variable" fields, the variables used for the customization of the Email Simple Form are therefore the Field Names. Respect the case of these elements.
Customizing the Email Simple Form
Without Customization, the Booking Email looks like this :
You can therefore modify this Email via the button "Form settings"
Here are my data that you can copy (replace "MyRestaurant" by what you want)
Reply to field
EmailSubject template
"MyRestaurant" : Online booking from {{Name}}Body template
Hello "MyRestaurant",
<br />
You have received an online booking from {{Name}} <br />
<b>Email</b>: {{Email}} <br />
<b>Phone</b>: {{Phone}} <br /><br />
<b>Date</b>: {{Date}} <br />
<b>Time</b>: {{Time}} <br />
<b>Partiesize</b>: {{Partiesize}} peoples(s)<br />
<b>Special instruction</b>:<br />
{{Comments}}
<br />
<p>reply to this message to continue the conversation (if necessary)</p>
And you can directly respond to your customer. Warning about SPAM
Example
Warning: In example below i use new realease particle with dropdown field (test)