TYPO3 RTE links: Custom attributes or arbitrary CSS classes

78 views Asked by At

The TYPO3 link browers in the backend allow to set some link attributes like "title", "target", "rel", "class", etc..

I use Plausible Web Analytics which allows to count link clicks (anonymously, of course). To identify the link you can specify CSS classes with a special prefix:

<a href="..." class="existing-class plausible-event-name=foo">

The TYPO3 editors should be able to specify those event names on their own. Note that counting the requests of the target URL is not the same. Editors want to know if their links are useful at given places.

This works great in Wordpress, for example. Unfortunately the RTE link browsers' CSS class option isn't a free textfield (as in the normal link browsers outside RTE), but a dropdown/select field with a limited set of classes that can only be pre-defined in the RTE yaml config.

CSS-Class selector in RTE: CSS-Class selector in RTE

VS CSS-Class selector outside RTE: CSS-Class selector outside RTE

In the TYPO3 RTE BrowseLinksController you can see that the class selector HTML code with the css text field of its parent AbstractLinkBrowserController is replaced by an HTML select field.

I hoped that I could set buttons.link.properties.class.allowedClasses = * in the RTE config. Contrary to allowedClasses of other elements it seems to be unsupported for links. Also The controller doesn't support *.

On the other hand, the link handler/browser API seems to have no way to add other link attributes like HTML5 data-attributes. All classes are marked as @internal and they have no hooks or events to extend anything, except to define a custom link browser.

My ideas are:

  1. Add a custom link browser that has such an attribute
    • I'd prefer to have that option in all link browsers (page selector, external url, etc)
  2. Replace all link browsers by extending them and adding an attribute
    • They are marked as @internal so there could be compatibility problems with future TYPO3 updates
  3. Replace RTE link browser controller
    • Same problem as with 2, it's @internal
  4. Use URL parameters or title field to let editor specifify a URL hash or URL query parameters with a pre-defined naming convention like #plausible-event=foo that will be handled with javascript
    • Could Conflict with other URL hashes (e.g. page section links) / title / URL query parameters
    • Seems like a hack to me

But I thought, I'm asking here before implementing any of these ugly workarounds. Because I'd be surprised if additional link attributes (like data-*) wouln't be a commong requirement. And I'm also surprised if TYPO3 hadn't any way to extend something like that because my experience with TYPO3 always has been that there was a solution for any extension requirement.

0

There are 0 answers