I am trying to add a dropdown menu in JCE editor. The dropdown will contain a list of items fetched from database. Please find the below code:

(function () {
    tinymce.create('tinymce.plugins.CustomHTML', {
        init: function (ed, url) {
            var menuItems = [];
            var myListItems = ['Item1', 'Item2', 'Item3', 'Item4', 'Item5', 'Item6', 'Item7',
            'Item8', 'Item9', 'Item10', 'Item11'];

            tinymce.each(myListItems, function (myListItemName) {
                    text: myListItemName,
                    onclick: function () {
            ed.addButton('custom', {
                type: 'menubutton',
                text: 'Custom',
                icon: 'code',
                menu: menuItems
           //this should add menu items but in Joomla, ed.addMenuitem is giving error
            ed.addMenuItem('mypluginnameDropDownMenu', {
                icon: 'code',
                text: 'Ruchika Plugin Name',
                menu: menuItems,
                context: 'insert',
                prependToContext: true
    tinymce.PluginManager.add('custom', tinymce.plugins.CustomHTML);

Looking for guidance in what am I missing here? And how to get the dropdown list dynamically?

I am able to create a button in the toolbar. Created both jce and normal joomla editor plugin but stuck at the same place to create a dropdown list in the editor.

Referred: https://stackoverflow.com/questions/16561802/adding-custom-drop-down-list-in-tinymce

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.