Step 1 - Find a good CSS library for code formatting
The best HTML syntax highlighter library I found was PrismJs. It's free, incredibly thorough the languages it supports, and it provides a professional look. You simply choose the language support you like and download the CSS and Javascript files.
Here is a before look:
let items = [1; 3; 4]
items |> List.map(fun x -> x + 1)
Here is the code after formatting with PrismJs:let items = [1; 3; 4]
items |> List.map(fun x -> x + 1)
Step 2 - Move from Wordpress to Google Blogger
I originally had the blog on Wordpress using a free template but I decided to move it to Google Blogger. The reason for moving was Google Blogger provided free template editing. Wordpress has other advantages but for my purpose I simply needed to tweak the template to include the Prism CSS and Javascript files. Since I only had a few posts this was not a difficult move.
Step 3 - Host PrismJs CSS and Javascript files in DropBox
I used the instructions in this article to host the files in DropBox so they can be referenced publicly.
Step 4 - Update template HTML to include CSS and Javascript files
In Google Blogger I went to Template -> Edit HTML and added this piece in the header.
<link href='https://dl.dropboxusercontent.com/s/wvc7y6gckrru3ex/prism.css' rel='stylesheet'/>
<script src='https://dl.dropboxusercontent.com/s/sy0k7bc7ixl6xan/prism.js' type='text/javascript'/>
It was that easy! Now my blogging code looks much nicer.
Their open communication, organized project management, and rapid scaling contributed to a productive partnership.
ReplyDeletebest web design firms
They provide useful suggestions and high quality solutions.
ReplyDeletelogo development