Website

Salesforce Data on Your Website

Screen Shot 2018-04-03 at 4.41.24 PM.png

Many organizations want to display information from their Salesforce instance on their website. We work hard to collect data in Salesforce, so let's use it! In this post we'll take a look at how to do that using a Salesforce-integrated app called Form Assembly. These instructions are geared towards Salesforce System Administrators with a moderate-to-advanced understanding of Form Assembly.

Let's say we have lots of volunteers at our organization and we want to give credit on our website to the top five volunteers. To do this, we'll create a form which pre-fills a list of five Contacts with volunteer hours in descending order.

Screen Shot 2018-03-20 at 4.21.15 PM.png

Basic Form

Create a form with a repeatable section which displays the Contact's full name and number of hours volunteered.

Screen Shot 2018-03-20 at 4.24.04 PM.png

Clean up the form

Clean up the form by doing the following:

- Hide the section title and border

- Hide the field labels

- Make the fields read-only

- Limit the repeatable section to 5 sections max

- Add a hidden field as the first field in the repeatable section displaying the No. of Volunteer Hours so that we can sort the repeatable section in alphanumeric descending order

 

Screen Shot 2018-03-20 at 3.49.11 PM.png

Custom Code

In the Custom Code section of the form, add this tiny bit of code below. This will hide the remove and add another hyperlinks in the repeatable section and get rid of the submit button.

/*Removes the remove link in a repeatable section*/  
       .wForm a.removeLink {
          display: none;
       }
 
  /*Removes the Add Another link in a repeatable section*/
        .wForm a.duplicateLink {
           display: none;
        }

  /*Removes the submit button*/
         input.primaryAction {
            display: none;
         }

Screen Shot 2018-03-20 at 3.46.17 PM.png

Pre-fill Connector

Since this form has no submit button, we only need to create a pre-fill connector. The connector queries all Contacts from Salesforce with more than 0 volunteer hours. We're mapping the list of Contacts into the repeatable section in descending order. Our field mappings include: No. of Volunteer Hours (for sorting purposes), Contact Name and No. of Volunteer Hours again (for displaying purposes).

Screen Shot 2018-03-20 at 3.32.55 PM.png

Voila!

When we load the form in a browser, we will see the top five volunteers listed in order of hours volunteered. Feel free to add columns of data or additional criteria to the pre-fill connector to adjust this base template. You can also check out Form Assembly's Publishing Options to find out how to add this component to your website.

 

In just a few steps, we've managed to expose Salesforce data on our website in an interesting and productive way. If you want to display data in more robust ways and allow for searching, check out the Soapbox Engage Directories App.

Let us know if you have other ideas about interesting data to share with constituents.