Configure CKEditor to allow attributes

[Sonya*]

We can add official plugins for CKEditor from the repository. And we can create our own plugins. The issue is that HTMLPurifier does not allow to use some HTML attributes whether we add a custom button or not. It would be helpful to have additional configure option for CKEditor:

• Allow additional attributes like name, class, id and so on. This can be an additional setting field in ACP like Allowed CSS Classes, where Administrator enter HTML attributes he wants to allow. This way we could use plugins that adds HTML anchor or any additional functionality.

I have used it in other CMS and it was very handy.

Example for anchor:

<a name="test" id="test"></a>

This is not allowed right now. If you could define name and id as allowed attributes, then we could use anchors out of the box without allowing to edit HTML.

Thank you!

Edited February 10, 2020 by Sonya*

[13.]

1. This could be achieved with super-simple hook.

   ...
   parent::_htmlPurifierModifyHtmlDefinition($def);
   $def->addAttribute( 'a', 'name', 'Text' );
   ...

2. Keep in mind what name attribute is deprecated and not a part of HTML5, so it would be better to use something like data- attribute and then in JS on client side make an id attributes from it's values after checking that these IDs will not conflict with existing IDs.
   
   

I did it some time ago for my communities, here is a live example.

Edited February 10, 2020 by Mr 13

[Sonya*]

@Mr 13, I know. This was just a suggestion to make it generally available for all admins without hooks. The official link plugin adds both attributes id and name. But both of them are wiped out after saving. I do not really see any security issue with those two attributes. I use link plugin above to format mail and phone links. However anchor is a pain without customization. At the same time anchor is very wide used to add structure to the long pages. E. g. structured articles that Googles like so much at the moment 😏

[13.]

10 minutes ago, Sonya* said:

I do not really see any security issue with those two attributes.

1. name — no problems except it was excluded from HTML5 🙂
2. id — what if user will specify ID which already exists on the page? It could brake some JS-based functionality in cases when JS refers to this id.

Edited February 10, 2020 by Mr 13

[Sonya*]

5 minutes ago, Mr 13 said:

id — what if user will specify ID which already exists on the page? It could brake some JS-based functionality in cases when JS refers to this id.

You're right. In my case I do not allow using the plugin for the normal users, only for the editors of the page. Users are also not able to edit html source. So normally it would not be an issue if set up properly.

At the end of the day I am just looking for a simple possibility to allow my writers to add article structure without using HTML. Writing a hook is a solution for developers only. I am somewhere between admin and developer 😁

[13.]

37 minutes ago, Sonya* said:

Users are also not able to edit html source.

Actually all users always are able to edit HTML (via browser's dev tools, for example), so if id attribute will be allowed in HTMLPurifier, then they could add IDs even while they don't have permission to use HTML mode in CKE. Also IDs will appear in their messages unintentionally when they copying and pasting something with IDs. For example in case when they quoting the messages from your editors, there could appear more than one ID with the same value on the page (it does not carries any significant risks but its something what we should keep in mind allowing IDs in HTMLPurifier).
 

 

Example: spoilers are not available in editor on IPS website, but as they allowed in HTMLPurifier, we able to add them using HTML even when we do not have "HTML Source" mode in the CKE.

Edited February 10, 2020 by Mr 13

[Joy Rex]

6 hours ago, Sonya* said:

We can add official plugins for CKEditor from the repository. And we can create our own plugins. The issue is that HTMLPurifier does not allow to use some HTML attributes whether we add a custom button or not. It would be helpful to have additional configure option for CKEditor:

• Allow additional attributes like name, class, id and so on. This can be an additional setting field in ACP like Allowed CSS Classes, where Administrator enter HTML attributes he wants to allow. This way we could use plugins that adds HTML anchor or any additional functionality.

I have used it in other CMS and it was very handy.

Example for anchor:

<a name="test" id="test"></a>

This is not allowed right now. If you could define name and id as allowed attributes, then we could use anchors out of the box without allowing to edit HTML.

Thank you!

https://ckeditor.com/docs/ckeditor4/latest/guide/dev_acf.html

Specifically this bit:

https://ckeditor.com/docs/ckeditor4/latest/guide/dev_acf.html#automatic-mode-and-allow-additional-tagsproperties

 

[13.]

@Joy Rex, it's about filtering at the IPS level, not CKE.

[Sonya*]

3 hours ago, Mr 13 said:

Also IDs will appear in their messages unintentionally when they copying and pasting something with IDs

And what about JS controllers? Actually we can allow JS controllers, is it not the same? The user can unintentionally paste JS controllers breaking functionality... 🤨

[bfarber]

We already inspect js controllers and strip out any that aren't explicitly allowed.

"id" can't be allowed, as it can lead to issues as already noted. It can break javascript on the page, cause other oddities, or even potentially introduce security issues (what if a user pasted an HTML markup that looked like the login form with the id of the login form element on the page, but which sent the credentials to a remote third party? A user could click to login, which would load the nefarious (but normal looking) login form HTML, and submit their credentials to a remote endpoint. In theory at least...I do believe we strip forms out already, but you get the idea.

I don't really have any qualms about "name" but as noted, it's kind of deprecated so it seems a bit meh to allow.

The reality is, this type of thing is so seldom needed that it is probably best to just leave to a custom plugin. If we start seeing a lot of clients installing custom CKEditor plugins that need this functionality we can revisit.

[Sonya*]

14 hours ago, bfarber said:

The reality is, this type of thing is so seldom needed that it is probably best to just leave to a custom plugin.

Just one question: how do you have created the submenu on this page 

Have you edited HTML or have you used any plugin? 😏

[bfarber]

The menu in our guides was custom coded for our site here.

[Kpp]

On 2/10/2020 at 8:10 PM, bfarber said:

The reality is, this type of thing is so seldom needed that it is probably best to just leave to a custom plugin. If we start seeing a lot of clients installing custom CKEditor plugins that need this functionality we can revisit.

Sorry, but that's highly frustrating! We still have to use an editor from 2012... and it's not even clear when you guys will upgrade to ckeditor 5 even when it's almost on the market since 3 years and totally needed.

So you say these things are seldom needed, so maybe we shoud start a poll with the question "Who is happy with the ckeditor4 and don't want any upgrade?".