Search code examples
etherpad

how to re-order etherpad toolbar buttons?


I want to reorder etherpad toolbar buttons. For inbuilt etherpad buttons, it could be done with exports.toolbar I found then comes the ones added by plugins using exports.eejsBlock_editbarMenuLeft hook. can anyone guide me re-order the ones added by exports.eejsBlock_editbarMenuLeft hook? Though the actual order I want falls in both sets e.g. Print, Import, Superscript, Bold etc.


Solution

  • You can use postToolbarInit hook and modify the order using jQuery once all buttons are set.

    exports.postToolbarInit = function (hook, context){
    
      var $superscript = $("#editbar li.superscript");
      var $subscript = $("#editbar li.subscript");
    
      var $underline = $("#editbar li[data-key=\"underline\"]");
    
      $subscript.insertAfter($underline.next("li"));
      $superscript.insertAfter($underline.next().next());
    };