How to import profile image from Memberstack to CMS using Zapier? Answered
I'm using Zapier to create new CMS Item when new ms member is created. No problem getting all text-based custom fields data to import, but is there any way to get the profile image to also import?
Comments
11 comments
Hi Linda Felch 👋
I have not attempted this yet. I'm adding it to my to-do for later this week. I'll report back once I know more.
That said, Julian Galluzzo did create some MemberScripts tutorials on how to handle image uploads with Webflow. You might decide this a better flow for your use case?
https://www.memberstack.com/scripts/file-upload-field
Hey Linda Felch!
I actually found a solution for this which I use quite frequently - you can see it along with a tutorial in this template: https://webflow.com/made-in-webflow/website/member-profiles-with-posts
Regarding the profile pic uploader, could it be something due the fact i changed the name in MS from 'profile picture to 'profiel foto' ?
that it's messing somewhere there
For the image itself you should add data-ms-member="profile-image"
For the Upload Image button, it should have a data-ms-action="profile-image"
Julian Galluzzo is there any way i can save profile picture from memberstack into webflow cms using zapier? I store all the information, name, email, message into webflow cms, and now i need to store profile image to webflow cms using zapier. please let me know if there is any way i can save it. thanks
Hey there Tehseen Ullah! You can probably do this in the same way as you would using make.
You would have to use this memberscript in order to propogate the profile image into the input field that would grab the url of that image, and send it to memberstack.
Then you can grip the data from memberstack
<script> // Function to update the profile picture URL function updateProfilePicture() { // Find the image element with data-ms-member="profile-image" var profileImage = document.querySelector('img[data-ms-member="profile-image"]'); // Find the input element with data-ms-member="profile-pic-url" var profilePicUrlInput = document.querySelector('input[data-ms-member="profile-pic-url"]'); // Get the source URL of the profile image var profileImageUrl = profileImage.src; // Set the value of the input field to the profile image URL profilePicUrlInput.value = profileImageUrl; } // Update the profile picture URL initially updateProfilePicture(); // Monitor changes in the profile image source URL document.querySelector('img[data-ms-member="profile-image"]').addEventListener('load', updateProfilePicture); </script>Hi all. Is there a way to connect the profile image field from memberstack to zapier? I'm trying to update a member's profile picture in webflow CMS after they either upload one for the first time or update their avatar. It's driving me crazy and is absurd I can't easily fetch this...
Can somebody please explain this code to me?
It's from the social media clone, but I don't understand what to do with it or how it works
that code is for a profile image URL field, which is a workaround - before, there was no way to access the URL, but I would recommend using make - the profile image passes through just like this 🙂
Hey Jack Ellis, +1 to what Julian said.
In case, you have already setup zaps extensively for the project and want to use only Zapier, there is a workaround, where you can customize the trigger of your zap to a Webhook in Zapier, and listen to member.updated event from Memberstack.
You can set this up in Dev Tools via Memberstack dashboard, you just have to connect the zap's webhook url to the event.
I tested updating profile images, which gave me the Profile Image URL in Zapier trigger directly.
Hope this helps
Thank you for the help on this. I got it working shortly after with Make. Zapier appears to be slightly buggy with the memberstack integration
Please sign in to leave a comment.