Syntax highlighting for code in blogger

Introduction:

There is no straight forward or simple way to do syntax highlighting to share any code through blogger. But we can easily do that by using some third party service. One such service is highligtjs.org. Use the following steps for code highlighting.

Solution:

We have to work in html view rather than compose view of blogger. For syntax highlighting we have to first add JS script for importing CSS in the header of the html. To do that add the following line at the starting in the html view. 


      <head>
 	     <link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.2.0/build/styles/androidstudio.min.css">
 	     <script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.2.0/build/highlight.min.js"></script>
	     <script>hljs.initHighlightingOnLoad();</script>
      </head>

Then start writing inside the body html tag, as following: 


      <body>
        [Your text goes here]
      </body>

and to enter the code you can use code html tag as following:


    <code class='html'>
      [Your code goes here]
    </code>

In the above example we have used "androidstudio" as the style for syntax highlighting. There are several style option available in the highlightjs.org site, and choose what ever style you like, to impliment the style, change the "androidstudio" to the name of your style.


Cheers
A.Paul

Comments

Post a Comment

Please dont forget to tell me if this post helped you or not...

Popular posts from this blog

Changing caption width in latex

In this post I will discuss how to change the width of the figure caption. You can use the same technique to change the width of the other caption (like table caption). Here I am using the caption package. In caption package you can specify the width while loading the package or latter using \captionsetup command. Syntax of the both command are as following \usepackage[<option>]{caption} and command for captionsetup is \captionsetup[<float type>]{<option>} In the <option> we can use width=0.8\textwidth to specify width of the caption. If we specify that in the time of loading (i.e. when using with \usepackage command) it will affect all the float (like figure, table) but if you specify it in command \usepackage then you can specify float type. Then the specific float type will only be effected. This way you can specify two different width for different float. You can also specify other kind of formatting (like italic text) usi...
Read more

Subtitle in latex

Image
There is no direct command to define subtitle in latex. But you can define the \subtitle command using titling package. To do this just insert the following code in the preamble of the latex file. \usepackage{titling} \newcommand{\subtitle}[1]{%   \posttitle{%     \par\end{center}     \begin{center}\large#1\end{center}     \vskip0.5em}% } And then you can define subtitle using the following command. \subtitle{Subtitle Here} This will show the subtitle bellow your title when you use \maketitle command. Minimum working example Code \documentclass[10pt,a4paper]{article} \usepackage{lipsum} \usepackage{titling} \newcommand{\subtitle}[1]{% \posttitle{% \par\end{center} \begin{center}\large#1\end{center} \vskip0.1em}}% \title{This is the title of the document} \subtitle{This is subtitle} \author{Apurba Paul} \date{January 08, 2013} \begin{document} \maketitle Body of the document. \lipsum[1] \end{document} Output ...
Read more

Send in Email in Background in Thunderbird

Image
Mozilla Thunderbird is one of the best email client available for Windows, Linux and Mac. Here I will tell how to send email in background in Thunderbird, so that when you send any mail that irritating "sending email" popup will not come out in front of you. First go to Preferences window: In windows: tools>options In linux: Edit>preferences Now go to Advance tab > General   and click on Config Editor Button, When asked click on I'll be careful, I promise button.  Then search for mailnews.sendinBackground and then select it. Then right click and toggle it to true. Now Thunderbird should send your email in background. You may need to restart the Thunderbird. Cheers A.Paul
Read more