Adding a notification sound
UI

Adding a notification sound

Himanshu Sharma
Himanshu Sharma

Many sites have a soft notification sound. Say when you get a new order from a customer or a new message. You can have such notification tones in your Bubble app as well.

There is no native option provided by Bubble, but we can achieve this with a bit of JavaScript.

Setup

Install the free Toolbox plugin. This plugin will allow us to run JavaScript on button press or when there is a new entry in the database. Then upload the notification sound you want to your Bubble using File Uploader. You can create a new Data type and save it there as a File type.

You can have as many notification tones as you'd like. Just upload them to your database to get the S3 link. After the sound has been uploaded, copy the S3 file link by going to the Data tab and copying the link.

Go the workflow where you want to have the notification sound and create a new action - Run JavaScript. Copy paste this code

let src = '//s3.amazonaws.com/appforest_uf/f1598429253106x343351561325749800/apple_msg_tone.mp3';
let audio = new Audio(src);
audio.play();

Replace the S3 link of your notification sound with the text that is bold and in italics between the quotes.

Hit preview.

How to setup notifications in Bubble.io for free
If you want to integrate notifications functionality in your app, you don’t need any plugin. It can all be done natively and the setup will only take 15 minutes.

Preview - https://nocodeassistant-tutorials.bubbleapps.io/version-test/notification_sound

Editor - https://bubble.io/page?type=page&name=notification_sound&id=nocodeassistant-tutorials&tab=tabs-1


If you need some help with your Bubble app or if you need a team of Bubble developers to build a Bubble app for you, send an email to me at [email protected] or follow me on Twitter



Join the conversation.