Prism.js - Style your blog's code!

One of the first things I needed to tackle when setting up this blog was syntax highlighting. I knew I would be posting code samples and I needed them to be easy to read and consume.

After a little looking around, I was able to find a very simple to use JavaScript/CSS implementation that will do syntax highlighting for me on the blog. Thanks Prism!

Here is an example!
var s = 'this is a string';
var obj = {
  name: 'Adam',
  age: 99,
  birthdate: new Date('1/1/1915')
};


This was really easy to implement. It took 4 steps.

  1. Customize and download prism.js and prism.css from their website. (This is insanely easy to do.) 
  2. Upload the javascript and css files to the website. 
  3. Include the javascript and css files on the website. 
  4. Wrap the code I want highlighted in tags. 

If you are not interested in customizing your own or don't want to host your own files, you can use a CDN. This site uses the following links for the prism JS and CSS. 
<link href='//cdnjs.cloudflare.com/ajax/libs/prism/1.6.0/themes/prism-okaidia.css' rel='stylesheet' type='text/css'/>
<script src='//cdnjs.cloudflare.com/ajax/libs/prism/1.6.0/prism.js' type='text/javascript'/>

That's it! Prism did the rest for me. Now whenever I want syntax highlighting, it is one simple step to do.

Comments

Anonymous said…
As talked about above, take clean steps harmonizing together with 점보카지노 your financial standing and opportunities. Make betting a small a part of} your leisure program, and do not let it turn into too necessary to you. Let it's a method to have occasional fun, but at all times prioritize your daily duties.
December 2, 2022 at 1:42 PM
Post a Comment