How can I fix Aloha HTML5 editor at a specific position on a page?

Question

I need the Aloha editor to snap to a specific position, rather than bouncing all over the page.

Is there a configuration option for this? There is an “add” option to configure Aloha, but I cannot figure out how to apply it or even if it solves my problem ...

It also opens hacks to redefine the position if there is no configuration parameter.

Answer 1

The answer to my error report is:

This parameter was added to the dev branch (but has not found a path to the release branch so far) and a description for it in the manuals has been added to the release branch.

https://github.com/alohaeditor/Aloha-Editor/issues/584#issuecomment-6870029

Answer 2

The configuration indicates that you use the "element" parameter to specify the identifier of the element to add:

behaviour: 'float', // 'float' (default), 'topalign', 'append' element: 'my-html-element-id', // use with 'append' behaviour option: HTML DOM ID of the element the FM should get the position from 

Also, use other options such as draggable: false and pin: false.

If this does not work for you, open bugreport .

Answer 3

 var toolbar = $('.aloha-toolbar'); // make the toolbar extend to 100% of the div. toolbar.css({'width': '100%', 'height': '100%', }); // ADDS THE ALOHA EDITOR TO A DIV! $('#alohaContainer').append(toolbar); // Renders the toolbar to the screen UiPlugin.showToolbar(); // The child element must also be resized, don't know why toolbar.children().css({'width': '100%', 'height': '100%'});