Link to the plugin page: https://zeroqode.com/plugin/emoji-ratings-plugin-for-bubble-1739740499497x192901268309277660
Demo to preview the plugin:
Introduction
This plugin allows you to add a Rating bar made up of emojis.
Usage Features:
- Add an emoji-based rating bar to your Bubble app
- Choose from a variety of emoji icons for custom user interaction
- Fully customizable layout and number of rating options
- Capture user input as a numeric or text-based rating
- Trigger workflows based on user rating selection
- Works on all devices and browsers
How to setup
- Add the Emoji Rating Element
- In the Design tab of your Bubble editor, search for the
Emoji Rating
element. - Drag it into your page where you'd like the emoji rating to appear.
- Configure the Properties
- Initial Rating: Set the starting rating value (e.g.,
1
). This defines which emoji is selected when the page loads. - Style: Choose the visual style of the rating. Options typically include
Star
or other emoji-based visuals depending on plugin version. - Emotion Size: Set the pixel size of each emoji (e.g.,
25
). - Disabled?: Check this box to make the element read-only (non-interactive).
Select the
Emoji Rating
element and configure the following fields in the Appearance tab:- Trigger Workflows on Rating
- Go to the Workflow tab.
- Add a new event:
- Use the event to trigger actions, like:
- Saving the rating to your database
- Showing a confirmation message
- Triggering custom logic based on the selected emoji
To respond to a user's emoji selection:
A Emoji Rating A New Rating Has Been Entered
Plugin Element Properties
Emoji Rating
Fields:
Title | Description | Type |
Initial Rating | Set the initial rating at page load (integer from 0-5) | Number |
Style | Choose one of the rating styles Available options: Happy, Mixed, Star | Dropdown |
Emotion Size | Emoji sizes in the rating. Default 30 | Number (optional) |
Disabled? | Choose if the rating element should be disabled, which means that it can’t be modified (not clickable) | Checkbox (yes/no) |
Exposed states
Title | Description | Type |
Current Rating | The current rating of the element | Number |
Element Events
Title | Description |
A new rating has been entered | Triggered when the user changes the value of the rating element. |