I have a designed a custom template in Joomla 3.9.25. I have also written JavaScript to toggle content from displayed to hidden by clicking a button, similar to Bootstrap's 'collapse' function. The JavaScript is in the template's template.js file and the CSS is in the templates's template.css file. On the front end, this works correctly and using the browser inspector I can see 'event' indicated at the end of the toggle button. See pic below:
In JCE Editor in the admin panel, however, the JavaScript does not work. Just to confirm that: in JCE's global configuration:
- In Editor Profile > Editor Parameters > AdvancedJavaScript is allowed in JCE (but in this case there's no inline JS)
- In JCE's global configuration JavaScript and CSS are not compressed, and
- Editor Styles are set to 'template.css'
Inspecting the code here it looks like this, i.e. no 'event' tag:
The problem is, of course, that the content doesn't toggle so I can't edit it in the WYSIWYG mode. I could do it in the 'code' tab but I'd rather not. So, I have to make the choice of either seeing the content of the article with all the styles as they would be on the front end (or that which is not hidden) or seeing all content and no styling. Not ideal.
I have tried adding the relevant JavaScript to both the Isis and Hathor templates in case that would do the trick, but it makes no difference.
Thanks in advance.