December 3, 2021

Blogger: Insert Code with Syntax Highlighting

I share here a couple of ways how to embed code in Blogger.

Gist

Create a Public Gist and Embed (Paste code in HTML mode) 

Embed Single File

This is an advanced tip! If you have multiple files in your Gist but want to embed one file out of it, you can filter the file by appending to the gist URL the argument ?file=filename. (source)

Example this gist contains one file Done.bas and another one.
The embed code for embedding this single file is :

<script src="https://gist.github.com/tdalon/166c0542ef6d205dd1f8d271f83cfe58.js?file=Done.bas"></script>

See blog post example using this here.

Copy/Paste from Editor e.g. VS Code

I like to use VS Code as my code Editor.
From there you can simply copy/paste your code into a Blog post (Compose view) and it will take over the syntax highlighting.

Hilite.me

hilite.me converts your code snippets into pretty-printed HTML format, easily embeddable into blog posts, emails and websites.

Alternatives

PasteBin

http://pastebin.com/
Alternative solution to Gist if you don't use GitHub else.

MATLAB publish

(MATLAB only)

(Maybe the MATLAB Editor support now rich text copying.)

See also

http://webapps.stackexchange.com/questions/22186/how-to-highlight-code-in-blogger/

No comments:

Post a Comment