Note: If you haven't already, please read Introduction to E-club Capture to learn how embedded forms with Bridg works.
The Bridg app can utilize your own HTML code to host an embeddable form for your website. This enables you to design the form in the exact style that you want. When it's ready, your Bridg Customer Success Manager (CSM) can help you perform tests. Keep in mind that Bridg is not responsible for fixing or adding design elements, such as responsive elements, custom layouts, etc.
You can download a basic E-club capture form here if you need a starting point for creating your form.
Below is a list of data that can be captured on a form using Bridg along with the value for the name attribute. You can style your own input fields (drop down menus, text fields, radio buttons, etc.), but the fields must pass properly formatted values when the form is submitted.
*For a location drop down, your Bridg CSM can help add in the appropriate code for having the list of locations auto-populate.
|Field||HTML (Name Attribute)|
|Wedding Anniversary Month||name="wedding_anniversary[month]"|
|Wedding Anniversary Day||name="wedding_anniversary[day]"|
|Wedding Anniversary Year||name="wedding_anniversary[year]"|
Customizing the Success and Duplicate Email Messages
Both the Success and Duplicate Email Messages default to take up 100% of the width and height of the capture form. If you would like create messages with your own designs, you should come up with code that would be placed in a div. This code is separate from the capture form code.
For example, the code below would show a success message that has a background image and white text.
|<div style="width:100%;height:100%;background-image:url(image.png);color:#FFFFFF;font-weight:bold;">Thank you for joining!</div>|
Here are some best practices for designing your own website capture form.
- Have a clear call-to-action
- Have your form respond to different screen sizes, such as mobile
- Have field validation for your input fields. Please note that Safari web browsers don't support HTML5 validation tooltips.
- If the webpage has a background that needs to show through the form, be sure to apply a transparent background to the body of your form html
- Use the source field to track where a visitor came from
Getting Your Code into Bridg
When your HTML is done and ready to be tested, contact your CSM and they will upload your code to your account. They can then direct you on how to test the form and implement it on your webpages.