Adding TinyMCE media types and buttons into Moodle

Adding TinyMCE media types and buttons into Moodle

Rodney Wolford -
Number of replies: 10

Hello,

I'm still a newbie, just six months into Moodle, and some of it really vexes me.

Take the TinyMCE editor, for example. Here is the demo link from the TinyMCE site http://www.tinymce.com/tryit/full.php .

Click on the media button in the demo and a full set of additional media types are available, including Shockwave (.dcr), something I am using in almost all my lessons. Select that media option and a drag and drop box is available for it, just like that. Right now, I have to hand code it all in html, including cab files, and there is no easy way to flow text around the Shockwave media.

I have tried reading the instructions in Moodle and in TinyMCE that seem to suggest I can add these other buttons and elements, but I'll be darned if I can figure out how. Here are two links, one from Moodle and one from TinyMCE that talk about this:  http://docs.moodle.org/dev/TinyMCE_plugins and http://www.tinymce.com/wiki.php/Plugin:media

Can someone give me a hand with this? I'm sure it would help other newbies as well. Thanks in advance for any help.

Regards,

Rod Wolford

 
Վարկանիշների միջին թիվը. -
In reply to Rodney Wolford

Re: Adding TinyMCE media types and buttons into Moodle

Mary Cooch -
Documentation writers Նկարը Moodle HQ Նկարը Particularly helpful Moodlers Նկարը Testers Նկարը Translators Նկարը

Hi there. Does this help, in the documentation  - section 3.3 onwards Text editor ?

Վարկանիշների միջին թիվը.Useful (1)
In reply to Mary Cooch

Re: Adding TinyMCE media types and buttons into Moodle

Rodney Wolford -

Hi Mary,

I have looked at that administrator's configuration area in Moodle TinyMCE. But I have never figured out what is copied from the TinyMCE site into that area to enable the option for Shockwave.

Here is a graphic from the TinyMCE demo link in my previous post. When you click on the Media button, it displays a penelope of options that are not found in the Moodle Media plugin and I honestly do not see what code would be added in that administrator's configuration area to permit it.

I don't mind digging for an answer, but anymore hints? Please.

Thanks,

Rod Wolford

Attachment TinyMCE2.png
Վարկանիշների միջին թիվը. -
In reply to Rodney Wolford

Re: Adding TinyMCE media types and buttons into Moodle

Rodney Wolford -

Hi Again Mary,

A post script. I did look at your video and followed the links. It leads back to the TinyMCE page. But it seems what you are talking about implementing resides in the first group of buttons. What I am talking about is in the second set.

I've added another graphic showing you where I end up. I am trying to get these formating options, especially the Shockwave (.dcr) options into my Moodle TinyMCE editor.

I hope this adds some additional clarity. And I hope someone can help me a bit on this.

Thanks again,

Rod Wolford

Attachment TinyMCE3.png
Վարկանիշների միջին թիվը. -
In reply to Rodney Wolford

Re: Adding TinyMCE media types and buttons into Moodle

Richard Oelmann -
Core developers Նկարը Plugin developers Նկարը Testers Նկարը

Hi Roy,

The answer to this is to include the tinymce 'media' plugin into the editor and then you can add the button you are looking for.

In my Moodle2.4 (localhost on my laptop at the moment) this means going into the code to add the plugin.

In lib/editor/tinymce/lib.php, add the media plugin to the plugins section in the params array

'plugins' => 'safari,table,style,layer,advhr,advlink,emotions,inlinepopups,' .
    'searchreplace,paste,directionality,fullscreen,nonbreaking,contextmenu,' .
    'insertdatetime,save,iespell,preview,print,noneditable,visualchars,' .
    'xhtmlxtras,template,pagebreak,media',

Once you have done that, you can add the button ('media') onto the TinyMCE general setttings page as with the other buttons.

HTH

Richard

Վարկանիշների միջին թիվը.Useful (3)
In reply to Richard Oelmann

Re: Adding TinyMCE media types and buttons into Moodle

Rodney Wolford -

This has helped. I have added media to the plugins. However, now I am stuck with step 2. "...you can add the button ('media') onto the TinyMCE general setttings page as with the other buttons." I have never added a button before. So, I don't quite know where to begin.

