Thursday, February 20, 2020
3 min read
This past week while integrating Zapier and Webflow, I became surprised to learn that updating reference and multi-reference fields did not work right out of the box. After spending more time than I wanted on it, I was able to make it work for both single reference and multi-reference. This post is only about multi-reference as single-reference is actually "easier."
In my "Lookup Spreadsheet Row in Google Sheets", I am looking up the corresponding row to see if there are already referenced items. For a User that has multiple Posts, I would be looking up the User and return the column for Posts reference.
That column will either be empty or be a string of referenced IDs like "1234"
, "ABCD"
, "34543"
Here I run some Javascript to clean up what I am looking for. I have the new Post ID coming in and a list of current IDs already attached to the user.
1let result = [];2if (inputData.articles != null && inputData.articles.length > 0) {3 result = inputData.articles.split(",");4}5result.push('"' + inputData.newArticle + '"');6result = result.join(", ");7output = [{ articles: result }];
The code goes through the Post column. If there is currently data there (already has posts), it splits the string into an array from "1234"
, "ABCD"
, "34543"
into ["1234", "ABCD", "34543"]
.
Then, with the new Post ID, I push that onto the end of the array so it then becomes ["1234", "ABCD", "34543", "NEW*POST*ID"]
.
Lastly, because I can't have an array and actually need a string, I concatenate it all together into "1234", "ABCD", "34543", "NEW*POST*ID"
.
Now I go back and update the same Google Spreadsheet with the updated posts reference. This is for next time and Post is added, it will be the correct references.
Lastly, a PUT request to the Webflow API. I follow the documentation https://developers.webflow.com/#update-live-collection-item to understand a little bit more how the request should be built and ended up with something fairly simple in Zapier.
Key Points from the Screenshot below:
{CollectionID}
with your collection.{Webflow_ID}
is the ID of the Webflow item you are trying to update. In this scenario, it would be the User"name"
, "slug"
, "*archived"
, and "*draft
are all required in the request.