Softr Docs

Enabling User Avatar

Allow your users to add an avatar image
Let's see how you can allow your users to upload avatar images to be shown on site header.

Enabling user profile on header

First of all, you need to enable the "Show user profile" toggle on your Softr app header.
Show user profile
Make sure to update your header block, as the avatar functionality won't work on header blocks created before its introduction.

Mapping the avatar field to Airtable

Now, you need to map the avatar field to Airtable, so that images uploaded by users are stored there. You may or may not have your users base connected to Airtable already. Let's consider the two cases separately as the workflow is a bit different for each.

Airtable is not connected

If you haven't connected your users to Airtable, you can do so from the User Profile block or Users tab, mapping the Avatar field. As soon as you do that, the Avatar field will automatically appear on your User Profile block as shown below.
Connecting Airtable and mapping the Avatar field

Airtable is connected

If you already have Airtable connected, you can add a "File" type field in your User Profile block settings and map it to the corresponding field on Airtable manually. Moreover, you need to edit your Airtable connection and map the same field there as well (Select Avatar field option as shown in the screen recording above).
Note that, mapping the field from BOTH the User Profile block and Airtable connection settings is necessary for enabling the avatar.

Avatar upload by the user

That's it, now the logged-in users will see an option to upload an avatar on their User Profile and can update it at any time. See below how it works.
User uploading an avatar