I have gone to  plugins>text editors > Manage editors > TinyMCE HTML > General settings, but see no way there to add a plugin to the list. I And for the other buttons, I don't see how they are coded for addition to the list.

I have also gone to the TinyMCE HTML Section in the admin > plugins page, and see nothing that offers a way to add a button there.

And I have searched within Moodle on the phrase "add a button to tinyMCE," only to find this link, http://docs.moodle.org/24/en/Text_editor, the most recent for version 2.4, which only seems to run me back in a circle.

Sorry to be so thick. But how do you "add a button on the general settings page, as with other buttons?"

I do, very much, appreciate any additional guidance you or others can provide. I must admit I am amazed I can't find a simple step by step example for this. Maybe this can produce that in the long run.

Regards,

Rod Wolford

Վարկանիշների միջին թիվը. -
In reply to Rodney Wolford

Re: Adding TinyMCE media types and buttons into Moodle

Richard Oelmann -
Core developers Նկարը Plugin developers Նկարը Testers Նկարը

Hi Rod,

You will need to add the plugin itself to the plugins list in the TinyMCE code, but once its there you can add the button for this with the others in the tinymce general settings page (on 2.4 and above)

Quite simply add the word 'media' to the list of buttons in the position you want it to appear, separated by commas as the other items are. The names of the buttons are those which are used by tinymce - if you want a full list look at the source of the tinymce full example on their pages http://www.tinymce.com/tryit/full.php

Or follow the link given on the TinyMCE General Settings page in Moodle which (on my version, 2.4+) says

Each line contains a list of comma separated button names, use "|" as a group separator, empty lines are ignored. Seehttp://www.tinymce.com/wiki.php/Buttons/controls for the list of default TinyMCE buttons.

Once you have added the plugin to the lib.php file as in my previous post, you only need to add the name of the button (media) to the list of buttins on the general settings page, in whatever positino you want it to appear - comma separated as per the default list. Other buttons may be added (see the tinymce list from the link) although I think in 2.4 some of the plugins are not included by default and need to be hardcoded in as with the media one.

HTH

Richard

Վարկանիշների միջին թիվը.Useful (2)
In reply to Richard Oelmann

Re: Adding TinyMCE media types and buttons into Moodle

Rodney Wolford -

Richard,

WOW! So easy, actually. I had assumed something more complicated because of the code materials I had seen on TinyMCE page. Also, many of the buttons separated by the "|"  system had lists attached with them, and I had assumed that such a list was needed for the "media" button as well. Also, thanks to Mary. She was on the right track. I just didn't pick up on how to use the setup area for adding the media button.

I think this is going to make by job of adding Shockwave much easier! Thank you so very much.

Rod Wolford

Վարկանիշների միջին թիվը. -
In reply to Rodney Wolford

Re: Adding TinyMCE media types and buttons into Moodle

Rodney Wolford -

I guess I spoke too soon. Yes, the plug-in is now available, and it operates as designed --except that when I try to upload a .dcr file, it tells me the file type is not allowed: "application/x-director filetype cannot be accepted."

Because it seems to be associated with the file picker, I am hoping you might have the answer. Meantime, I will search other places on Moodle to see if I can figure it out.

Again, thanks for any assistance you might be able to offer.

Rod Wolford

Attachment TinyMCE4.png
Վարկանիշների միջին թիվը. -
In reply to Rodney Wolford

Re: Adding TinyMCE media types and buttons into Moodle

Richard Oelmann -
Core developers Նկարը Plugin developers Նկարը Testers Նկարը

hi Rod,

We're now moving outside my area of experience as i haven't done any work with the filepicker itself, but I'm sure there will be others around who will be able to help ( and that i can learn how that works as well! ժպտում եմ )

I'm glad we got this far and you know how to work with the plugins and buttons now though - next comes the file picker itself :D

Richard

Վարկանիշների միջին թիվը. -
In reply to Richard Oelmann

Re: Adding TinyMCE media types and buttons into Moodle

Rodney Wolford -

Richard,

Thanks for your help. Since this post I have been searching things such as "adding new file types." Seems issue may be tied up in a combination of repository settings and filepicker. As of yet haven't found anything that specifically sets file types. Oh well.

Rod

Վարկանիշների միջին թիվը. -