You need to be logged in to post in the forum - Log In

An active JCE Pro Subscription is required to post in the forum - Buy a Subscription

Support is currently Offline

Official support hours
Monday to Friday
09:00 - 17:00 Europe/London (BST)

Please create a new Ticket and we will get back to you as soon as we can.

#102023 Adding code-markup to jce editor

Posted in ‘Editor’
This is a public ticket

Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.

Latest post by Ryan on Tuesday, 10 December 2019 20:20 GMT

wicko
How can you add a code option to your editor to allow you to add blocks of code that are visible to the reader? Like you have here in this forum editor. So I can display the code like this

<img src=“/images/myimage.jpg”/>
regards David

wicko
ok I have managed to do this with RokCandy. Not as easy as I would have liked. After installing RokCandy you get the option to add RokCandy script via a button at the bottom of your browser. You need to use html entity names for brackets. So to display code to look like this

<img src=“/images/myimage.jpg”/>
you need to edit between the rokcandy square brakets and change the greater or less than brackets to their entity equivelant.

Ryan
Please try this JCE plugin - https://github.com/widgetfactory/jce-editor-codesample - which you can download here - https://github.com/widgetfactory/jce-editor-codesample/releases/tag/1.0.3

This will allow you to insert various types of code into the editor, which will be highlighted and styled using the Prism library - https://prismjs.com/

https://cdn.joomlacontenteditor.net/tmp/102023-adding-code-markup-to-jce-editor.gif

You will probably need to install this library so your code can be styled in the front-end. A plugin is available for this too - https://github.com/widgetfactory/wf-prism

Ryan Demmer

Lead Developer / CEO / CTO

Just because you're not paranoid doesn't mean everybody isn't out to get you.