Omeka S Footnote JS Module

Hi all!

First time I’m writing here. I’ve seen the perfect module I need for having enriched footnotes on my Omeka S site: The only problem is that this module is for Omeka Classic. Is there an easy way to use it or implementing it on Omeka S?


1 Like

I published a version for Omeka S here :
The edition is not adapted (Omeka Classic uses tinymce and Omeka S uses ckEditor), so you have to set the footnotes manually in the html blocks. Furthermore, it uses littlefoot, not bigfoot, because bigfoot is not compatible with jQuery 3, but the code is the same.

1 Like

Thank you very much! I’m trying to adapt the ckEditor right now, but it’s a little tricky for me. Anyway, I hope to have some results soon.

Edit: actually I have a question. I’m modifying the /asset/js file creating a new ckEditor plugin, following this guide: I don’t know if it is the right strategy, because even if it seems to have (at least a part of) the right code, the button doesn’t show up in the editor when I install the module.

I’m wondering how Omeka S implements ckEditor, if it is needed to change the config.js file of the Omeka installation inserting config.extraPlugins = nameoftheplugin. I don’t understand how to change it from the module itself, without going inside the installation file and modifying it by hand.

I just published the release (that contains the dependency if you don’t use composer).
It is never recommended to modify code, it will be unmaintainable. So I added a view helper to load the good config. I’m not sure if it’s needed to override all the ckeditor core directory to add a ckeditor plugin.

1 Like

Thank you very much for this. I’m encountering a problem I can’t get trought: when I load the module, whatever are the changes made in ckeditor.config (inside the module), the editor loaded is this one

My code is this (this is just the part for the button to appear).
In footnotes-admin.js:

 // run once the page DOM is ready and loaded
 $(document).ready(function() {
 $(window).on('load', function() {

function displayFootnote() {
       // Define a command that opens our dialog tab.
    CKEDITOR.addCommand('little_footnotes', {
      exec: function (editor) {
        new CKEDITOR.dialogCommand('footnotesDialog');
      // Create a toolbar button that executes the above command.
      editor.ui.addButton('Little_footnotes', {
          // The text part of the button (if available) and tooptip.
          label: 'Insert Footnotes',
          // The command to execute on click.
          command: 'little_footnotes',
          //The image of the button.
          icon: this.path + '/icon/superscript-solid.png'

        // Register the "footnote" dialog.
		CKEDITOR.dialog.add( 'little_footnotesDialog', this.path + 'dialogs/foot-dialog.js' );

and in ckeditor_config.js:

config.toolbar = [
        { "name" : "advanced", "items" :
            ['Sourcedialog', '-',
             'Link', 'Unlink', 'Anchor', '-',
             'Format', 'Styles', 'PasteFromWord'
        { "items" :
            ['Bold', 'Italic', 'Underline', 'Strike', '-',
             'NumberedList', 'BulletedList', 'Indent', 'Outdent', 'Blockquote', '-', 
             'Little_footnotes' //the footnote button

Maybe my code isn’t right so it loads the other version of the editor?

I don’t have this issue, the new config is working (I removed Bold for check).
Are you sure to have last version of the module :

Yes, I checked, anyhow I tried to use the code above with a new and clean version of the module. Now the editor is not being changed with no reason, but the icon and the command don’t show up. Well, I’ll figure it out