# Custom Control Menu

You can add a custom control menu, which appears next to a Canvas element when it is selected. For instance, in the screenshot below, the red "X" appears beside any element when it is selected.

![](https://2486055478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOwxFzRfBRMCDtkHUwlsR%2Fuploads%2FHqFWX08IMvMMC9LRdVyV%2Fimage.png?alt=media\&token=50401dc0-30af-4b2e-af47-d76f415ec3c8)

In order to set this up, follow the instructions below.  Here is a link to a [Bubble editor example](https://bubble.io/page?type=page\&name=customcontrol\&id=fabricjs\&test_plugin=1565920055521x927769972289306600_current\&tab=tabs-1).

1. Add the Canvas to your page
2. Add a standard Bubble Group element to your page\ <img src="https://2486055478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOwxFzRfBRMCDtkHUwlsR%2Fuploads%2FQO8QpfCKHDtope2yzcWb%2Fimage.png?alt=media&#x26;token=e06349c0-0da9-47b8-8a63-4e8d2659a098" alt="" data-size="original">
3. Add a [HTML id attribute](https://guide.techblocksco.com/useful-tips/element-html-id-attribute) to that group
4. Enter that HTML id attribute in "Group HTML id" property on the Canvas element\
   ![](https://2486055478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOwxFzRfBRMCDtkHUwlsR%2Fuploads%2FslQAfJOnTOXNdK7xZ9UE%2Fimage.png?alt=media\&token=5b5612c1-1763-41e3-80fc-8aa39ff2cea0)
5. Adjust the X and Y offsets (optional)
6. Within the the group, you can add workflow actions to elements. For instance, when a user clicks the "X", we've set it up so that it deletes the element from the Canvas
