How to use highlightjs?

Need help Plugins
1

@fok_ste I saw you were able to put this in place. Would you mind sharing how you did it?

2

@vini_brito I saw you also implement highlightjs in your plugin course. Would you mind sharing how you do it?

3

@rico.trevisan

Hah, yes! Nice catch :yum:

Impossible to be easier!

Straight from the plugin (currently private, maybe one day I will publish it):

This action looks for all “code” elements in the page and applies the formatting for it.
All you have to do is to, somehow else, tag the code block as a code.

The way I do it is through a private rich text editor plugin in my app, but I think that any rich text editor that allows the user to select a block of text and click the “Code” button, just like the “Bold” button, will output the code block.

And now the element workflow action to be run every time you want to highlight code in the page. So it is not a run once and forget, but run every time code blocks show up in the page. Example when new message is posted (if the message can contain code), when page is loaded (if code may be exposed upon page load), when an article is revealed, etc.

If you want it to be more automatic, then make it run every few seconds, but add a conditional for it to not repeat the process in a code block more than once, something like “if the class is already there, do nothing”.
Bad things happens with uncontrolled code :yum:

function(instance, properties, context) {

        document.querySelectorAll('code').forEach((block) => {

            block.classList.add("javascript");
            hljs.highlightBlock(block);
            
          });

    }

And in the header of the element:

<link rel="stylesheet"
      href="//cdn.jsdelivr.net/npm/highlight.js@10.3.2/styles/atom-one-dark.css">
<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.2.1/build/highlight.min.js"></script>
3 Likes
4

Thanks!
Got it working! Here’s a little guide: Doc Engine -

2 Likes
5

Great!
And nice project, I also had that kind of “pain” when first creating an engine for my courseware :yum:

6

Thanks! I would love to help you transition your educational content to the Doc Engine format. I’m procrastinating - err… putting together a tutorial.

1 Like