SmartForms / Contact Forms

SmartForms are online forms that you can add to embed into your website in order to capture information from your website visitors and automatically create them as contacts in Brightpearl!

Smartforms can be used for simple tasks such as submitting a customer enquiry or requesting a callback, or slightly more involved processes like requesting a brochure and receiving it as an automated response. SmartForms also have the option to create new contacts enabling your contact forms to become powerful lead generation tools.

Create a SmartForm

Now you have chosen your fields, set the form options on the right-hand side:

1. Go to Marketing > Smart Forms. Here you will see all SmartForms stored on your Brightpearl account, including the default 'main contact' and 'registration' forms.
2. Click the Add a new SmartForm.
3. On the left-hand side use the drop-down manu to begin adding the fields to your form; add anything that you want to capture from your website visitor. You can rename the listed field if you want.
4. Tick the checkbox next to any field you want to make required; this means the customer will be forced to complete the field.
5. Use the arrows on the left of the field to click and drag the fields into your prefered display order. You can remove any field by clicking on the the red cross.
6. Select the Page Information tab and enter a page title and SmartForm name; one the customer will see and one you will use to recognise the form.
7. Enter an email address to say where the details are sent whenever someone completes the form, for example, you may have a special "enquiries" email address. You can also select a template for this email.
8. Select the Header tab, this is where you can write a sentence or more to appear above your SmartForm; useful for helping your customer understand why they are filling out the form and what respsonse they can expect to get.
9. Select the Confirmation tab and enter a sentence or more that will be displayed after the form has been submitted; useful for letting your customer know what will happen next, or thanking them for their time/enquiry/custom.
10. Select the Embed/link code tab, this is where you will find the code you need to embed the SmartForm into your Brightpearl website or another website.
11. Click Save changes to complete your SmartForm. It is now ready to embed into your Brightpearl or another website!

Embedding a Form into a Website

Brightpearl SmartForms can be embedded in to nearly any external website simply by adding a piece of code to the third-party site. In order to protect your form from being copied to anyone's website we recommend that you add the domain names of allowed websites to the white list.

To find the code:

1. Go to Marketing > Smart Forms.
2. Click the edit pencil icon next to the SmartForm you want to use.
3. Select the External/link code tab.
4. Highlight and copy the line of code for embedding the form in a non-Brightpearl website.
5. Paste this code into your website template.

White List of Allowed Websites

Only websites that match the whitelist will be allowed to display your SmartForm. If no sites are listed, then any website can use the embed code to display your SmartForm. To add websites to your whitelist:

1. Go to Marketing > Contact Forms.
2. Click the edit pencil icon next to the SmartForm you are using.
3. Select the External Link tab.
4. Scroll down to the White List section.
5. Type you list of allowed sites.

Tip: When adding domains to the whitelist it is good practice to use as much of the domain name as possible e.g. if your website is at http://www.yoursite.com/ then use "www.yoursite.com" in the whitelist. If however you also need http://secure.yoursite.com/ to show your forms, it is perfectly reasonable to either add "secure.yoursite.com" to the whitelist, or by using "yoursite.com" in the whitelist you will enable both http://www.yoursite.com/ and http://secure.yoursite.com/ to show the form.

Ideas for SmartForms

Using your SmartForm for Brochure Requests
By using a Brightpearl SmartForm it is easy to automatically send information to someone after they have sent you some details. For example if you want to send out a brochure once a user has provided their email address and contact details, a Brightpearl SmartForm can do this for you by following these simple steps.

1. Setup an email template that will form the response to your contact form. If you are offering a brochure or download then provide a link to the file from within the email.
2. Create a new SmartForm to gather the information you require.
3. On the Page Information tab and select the email template in the Email file when submitted field.
   Alternatively you can set the "Redirect to:" option of the SmartForm to direct the user to a download page within you website.
4. Link to your new SmartForm (Brightpearl hosted websites) or embed the SmartForm on to your own website.
5. Sit back and relax, as Brightpearl SmartForms automatically deal with your website enquiries.

Using a SmartForm in a Wordpress website

We've built a plugin that lets you embed a contact form into your Wordpress site, it's free and easy to install (you'll need your own hosted version of Wordpress).

Learn more about WordPress plugin

Tracking Lead Sources When Your SmartForm is not Part of a Brightpearl Website

Brightpearl websites have some powerful tracking features that let you see where your contacts are coming from. You can use ?cid in the link that takes the user to your website when you have access to the link source (such as Google Adwords) or you can use Lead Source Domains to track inbound visitors by looking at the domain they have just come from.

When the SmartForm is submitted, Brightpearl looks for a cookie on the visitor's browser. If your SmartForm is embedded in a non-Brightpearl website, then to get these tracking features to work you need to add the following java script code into your website, on every page:

You can find the code on the Marketing > Contact Forms page too, in the External Link tab when editing any SmartForm.

Sample CSS

You can embed the styles for the SmartForm within your website stylesheet, or you can insert this code on the same page as the SmartForm:

<style>

#contact-message {}
#contact-form {  width:100%; }
.contact-fieldset { 
   padding:4px; 
   margin:4px; 
   border-bottom: 1px dotted #eee; }
.contact-fieldtext { 
   float:left; 
   display:block; 
   width:180px; 
   margin:4px; 
   text-align:right; 
   font-weight:bold; }
.contact-field { 
   display:block; 
   margin-left:200px; 
   margin-right: 0px; 
   margin-top:4px; 
   display:block; 
   padding-left:10px; }
.contact-field .inputText { border:1px solid #333333; padding:4px; }
.contact-foot { 
   clear:both; 
   margin-top:12px; 
   padding-left:220px; 
   padding-top:10px;}
.contact-foot .button { font-size:18px }

</style>

A SmartForm in Use on a Weebly Website