0
votes

I want to create a JavaScript href link in TYPO3 10.4, to open a privacy setting modal on an HTML-Page. The Link always gets deleted after saving. I found the solution to use rtekeep="1" to keep the JavaScript link. Unfortunately the rtekeep attribute always gets deleted after saving. In older TYPO3 versions this trick worked fine.

This is what my code looks like:

<a href="javascript:xyz">Linktext</a>

1
What? Where? Why? When? ;> Welcome to StackOverflow. Please read about how to ask a question and also how to create a minimal, reproducible example. Keep in mind that TYPO3 uses tens of thousands of config parameters which can be found in many contexts like TypoScript, TSConfig, TCE, DB, extensions, etc, etc. If you expect some serious answers at least show us what did you try and where exactly you did it so we do not need to re-engineer your path.biesior
Please update your question using Edit link to add more details.biesior
Also, keep in mind that TYPO3 ver.10+ doesn't use RTE in the form we knew in previous versions, although cannot find any depreciation info at the moment It's quite possible that these configs won't work in TS anymore.biesior

1 Answers

0
votes

There are of course multiple ways to approach this. For example there are ways to whitelist your HTML via CKEditor and/or RTE_parsefunc configuration. Without trying to be opiniated about inline JS, I am going to suggest a minimal-configuration way.

  1. Add a custom "style"

    Since it is easy to add new elements to CKEditor with custom classes (although data-... would be semantically better, but I am not aware of a simple way to add it to CKEditor), I am using that:

    Add something like this to your CKEditor yaml (see https://usetypo3.com/ckeditor.html for help on that):

    editor:
      config:
        stylesSet:
         - { name: 'Open consent modal', element: 'button', attributes: { class: 'btn btn-default open-consent' } }
    
  2. Attach click handlers

    Add this JavaScript (as usual at the end of <body>):

    document.querySelectorAll('.open-consent').forEach(
      elem => {
        elem.addEventListener(
          'click',
          ev => {
            ev.preventDefault() // don't navigate for <a> or <button>
            yourShowModalFunction()
          }
        )
      }
    )