Skip to main content

How to enable multiple image uploads for user profiles in Webflow with Memberstack integration?

Hi all, Hope you are doing good!

I have a challenge I'm struggling with at the moment: I want to allow users to upload more than one image to be displayed on their profile page and one file to be attached to their profile. When I say user profiles, I mean a webflow collection that is synchronized with memberstack via make. I guess that I need to do that with a custom webhook, but don't have a detailed clue, yet. Does anyone of you already did something like this?

Thanks in advance for your efforts!

11 comments

  • Duncan from Memberstack
    Duncan from Memberstack

    Hey Fred 👋 Julian Galluzzo created a few free templates that manage this with make and custom code code. Here are some links which might lead you toward an answer….

    https://www.memberstack.com/webflow-templates/social-media-template
    https://www.memberstack.com/webflow-templates/public-member-profiles

    And then search “file” on this page https://www.memberstack.com/memberscripts

    0
  • Fred
    Fred OP

    Hi Duncan! Awesome, thanks for the replay! I guess that is what i was searching for 🙂

    Duncan from Memberstack If I understnad it right, in the template you are using GoogleDrive as picture storage. Since, we are using the webflow business package which enables the file uploader with webflow hosting, I was asking my self if this is without googledrive possible? Do you know this?

    0
  • Julian Galluzzo
    Julian Galluzzo

    Fred it definitely should work, as long as the uploaded images are public!

    0
  • Duncan from Memberstack
    Duncan from Memberstack

    Yup! I’ve setup a project using the native Webflow files uploads in the past. It was probably 2 years ago now, but worked at the time

    I did not use the same code for that as shown in the example above. I managed everything with Make/Zapier.

    0
  • Fred
    Fred OP

    Duncan from Memberstack Nice! Yesterday, I was nearly there, but then i run into the problem that webflow is giving me a forwarding link to the uploaded file. Therefore, I'm not able to get the file / image synced into a webflow collection. Is my explanation understandable? Did you have the same problem, if yes, how have you solved it?

    This is what I did:

    • I placed a Webflow form with an upload input on a page (screenshot: The form.png)
    • Once, some is committed, I run Webflow logic to identify the user submitting it via webhook (Screenshot: Webflow Logic)
    • Then make comes in place and first updates my memberstack user and next updating my Webflow collection for the public profiles (screenshot: My Automation)
    • --> Up to this point, everything has gone according to plan
    • when now looking into memberstack, the user gets updated as expected, but the submitted and synced link is a forward and therefore the image cannot be synced with Webflow (screenshot: That is what I get.png)
    • when opening the link I get forwarded to another url ⬇️
    • The link should look like screenshot: That is what I need.png

    Does that help?

    0
  • Duncan from Memberstack
    Duncan from Memberstack

    I do remember having a similar problem and finding a solution... I'll look for the old tutorial. I'm not sure I still havei t

    Ooo I see... the last time I had this working I was using 100% Make.com instead of Webflow logic. Idk if this would fix it, but you might try posting the form submission directly to Make.

    0
  • Fred
    Fred OP

    I tried this first, but the webhook didn't receive any form information that was the reason why I used webflow logic

    I only get this form information in make

    Duncan from Memberstack Sooo, I managed to do it with the google drive version which is shown in julian's tutorial. But, I'm only able to save image files. Have you ever tried to do this with a .pdf? On my side, something strange is happening.. It uploads a pdf to google drive but the file only includes the files name and the original contents are gone. In addition, I'm not able to sync this file with a webflow collection. Do you have a solution for this?

    0
  • Julian Galluzzo
    Julian Galluzzo

    Fred I've managed to do this with amazon S3 before! https://www.google.com/search?q=memberstack+s3+file+uploads&sourceid=chrome&ie=UTF-8

    0
  • GRAPHITERIA
    GRAPHITERIA

    Hey all

    I’d love to know if there’s a way to allow users on my website to upload multiple images to their profiles. Are there any case studies of someone who has implemented this?

    0
  • A J
    A J

    Hey GRAPHITERIA, while there is only one profile picture for a user that can be uploaded, you can accept multiple file inputs from users via customizing this memberscript and possibly storing the image URL in the custom field in Memberstack which you can further utilize in your workflows / site.

    0
  • GRAPHITERIA
    GRAPHITERIA

    Thanks. I'll check it out.

    0

Please sign in to leave a comment.

Sitemap