Extending fenced code blocks for portion-highlighting

Hello,

I’m looking to extend (break) my grav’s fenced code blocks so I can add a tag or syntax to highlight select portions inside the block. It seems there is nothing available that already does this or similar.

I’m planning on enclosing subsections of a code block in some special tag that will render to HTML <mark>

I understand Grav uses parsedown. Before I get started hacking this myself, I thought I’d ask the community as to where these modifications might best take place, or key files I should be aware of. That sort of thing to best get me started.

Thanks so much!
-bazz

1 Like

@bazz,

It seems there is nothing available that already does this or similar.

Which options have you already explored and why are they not satisfactory to you?

Also your question is puzzling to me. Hacking the Parsdown external library itself? A library that will be overridden with the next upgrade of Grav?

Is this what you are trying to achieve?

If that’s not what you’re after, what is?

Which options have you already explored and why are they not satisfactory to you?

While I couldn’t find anything ready-made to achieve this, I explored using <pre><code> tags to manually create code blocks in the markdown file, which allowed embedding <mark> tags inside the code block. While this worked, it also made it necessary to modify all other <> characters in the code block to their HTML entity codes, which is undesirable as it causes the source markdown to lose its readability.

Screenshot from 2024-05-25 13-45-04

<pre><code class="hljs text">(gdb) disas execve
Dump of assembler code for function execve:
<mark>   0xef71d424 &lt;+0&gt;:     mov  0x3b, %g1  ! 0x3b execve trap code
   0xef71d428 &lt;+4&gt;:     ta  8           ! syscall trap</mark>
   0xef71d42c &lt;+8&gt;:     bcc  0xef71d454 &lt;_exit&gt;
   0xef71d430 &lt;+12&gt;:    mov  %o7, %g1
   0xef71d434 &lt;+16&gt;:    call  0xef71d43c &lt;execve+24&gt;
   0xef71d438 &lt;+20&gt;:    sethi  %hi(0x1e800), %o5
   0xef71d43c &lt;+24&gt;:    or  %o5, 0x3cc, %o5     ! 0x1ebcc
   0xef71d440 &lt;+28&gt;:    add  %o5, %o7, %o5
   0xef71d444 &lt;+32&gt;:    mov  %g1, %o7
   0xef71d448 &lt;+36&gt;:    ld  [ %o5 + 0xeec ], %o5
   0xef71d44c &lt;+40&gt;:    jmp  %o5
   0xef71d450 &lt;+44&gt;:    nop
End of assembler dump.
<mark>(gdb) x/2wx execve
0xef71d424 <execve>:    0x8210203b      0x91d02008</mark>
</code></pre>

Hacking the Parsdown external library itself? A library that will be overridden with the next upgrade of Grav?

I would only consider this if there was no better alternative.

Is this what you are trying to achieve?

yes

@bazz, You got to move up from nitty gritty details to concepts… Concepts of Grav that is…

Use plugin shortcode-core and its [mark][/mark] shortcode and create the following fenced code block in your page:

```
(gdb) disas execve
Dump of assembler code for function execve:
[mark]   0xef71d424 <+0>:     mov  0x3b, %g1  ! 0x3b execve trap code
   0xef71d428 <+4>:     ta  8           ! syscall trap[/mark]
   0xef71d42c <+8>:     bcc  0xef71d454 <_exit>
   0xef71d430 <+12>:    mov  %o7, %g1
   0xef71d434 <+16>:    call  0xef71d43c <execve+24>
   0xef71d438 <+20>:    sethi  %hi(0x1e800), %o5
   0xef71d43c <+24>:    or  %o5, 0x3cc, %o5     ! 0x1ebcc
   0xef71d440 <+28>:    add  %o5, %o7, %o5
   0xef71d444 <+32>:    mov  %g1, %o7
   0xef71d448 <+36>:    ld  [ %o5 + 0xeec ], %o5
   0xef71d44c <+40>:    jmp  %o5
   0xef71d450 <+44>:    nop
End of assembler dump.
[mark](gdb) x/2wx execve
0xef71d424 :    0x8210203b      0x91d02008[/mark]
```

That wil give the following result:

2 Likes

This is the solution, thank you so much!

However, my tests with fenced code blocks and [mark] do contradict yours: <> characters in the fenced code block will not be converted to &lt; or &gt; as shown in your image. I believe this is because you used my snippet with the <pre><code> that had &lt; and &gt;, but those didn’t show in your code snippet before the image. If not that, then it could be a settings difference.

Despite this discrepancy, I am pleased with the results I am getting. Thanks again!

@bazz, Ah, yes I took a copy of your example which contained the <mark> elements and the converted < and >. :person_facepalming: