Build a lead form for your website

Did you know you can build a lead form for your website, so your leads can all go into CostCertified?


Important note

  • We have implemented a standard and automated spam/bot/spider filtering system. After making a request, your leads/potential clients will be routed to an intermediary page that will ask them to mark a checkbox, and then the lead will be fulfilled. Implementing reCaptcha is no longer necessary. This is what your leads will see:


Some things you can achieve with lead forms

  • Add custom fields so you can pre-qualify every lead

  • Create lead-rotations so your sales people get leads on a round-robin

  • Have the owner/manager notified on each new lead

  • Link a lead-form with a lead-source, so you track that leads from the website come from the website, and leads from a separate landing page come from there, so you can track your ROI

  • Connect with an HTML form or through CURL/api


Steps to build a lead-rotation and lead-form code snippet

  1. Go to the Lead rotations page

  2. Create new Lead rotation

  3. Add a name for your lead rotation

  4. Choose which of your users are included in the lead-rotation. These users will be assigned leads on a round-robin.

  5. You can also choose multiple users who will be notified for each lead regardless of who it goes to in the round-robin (Who else should be notified?). Great for an office manager, front-desk, sales manager or owner etc. (optional)

  6. You can also add a success/thank-you URL. Click on Advanced and enter your link the Success URL field.

    • By default leads will get an email thanking them for submitting the lead form, and they will be shown a generic thank you page. You optionally can specify your own success page that they will be sent to after submitting the lead.

  7. Save the lead rotation

  8. Now go to the tab on top called Generate code snippet

    1. You can specify a lead-source for the code snippet, or your webmaster can use any of your lead-source ids to dynamically change that field on your website depending on analytics data about the source of the lead (adwords, facebook, bing etc), and change that field on the fly.

    2. To manage lead sources you can go to the Lead sources page from the services menu

    3. Specify the default fields you want to collect for the client.

    4. Copy and paste the snippet at the bottom and give it to your webmaster or add to your website yourself

    5. The snippet is provided without styling. Feel free to style it however you like according to your website/branding.

    6. Required fields are: lead_rotation_id. We recommend making one form of contact required, either user_email or user_phone, and at least a first name user_fname.

  9. When a new lead comes in, the user who receives the lead from the round-robin receives a notification by email, and it will show up in their email. Any users in the Always notify field will also receive a notification. Managers can see the lead by going the the pipeline and filtering by the user that received the lead.

  10. When you have contacted the client and confirmed their contact details, be sure to Convert it to active client. This will make sure it shows up in the right column in the pipeline to indicate that contact has been made, and from there will prompt you to create a new proposal for them.


Adding custom fields

  1. You can add custom fields and they will appear on the lead on the lead information page

  2. Any fields that have an official CostCertified version (first name, last name, email, phone, city, postal/zip, description/request) must use our field naming format related to that field. Anything else that does not have a CostCertified field version can be named anything you like, and it will save and display on the lead.

    1. For example, if we are collecting a first name it must be in the format user_fname, because that is the only way CostCertified will register it as a first name. If you are adding a custom field that doesn’t relate to anything in CC, then you can call it whatever you want.

    2. Official fields:

      1. user_fname - first name

      2. user_lname - last name

      3. user_email - email

      4. user_phone - phone

      5. user_address - address line 1

      6. user_suite - address line 1 / unit / suite

      7. user_city - city

      8. user_postal - postal/zip

      9. activity_desc - request / description field / long text

    3. Note: if you build a form with an id or key of ‘firstName’, CostCertified will not register it as a first name and the lead will appear as if it has no first name. It must be sent as user_fname.

  3. To add a custom field, just add extra fields inside the <form> of the code snippet with descriptive id/names, they will automatically be bundled and added to the Requests tab on the Client panel when you open the client.


Submit a lead via API endpoint

  1. Get your endpoint URL. Every lead-rotation has its own endpoint URL specifically for api-routed submissions. o it is important you get the one that is generated in the code snippet from the Generate code snippet tab from the lead rotation window. You can find it underneath the generated form snippet on the lead rotation panel:

  2. Once you have the endpoint you can generate a curl request manually, or route to that address from Zapier or Integromate, or directly from your own code or platform. Here are some examples using curl (bash) or fetch (javascript).

    1. CURL - You can also just include other key:value pairs if sending the data via CURL. Replace {your endpoint url from form code snippet generated} with your endpoint url.

      1 curl '{your endpoint url from form code snippet generated}' --data-raw 'lead_rotation_id=2989995&activity_desc=New+request+comments&user_fname=John&user_lname=Smith&'
    2. FETCH - From javascript you can programatically send a lead by copying the endpoint URL from the form snippet and implementing the following script using the official fields. Replace {your endpoint url from form code snippet generated} with your endpoint url.

      1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 fetch("{your endpoint url from form code snippet generated}", { method: "POST", body: JSON.stringify({ user_fname: 'John', user_lname: 'Smith', user_address: '123 Pine Street', user_postal: '12345', user_city: 'City Name', user_email: '', user_phone: '12345678910', activity_desc: 'I would like a highly accurate quote on a renovation in record time!', customField1: 'My custom field value', customField2: 'My custom field value 2', }) }).then(res => { console.log("Request complete! response:", res); });