This tool provides a centralised solution to embed a contact form into various brand websites of Bahlsen
The advantages of this centralisation are 1) a unique technical implementation, and 2) an easier and faster implementation of contact forms on the brand pages by 3) by keeping the flexibility of a custom styling and wording.
Each form (so each brand website) has its own integration urls to allow different configurations. But the embedding itself is the same for all. All that has to be done is to
<link rel="stylesheet" href="https://contactforms.bahcf.motor.report/MyBrandWebsite/app.min.css" />
Add a HTML-tag, where the form should appear:
<div id="bahlsengroup_contactform" class="bootstrap"></div>
Please note that the named urls above are (working) examples. To get the real links per website see Brand Websites.
The contact form has some configuration options, which can be set before building the contact forms for usage on the brand websites.
Currently we support these options:
form.includeRecipientDonationsRequest: The topic for donation requests can be switched on or off.
form.includePrivacyCheckbox: A privacy note with a required checkbox, like needed in Poland, can be switched on or off.
form.containerSelector: If needed, the html-tag for embedding can be renamed.
form.errorMailTo: Usually the form sends the data by a webhook. In case a technical error occurs, the form generated a mailto link with the form data to supply the user a fallback. This option sets the email address to use.
datepicker.language / isoCountriesFile: The default localisation for the date picker and the country list can be set.
customLocalisation: Each form can get custom texts, which will be delivered ready to use with the embedding code.
The contact form has some customisation options, which can be used while embedding the form.
If needed all texts can be overwritten on client side while embedding the form into a website.
Therefor a custom language json file is needed and has to be activated. See more at Localisation.
Due to the frontend technology and the complete embedding, all default styles can be overwritten. See more at Styling.
The form uses jQuery and the jQuery Validation Plugin. We use jQuery.noConflict() to avoid any interference with your website code.
The form uses Bootstrap. To avoid any interference with your website styles we use Isolated-Bootstrap.
All texts are managed by jQuery-i18next. So we have one global default text set, an option to overwrite any text of each form before delivery and another option to overwrite any text on embed time.