Configuring the Autofiller widget client-side

This article will serve to give examples of how to map the Autofiller to pre-populate without having to log into the InGo Admin dashboard and update the widget's configuration.

The Autofiller widget can pre-populate a number of fields, with the most common of them being First Name, Last Name, Email, Company, Title, and LinkedIn URL. Depending on the social network, some or all of those fields may not be available to be populated from the social network.

See the list of available fields here:

Screen_Shot_2020-01-02_at_11.23.20_AM.png

The syntax in the <script> installations are as follows, assuming you want to pre-populate name, email, company, and title:

<script src="https://cdn.ingo.me/widgets/YOUR_WIDGET_ID.js 
data-ingo-fields.user.first-name="#YOUR-CSS-SELECTOR-FOR-FIRST-NAME"
data-ingo-fields.user.last-name="#YOUR-CSS-SELECTOR-FOR-LAST-NAME"
data-ingo-fields.user.email="#YOUR-CSS-SELECTOR-FOR-EMAIL"
data-ingo-fields.user.company="#YOUR-CSS-SELECTOR-FOR-COMPANY"
data-ingo-fields.user.company_position="#YOUR-CSS-SELECTOR-FOR-JOB-TITLE">
</script>

You can replace the attribute values with your CSS selectors (exactly as you would select them in CSS, with #, ., and [] characters). As long as you have authenticated with social in that session, you should see your form pre-populate fields based on the selectors and user data you assigned to it.