I am seeking assistance in setting up a button that is conditionally visible based on an agent’s availability. I’ve established a webhook that triggers whenever the agent toggles their status between “available” (true) and “unavailable” (false). My initial approach involved using Flows, which offers a webhook listener feature. However, I encountered an issue: I can only store the status in a custom field within a CMS item, and the pages where I intend to display the button are not CMS pages. Consequently, I am unable to utilize the conditional visibility feature.
I would greatly appreciate any suggestions on how to resolve this matter.
Hey Marcelo, this is quite straightforward using custom code.
Basically you’ll do a javascript fetch and then depending on the result, you’ll show the button or not.
I’d personally recommend that you always show the button, but enable/disable it accordingly- part of the reason is that you also what an “unknown” state while it’d waiting for the webhook response.
If you google “JS fetch against API” you’ll find all of the basics you need. But if you need a dev to help, send me a DM.
Thanks for getting back to me so quick! Using custom code means this would be executed on the client side, right? This means I’d need to be doing an API call on every page load to determine the visibility of the button, rather than having a webhook listener on the server side and change the visibility only once the webhook runs. Is that correct, or am I missing something?
Webflow doesn’t have any server side code facility so you’re very limited in what you can do outside of the browser.
Your approach to use a Logic webhook could work well, except;
You can only store data in the CMS which means you’d need to use a collection list to retrieve that data ( or house your button ) on the pages you want it.
Logic flows cost one form submission per execution, so if your webhook is getting fired many times throughout the day, you’ll exceed your monthly form submission quota and be charged $0.01 per status-update.
