3

I'm attempting to write a basic plugin for Redactor (Redactor plugin on Craft 3 RC) but I'm tripping at the first hurdle:

It seems I can add any attribute to my <abbr> other than a title (the only attribute I need!). Here is my code so far:

(function($)
{
    $.Redactor.prototype.abbr = function()
    {
        return {
            init: function ()
            {
                var button = this.button.add('abbr', 'Abbreviation');
                this.button.setIcon(button, '<i class="re-icon-toggle"></i>');                
                this.button.addCallback(button, function()
                {
                    this.inline.format('abbr', 'title', 'test');
                });
            }
        };
    };
})(jQuery);

It wraps the selected text in <abbr> but fails to add the title attribute. Other attribute types, such as class work fine:

this.inline.format('abbr', 'class', 'test');

(In two minds whether to post this here or on SO but as this is for a Craft site...)

  • Are you sure it doesn’t have to do with your field’s “HTML Purifier” settings? – carlcs Dec 12 '17 at 17:32
  • @carics - sorry for the slow response. I've just tried disabling HTML Purifier on that field but it made no difference. Also tried disabling "clean up HTML" but that didn't help. – Joe Spurling Dec 13 '17 at 12:39
  • that’s not good, because it’s now very likely that it is a bug in the Redactor code itself. I know that they are stripping out / not allowing certain tags or attributes because they are, for example, using them to temporarily store information. – carlcs Dec 13 '17 at 13:41
  • 2
    @carics - it is a bug in redactor itself but it doesn't seem that abbr is being used for anything. It's just not recognised by redactor as in inline tag. I added it to the inlineTags array (line 310 of redactor.js) and it works fine now. I'll send a message to Imperavi. – Joe Spurling Dec 13 '17 at 20:49
  • 1
    Now that you mention that array, I can remember – it is not very complete. Good luck with your support ticket and you can totally add your comment as an official answer! – carlcs Dec 14 '17 at 16:28
2

Digging into Redactor a little deeper I found that it fails to include <abbr> in its list of inline tags. To add support I made the following modifications to /lib/radactor/redactor.js:

Line 149:

pasteInlineTags: ['br', 'strong', 'ins', 'code', 'del', 'span', 'samp', 'kbd', 'abbr', 'sup', 'sub', 'mark', 'var', 'cite', 'small', 'b', 'u', 'em', 'i'],

Line 310:

inlineTags: ['a', 'span', 'strong', 'strike', 'b', 'u', 'em', 'i', 'code', 'del', 'ins', 'samp', 'kbd', 'abbr', 'sup', 'sub', 'mark', 'var', 'cite', 'small'],

I've made Imperavi aware of the omission so hopefully they'll get this sorted in the next release.

Update: Imperavi have sent a response:

We'll add the abbr support including the paste arrays in the next update.

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.