A few of our blog posts - especially the ones regarding guides to using OpenSearch - display code segments. These are currently being rendered as just markdown code. They look like plain text and they do not have a button that allows users to copy the entire code segment to the clipboard. Honestly this is not much of an issue - most of the code segments are not large, but a few of the YAML configuration files are large enough that you need to scroll. I think this is slightly disruptive. A copy button is expected behavior.
I think they are specifically called "fenced blocks" and are represented in markdown with the triple-tick (```)
Syntax highlighting is also an easy feature to implement. Read more here: github doc for fenced blocks
Current State
Example of future state
Solution
A clear and concise description of what you want to happen.
A copy button on each code block
Syntax highlighting on each code block
The blog template updated to present both of these as suggestions, and give examples for how to use them.
Also, we need to update the blog-guide so that people know that Liquid (what renders the markdown files to the site) will try and dynamically display whatever we put into these Code-blocks. For instance, in the latest blog post (dataprepper 2.8.0), if we were using Kafka-secrets within our site, this blog post would have directly displayed our secret-key information and leaked them to everyone visiting our site. We were not using Kafka-Secrets, and so Liquid threw an error and displayed the wildcard ("$"). This is low risk for the OpenSearch keys because those are being handled by Lambda's in our code pipeline, but it is a security vulnerability that we should be aware of. Solution - we need to rawtext (Liquid syntax jargon to ignore variables) tags around the code blocks. This looks wierd if you display it in markdown, but they disappear when they get rendered by Jekyll-liquid.
Alternatives
We are currently using the markdown syntax and formatting. So I believe we are locked into this, there are a couple of ways that we might be able to do this. I do not know enough to be able to present a comprehensive list of alternatives.
Likley the solution here is to update each markdown file in _posts to be representative of the code-language within the code block.
I do not know of a dynamic solution that could auto-update all of them.
dblock
commented
2 weeks ago
Problem
A few of our blog posts - especially the ones regarding guides to using OpenSearch - display code segments. These are currently being rendered as just markdown code. They look like plain text and they do not have a button that allows users to copy the entire code segment to the clipboard. Honestly this is not much of an issue - most of the code segments are not large, but a few of the YAML configuration files are large enough that you need to scroll. I think this is slightly disruptive. A copy button is expected behavior.
I think they are specifically called "fenced blocks" and are represented in markdown with the triple-tick (```) Syntax highlighting is also an easy feature to implement. Read more here: github doc for fenced blocks
Current State
Example of future state
Solution
A clear and concise description of what you want to happen.
Alternatives
We are currently using the markdown syntax and formatting. So I believe we are locked into this, there are a couple of ways that we might be able to do this. I do not know enough to be able to present a comprehensive list of alternatives. Likley the solution here is to update each markdown file in _posts to be representative of the code-language within the code block. I do not know of a dynamic solution that could auto-update all of them.