Forum

Thread tagged as: Question, Problem

Customize Redactor 3 in Perch 3.1

I've used a customized version of Redactor 3 in Perch 3.0.x. Using it in Perch 3.1 fails, no plugins are visible. What do I have to change in my config.js? Probably it's because the built-in version is showing the plugins inside the textarea? Here's my config.js:

Perch.UserConfig.redactor = function(){

  var get = function(profile, config, field) {

    if (config.plugins.indexOf('source') === -1) config.plugins.push('source');
    if (config.plugins.indexOf('table') === -1) config.plugins.push('table');

    config.buttons = ['format', 'bold', 'lists', 'link', 'file', 'image'];
    config.formatting = ['p', 'blockquote', 'h3'];

    return config;
  };

  var load = function(cb) {
    if (typeof jQuery.Redactor.prototype.source == 'undefined') {
        jQuery.getScript(Perch.path+'/addons/plugins/editors/redactor-plugins/table.js', function(){
        jQuery.getScript(Perch.path+'/addons/plugins/editors/redactor-plugins/source.js', cb);    
      }); 

    } else {
      cb();
    }
  };

  return  {
    'get': get,
    'load': load
  }

}();

Many thanks for your help!
Martin Stettler

Martin Stettler 0 points

  • 3 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

It should be largely the same. Have you updated your plugins for Redactor 3?
Martin Stettler

Martin Stettler 0 points

3 years ago

I was using already Redactor 3 before, so this can't be the problem. I just tried your example you posted here: https://forum.grabaperch.com/forum/06-28-2017-help-with-customising-redactor-toolbar-with-minimal-buttons:

Perch.UserConfig.redactor = function(){

var get = function(profile, config, field) {
return { buttons: ['bold', 'italic'] }
};

var load = function(cb) {
cb();
};

return {
'get': get,
'load': load
}

}();

As this works well, I think the problem has to do how the plugins are loaded. Have you got an idea?
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

Have you removed your custom version of Redactor 3 in order to use the one that now comes with Perch 3.1?
Martin Stettler

Martin Stettler 0 points

3 years ago

I only have the config.js-file inside the editors-folder and a folder «redactor-plugins» with my additonal plugins. I use no other redactor files.
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

Can you show us the code you're using that isn't working?
Martin Stettler

Martin Stettler 0 points

3 years ago

It's the one I posted above in my first thread. Thanks for checking this!
Drew McLellan

Drew McLellan 2638 points
Perch Support

3 years ago

Remove this check:

if (typeof jQuery.Redactor.prototype.source == 'undefined') {
}
Martin Stettler

Martin Stettler 0 points

3 years ago

Great, that made it, thanks a lot! :-) I appreciate your holiday support really a lot.
Mark Melling

Mark Melling 0 points

3 years ago

Hi Martin,

Is there any chance you could post your finished config.js?

Thanks.
Mark Melling

Mark Melling 0 points

3 years ago

Martin,

Actually - I figured it out. I wasn't sure how to code the load part of the code (the bottom half of your code sample at the top of this post) following Drew's advice about removing the if ... else. This seems to work:

var load = function(cb) {
  // loading plugins
  jQuery.getScript(Perch.path + '/addons/plugins/editors/redactor-plugins/alignment.js', function() {
    jQuery.getScript(Perch.path + '/addons/plugins/editors/redactor-plugins/table.js', function() {
      jQuery.getScript(Perch.path + '/addons/plugins/editors/redactor-plugins/video.js', function() {
        jQuery.getScript(Perch.path + '/addons/plugins/editors/redactor-plugins/counter.js', cb);
      });
    });
  });
};

return {
'get': get,
'load': load
}

}();
Martin Stettler

Martin Stettler 0 points

3 years ago

Hi Mark Sorry for the delay, I was in meetings. Although it seems that you found a solution, I put here a working example of my config.js.

Perch.UserConfig.redactor = function(){

var get = function(profile, config, field) {

if (config.plugins.indexOf('widget') === -1) config.plugins.push('widget');
if (config.plugins.indexOf('table') === -1) config.plugins.push('table');

config.buttons = ['html', 'format', 'bold', 'italic', 'lists', 'link', 'file', 'image'];
config.formatting = ['p', 'h3', 'h4'];

return config;
};

var load = function(cb) {
jQuery.getScript(Perch.path+'/addons/plugins/editors/redactor-plugins/table.js', function(){
jQuery.getScript(Perch.path+'/addons/plugins/editors/redactor-plugins/widget.js', cb); 
}); 

cb();
};

return {
'get': get,
'load': load
}

}();
Mark Melling

Mark Melling 0 points

3 years ago

Martin - thanks again!