▼
Streaming live at 10am (PST)

Realtime Notifications

Design help Custom code
#1

Hey guys,

I forked a pen and I am wondering if someone can help me understand how this notification would work if applied to a website. What I want is for a user to click the form submit button and then a notification appear in the top right (as done in the pen) BUT I want everyone who is on the website at the time to see it.

Is this even possible without refreshing the page? Just trying to understand how this could be done.

I’m looking for a “live” elements to add to my site. Does anyone have any experience or suggestions on something that can be done within Webflow?

https://codepen.io/moofawsaw/pen/xrrMWy

1 Like
#2

What the codepen does is load a list of notifications on page load, then show one at a time to the user. There isn’t a realtime notification system there.

For realtime notifications from all users, you will need a private server and websocket technology. Cannot do this just with Webflow alone.

1 Like
#3

Would something Like Pusher accomplish this? I am willing to put in the time to get it working, I just want to know where to get started!

#4

That looks promising

#5

@moofawsaw I don’t think you can run the PHP script in Webflow?
But Pusher.com has the functionality needed to do what you are saying. The question is, how to integrate that with Webflow? I think you would need to export your Webflow site and host on your own server. Then implement something like this Pusher.

#6

Webflow can handle the part to get/display the notifications as you can code them using JavaScript, but you still need the central server to store and push them out.

1 Like
#7

@moofawsaw
Seems simple enough.
A Similar process to connecting something like Algolia search.

#8

Would it be as simple as setting up a connection through Zapier?

Screen Shot 2017-06-22 at 7.45.56 PM.png2102×1354 249 KB

#9

@moofawsaw MySQL to Pusher to Webflow should work as a 3 step zap.

#10

Now it’s just tying that back into a form submit action. The idea is to display the notification after a successful form submit.

#11

@moofawsaw You wouldn’t need to connect it to the “Submit Button” The Webflow Zap allows you to trigger something when a form submission is created. You’d connect it to the form through Zapier. it gives you an outline to map the fields. Try it out!

  • Scott
#12

Thanks! I’ll let you know how I make out.

1 Like
#13

Yes, if you get this working be sure to post back on the forum with some detailed info on your process :slight_smile:
That is after all what we are all on here for!

2 Likes