How can I create a code block, a nice and neat way to show my code on my website and so people can also copy the code

Question

I would like to make something similar to the blue rectangle code block here: Is there any website that can help to just embed it, or it is 100% custom? Any help would be appreciated.

possible duplicate as: https://stackoverflow.com/questions/4611591/code-vs-pre-vs-samp-for-inline-and-block-code-snippets — Julian Silvestri, Jan 29 '19 at 19:26

score 5 · Answer 1 · answered Jan 30 '19 at 09:37

At a basic level you could use a textarea to show your code:

https://jsfiddle.net/qbgr17dx/

If you want to get automated styling of the code block you can use a JavaScript library such as PrismJS, this will automatically highlight syntax and code within your code blocks on your webpage:

https://prismjs.com/

You would then need to use the <code> and <pre> HTML tags, this allows your HTML to be output and shown to the user rather than the web-browser trying to show it as code/markup.

How can I create a code block, a nice and neat way to show my code on my website and so people can also copy the code

1 Answers1