Zapier + Webflow + Cotter: Send User Data to Your Webflow CMS using Zapier

Know who logs in to your Webflow site and get the list of user emails imported to Webflow CMS.

How it works

When you integrated Cotter to your site and a user logs in using Cotter’s Login Form, Cotter will immediately create a new user for you. This user is stored in Cotter’s database and can be accessed through our Zapier integration. Using Zapier, you can send user data to Webflow CMS. The user data that are available are defined in the documentation for User object.

Webflow Setup:

1. Create a CMS Collection called Users.
2. Under “Collection Fields”, set the first field label to “Email” and the second field label to “Cotter User ID” (the second field will be used as the slug).

3. Follow this Cotter + Webflow tutorial to make a Login Page using Cotter.

Zapier:

1. Add Cotter Zap using this invite link: https://zapier.com/developer/public-invite/116551/4631eb564ecce1c57f7fe88aa8c90671/.
2. Click “Make a Zap”.

Cotter Zap

1. Under “When this happens …” choose “Cotter” and let the trigger be “New User”.
2. Click “Sign in to Cotter” and enter your API Keys as instructed. You can get your Cotter API Keys from Cotter’s Dashboard.
3. Find Data to see a test data.
4. If this is a new project and you do not have a user yet, you will see “We couldn’t find a user”. Create a new user in your Cotter (1.0.0) Zapier — https://zapier.com/ account and test your trigger again.
5. Try logging in to your Webflow website’s “Cotter Login Form” located on your login page by publishing your Webflow site. Use an email address that you have access to. Once the login is successful, Cotter will automatically create a new user.
6. Test the integration again.

Webflow Zap

1. Under “Do this …”, choose Webflow.
2. Choose action: “Create Item” to make a test item, or “Create Live Item” to make the user data available in your published site. Make sure you use Create Live Item when your site is ready to be published and you want the user data to be available in your published site.
3. Login, Pick your site, then pick the “Users” collection that you created earlier.
4. For the Email: use identifier (email or phone).
5. For the Cotter User ID: use ID (Cotter User ID).
6. Select False for both Archived and Draft.

7. Click “Continue” and then “Test & Review”. Reload your Webflow project and see if there’s a new item in the Users collection.

8. If it succeeded, you can turn on the Zap and it will insert new users to your Users collection. (Zapier will check for new users every 2 minutes, please be patient when testing or click Run to fetch the data).

That’s it!

You should be able to see something like this under your “Users” CMS.

Under the “Email” section, you will see all emails that log in to your Webflow site (a list of your users’ emails).

Questions & Feedback

Come and talk to the founders of Cotter and other developers who are using Cotter on Cotter’s Slack Channel.

Ready to use Cotter?

If you enjoyed this tutorial and want to integrate Cotter into your website or app, you can create a free account and check out our documentation.

If you need help, ping us on our Slack channel or email us at team@cotter.app.

Originally published at https://blog.cotter.app on September 22, 2020.