How to add code snippet to your blogger/ blogspot websites


Hi friends,

So if you are owner of a blog and have interest in programming,then this post is for you. I was facing issues on this blog while adding code to my post as those are looking like just a simple text and not at all eye catching like below:


So I was searching for a solution so that my code snippet look pretty like we see it on our IDE or editor like visual studio code.

So the solution I found is below:


  • Take the below scripts

<link href='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/atom-one-dark-reasonable.min.css' rel='stylesheet'/>

<script src='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js'/>
<script src='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/languages/r.min.js'/>

<script>hljs.initHighlightingOnLoad();</script>


  • Open your blog settings and go to themes and their click on EDIT HTML and put the scripts above the </head> tag as shown below:

  • Now where you have to add code snippet in your blog just add the code snippet in the following format
    • <pre><code> [ Your code snippet ] </code></pre> 

  • You can also take reference from the below image that how to format your code

  • After adding this the result will be like below image:


These images are taken from my post: Java Tutorial : For-Each Loop

so friends please try in your blog and let me know if it works and you can post your experience in comments.

No comments

Powered by Blogger.