ProLavish | Blogger GuruProLavish

A blog provide Blogging Ethics

How To Add Syntax Highlighter to Blogger

>
How To Add Syntax Highlighter to Blogger.We generally are aware of the work syntax highlighter.But how to use it in blogger to increase visitor your blog.Syntax Highlighter is mostly used to highlight the code. They are written in HTML, PHP, CSS, and JavaScript etc.

In our previous we had shared how  to add Meta Tags to blogger for better Seo.In our next post we will discuss How To Add Syntax Highlighter to Blogger.We generally are aware of the work syntax highlighter.But how to use it in blogger to increase visitor your blog.

Uses of Syntax Highlighter

Syntax Highlighter is mostly used to highlight the code. They  are written in HTML, PHP, CSS, and JavaScript etc.

 Main purpose of this syntax highlighter -


1) To display the syntax with different colors

2)Increase  the code readability

3) Help in easily  understand the code.

How to add  Syntax Highlighter to blogger



Step: 1 Go to Blogger Dashboard  .

Step 2  Then Click on  Design  and then  ahead to EditHTML

Step 3.  Click on "expand widget templates"

Step: 4   Find the code </head> using( ctrl+F.)

Step: 4  Paste the below code just before </head>



<link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css"></link>
<link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"></link>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js" type="text/javascript"></script>
<script language="javascript">
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>


      
Step 5. Click On save template

How To use Syntax Highlighter


  Whenever  you write a New Post use <pre> tag to Highlight the code.


For Example

 To  highlight HTML code

  

   
                 <pre class="brush:html">
                 Your 'HTML' code goes here
                  </pre>


      

To  highlight Css code



                 <pre class="brush:css">
                 Your 'css' code goes here
                  </pre>


     

Have Questions?

If you need help with respect to any concept do post your comment below..We are happy to help you  

Gaurav dudeja

Gaurav Dudeja has 3 years of blogger experience.He wasthe only owner of prolavish .He does internet blogging and sharingblogging ethics,widgets,quality tips based on blogging.Having More than 50 followersand 250 people subscribed his blog Join me . Prolavish receives 1 thousand Pageviews/month and has over 32K subscribers

You can find us on

Read Comment Policy ▼
  We have Zero Tolerance to Spam. Chessy Comments & Links' will be deleted immediately

Comments are moderated and may take some time to appear.
If you ask a question make sure you tick the Notify Me option

No comments:     Post Yours!