How to highlight code syntax in blogger 2017

Live as if you were to die tomorrow. Learn as if you were to live forever. - Mahatma Gandhi

Never stop your learning. I learnt something new in coding, want to share with you. Here we go.



Syntax Highlighter is a fully functional self-contained code syntax highlighter developed in JavaScript. This helps to display the organized numbered style. Most of the bloggers use HTML / CSS / JavaScript codes, here i used the CSS. In Blogger there is no special syntax so we can do Syntax highlighter by inserting few lines of codes in our template. Just follow the below steps and enjoy!!

Step 1 - Edit HTML
Navigate to Blogger > Theme > Edit HTML as shown in the below screenshot.



Step 2 - Copy the below provided code.




















Step 3 - Paste the provided code in the Edit HTML above  </head> tag. Click on Save Theme.


Step 4 - Open the post editor and open HTML mode. In HTML section, enclose your code with the below tags.

<pre class="brush:css">
your code here
</pre>


Step 5 - Save and preview the post. Just see the below screenshot for your reference.


0 comments:

Post a Comment