User avatar assistance!

Hi!
I can’t seem to find the solution to what I assumed would be a very easy-to-crack issue.
I am using Softr as a client portal app and want to allow my users to upload profile photos. However, I can’t seem to figure out how to link an image field to update the avatar icon in the header.

Am I overlooking something obvious?

Thanks in advance! :blush:
Taylor

1 Like

I don’t think it’s possible, but would love to know if it was!

1 Like

I’m doing this with my own Members table. You need to have a few bits in place to make it work.

  1. Have a members table that syncs with the softr user table
    https://docs.softr.io/memberships/data/connect-to-airtable

  2. Set user permissions on the member table to allow editing and specify specific fields included an attachment field for their Avatar. Keep in mind that Airtable does not have a setting to restrict the attachment field to ONE attachment. If the member uploads 10 pictures, the first one in the list is the one that’s displayed.
    Edit Permission - Softr Docs

  3. Create a new page with either a list block or a details block. Either one would require a filter to only display the one record where the member ID (I use email address) matches the currently logged-in user.
    https://docs.softr.io/building-blocks/chart/chart#filtering-based-on-logged-in-user-parameters

  4. Allow editing for the list or details block
    Block Editing by Users - Softr Docs

I’ve gone a step further to set a default avatar whenever the attachment field is empty. This requires another table and an automation. If you want more details, let me know.

-Jeff

2 Likes

Thank you for your perfectly explained response!

I believe I have set my site up correctly for each of these steps. The photo displays correctly in my list & list details blocks - however, I don’t know how to connect the “profile photo” attachment field to the avatar placeholder in the header. Were you able to connect the two?

I would also love to hear how you set the default avatar! It’s difficult to see that they can upload a profile photo since the field is hidden when empty.

Thanks again for your help! :blush:

1 Like

Hey folks we do work on an avatar solution :slight_smile: will be coming up in the next few weeks.

1 Like

Hey is there any update on this?

Hey David,

Not available yet, however the feature should be launched soon :slight_smile:

Thanks!

Hi everyone, I came searching for this solution. Has there been an update yet?
Thanks!
Carrie

Hey folks here is how it’s done: User Profile

This link does not work - where do I find this information now?

Hey @Alana,

Please check the following doc > User Profile

If you need assistance, let me know :slight_smile:

Hi,
Struggling to follow the workflow to edit user data source connection.
Cannot find it! The video appears to gloss over that part or goes so quickly I cannot see what happens :frowning:

The help states:

Data source is connected
If you already have a data source connected, you can add a “File” type field in your User Profile block settings and map it to the corresponding field in the data source manually . Moreover, you need to edit your data source 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 data source connection settings is necessary for enabling the avatar.

Found it. In the drop-down next to Users text in the User screen. Ha, ha