Install the Plugin:
1.Go to the Bubble.io Plugin Marketplace.
Search for "Ez Simple Timer".
Click on the plugin and then click "Install".
Add the "Ez Timer" Element to Your Page:
2.Open your Bubble.io application in the editor.
In the Design tab, find the "Ez Timer" element in the Elements panel.
Drag and drop the "Ez Timer" element onto your page.
Configure the Element Properties:
3.Select the "Ez Timer" element on your page.
In the Property Editor, configure the following properties:
Seconds : Set the initial countdown duration in seconds. For example, enter 60 for a 60-second countdown.
Element ID : Enter the ID of the HTML element where the countdown timer will be displayed. Make sure this ID matches the ID of an existing element on your page.
Date Until : (Optional) Set a target date and time for the countdown. If this is set, the timer will count down to this date and time instead of using the initial time.
Set Up the Display Element:
4.Ensure you have an HTML element (e.g., a Text element) on your page with the same ID* as specified in the "Element ID" property.
* For activate ID attribute of elements, check Settings Tab -> General
This element will display the countdown timer.
ALTERNATIVE : Use the "Current Value" State:
The plugin maintains a "Current Value" state that reflects the current countdown value in seconds.
You can use this state in your workflows or display it in other elements on your page.
Handle the "Countdown End" Event:
The plugin triggers a "Countdown End" event when the timer reaches zero.
You can create a workflow to handle this event:
Go to the Workflow tab.
Create a new event by selecting "An element's event" and then choosing the "CountdownTimer" element.
Select the "Countdown End" event.
Add actions to this workflow to define what should happen when the countdown ends (e.g., show a message, redirect the user, etc.).
Example Workflow
Display a Message When the Countdown Ends:
Create a Text element on your page to display the message.
Go to the Workflow tab and create a new workflow for the "Countdown End" event.
Add an action to show the Text element with your message.
Redirect the User When the Countdown Ends:
Go to the Workflow tab and create a new workflow for the "Countdown End" event.
Add an action to navigate to another page or URL.
By following these steps, you will be able to install, configure, and use the Countdown Timer Plugin in your Bubble.io application. This plugin provides a flexible and customizable countdown timer that can be easily integrated into your workflows and user interface.
Hire us:
Fivver UpworkFollow us:
Eazycode custom nocode development Linkedin Instagram Facebook Twitter