Why I Use Blockquote Instead of Code Highlighting
Besides Google's code-prettify, I've also tried Prism and highlight.js
You can get a result like this. (Of course, there are many color schemes to choose from)
If you want bash to be identified correctly, you have to add a # at the beginning of each line. But that makes it inconvenient to copy and paste directly into the command line to run.
If I use code highlighting, it changes to standardized colors.
Prism
Usage
Add the following in the Blogspot template
Result
Prism doesn't have automatic code detection. When writing a blog, you need to switch to HTML mode and manually write the pre code and specify the code type
You can get a result like this. (Of course, there are many color schemes to choose from)
highlight.js
Usage
Result
highlight.js can automatically detect the code type, but it's not very accurate — bash gets identified as Ruby
If you want bash to be identified correctly, you have to add a # at the beginning of each line. But that makes it inconvenient to copy and paste directly into the command line to run.
Detection of JS code works fine.
There's also one biggest issue: after I replace blockquote with pre code, highlight.js always displays them on a single line.
The problem with displaying command line operation logs
Besides the two points above, I have one more specific issue.
My tutorials provide command line operation logs so readers can compare whether their own operations are correct. For example,
But due to the nature of pre code, the spaces and some special characters inside it are handled differently from other HTML elements.If I convert blockquote to pre code, the result looks like this,
Code highlighting overrides the font colors I specifically set
There's another scenario where code highlighting isn't suitable.When quoting code, I set specific font colors for certain parts based on the tutorial content. For example,
If I use code highlighting, it changes to standardized colors.
In summary, I'll continue using blockquote
========
End