Form Embed Code

Written by: Marie VitkovaContributors: ...

Each FunnelBud form embed code has specific account, formID, and domain values, all varying depending on company and form.

To locate and use a form's embed code, do the following:

  1. In FunnelBud's top toolbar, click Content > Forms.
  2. In the left panel, click Options > Manage Forms.
  3. Click the name of the desired form.
  4. On the right side of the form page, click Options > Embed Code.
  5. Copy the code.
  6. Paste the code onto your site.
  7. Click Close.
Click the image to enlarge

Placeholder Text in Form Fields

FunnelBud enables you to include placeholder text in fields on a form and within custom fields. In order to enable placeholder text for a FunnelBud form, you must add the following line of code to your FunnelBud form embed code:

ss_form.hidden = {'_usePlaceholders': true};

Placeholder Text and Custom Fields

For custom fields, you may want the field label to remain the same and have the placeholder text display an example of what the lead should input into the form field. FunnelBud provides the functionality to accomplish this within the custom field manager. While creating or editing a custom field, you will see an input labeled Placeholder. By inserting text into this field, the input value will override the field label text that would normally be displayed in the placeholder for that field on the form.

The placeholder field is available for the following custom field types:

  • Text input
  • Text area
  • Drop-down select
  • Country
  • States

Passing Hidden Custom Fields

When you pass hidden field values, the value can vary based on what page of your site the form is submitted on. For example, if you use the same Contact Us form across multiple pages of your site, you can pass a different value across each page.

Passing form page link on the website using hidden custom field

Let's assume we have the same form placed on several pages on company website and our sales team needs to know what page exactly the subscriber comes from. We can solve that by adding a hidden field to the form and modifying the form code in certain way.

First we need to create a hidden custom field. To add a hidden field to FunnelBud, do the following:

  1. In FunnelBud's top toolbar, click User Settings > Settings.
  2. In left panel, under Features, click Custom Fields.
  3. Click Add Field > Lead Field.
  4. In the Field Label text box, a name for the field.
  5. In the Field Type section, click the Hidden radio button.
  6. Depending on if this is a new or existing field, click Create Field or Update Field.
Click the image to enlarge

Obtaining Hidden Field Information

Form embed codes can be modified. For system fields, you can pass your own values into these fields. For custom fields, instead of using the field name, you will need to use the field's system ID. To obtain a fieldID value, do the following:

  1. In FunnelBud's top toolbar, click User Settings > Settings.
  2. In the left panel, under Features, click Custom Fields.
  3. Locate the custom field to include in the form.
  4. To the right of the custom field, click Options > Copy fieldID to Clipboard.
Click the image to enlarge

Assuming that the field ID has this format 'aaaaaaaaaa', this is what the hidden field code would look like in the form without displaying placeholders:

ss_form.hidden = {'field_aaaaaaaaaa': window.location.href};

... and including placeholders:

ss_form.hidden = {'field_aaaaaaaaaa': window.location.href, '_usePlaceholders': true};

Code added into the form code:

<!-- SharpSpring Form for (your form's name here) -->
<script type="text/javascript">
 var ss_form = {'account': 'yyyyyyyyyyyyyyy', 'formID': 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'};
 ss_form.width = '100%';
 ss_form.height = '1000';
 ss_form.domain = 'app-zzzzzzzzzz.marketingautomation.services';
 ss_form.hidden = {'field_aaaaaaaaaa': window.location.href, '_usePlaceholders': true}; 
 // ss_form.target_id = 'target'; // Optional parameter: forms will be placed inside the element with the specified id
 // ss_form.polling = true; // Optional parameter: set to true ONLY if your page loads dynamically and the id needs to be polled continually.
</script>
<script type="text/javascript" src="https://koi-zzzzzzzzzz.marketingautomation.services/client/form.js?ver=2.0.1"></script>