Demo to preview the settings
Introduction
Effortlessly enhance your Bubble app’s interactivity with the Mention & Tag Users/Items (Tagger) plugin. This powerful tool enables a sleek mention feature that can be added to any input field, allowing users to tag individuals or items with a customizable symbol like '@'. Ideal for comments, chat features, or interactive forms, this plugin introduces a dynamic floating menu that’s both user-friendly and fully customizable to match your app’s design.
With Mention & Tag Users/Items (Tagger), you can define a list of mentionable items, adjust the floating menu’s style, and capture mention data directly from the input, giving you precise control over tagging interactions in your app. This versatile plugin is perfect for collaborative apps, boosting engagement and adding streamlined communication options that elevate the user experience.
How to setup
- Install Mention & Tag Users/Items (Tagger) plugin
- Place the Mention - Tagger on the page
Plugin Element Properties
Title | Description | Type |
Input ID | Make sure this ID is unique on the page! The element ID of the input your would like to add the mention / tagging ability to. For example: mention-input-1 | Text, Required |
Mention Name Data | A list of text that is the same length as the other 'mention' data that contains the Name (name shown in searchable popup menu) of the data item you are showing | Text, Opitonal |
Mention Display Name Data | A list of text. Make sure that the display names do NOT contain spaces! Also make sure that this list is the same length as the other 'mention' data that contains the Display Name (name shown in editor) of the data item you are showing | Text, Opitonal |
Mention ID Data | A list of text that is the same length as the other 'mention' data that contains the ID of the data item you are showing | Text, Opitonal |
Trigger | Trigger Element ID | Text, Required |
Menu Background Color | Menu Background Color | Color |
Menu Border Width | Menu Border Width | Number, Required |
Menu Border Color | Menu Border Color | Color |
Menu Border Radius | Menu Border Radius | Number, Required |
Item Highlight Color | Item Highlight Color | Color |
Menu Top Margin | Menu Top Margin | Number, Required |
Disable? | This setting disables the ability to mention users within the inputs. You can configure this dynamically, for instance. | Checkbox |
