All rights are reserved by Niteesh Kumar.. Theme images by Storman. Powered by Blogger.

Followers

Total Pageviews

Blog Archive

Follow by Email

Translate

Sunday, 22 January 2017

how to highlight code syntax in blogger, best syntax highlighter for blogger

As we can see that there is no special syntax in blogger by which we can highlight the syntax of a code.It is quite easy to do so.we can do this by just inserting few lines of codes in our template html code.You can go through this step by step guide-


1-Open your blogger dashboard and go to template section


 
Here you will see two options customize and Edit HTML.

 Click on the Edit HTML.


2-Copy the script given below-


 <link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<!-- END INCLUDE SyntaxHighlighter Components -->

<!-- INCLUDE YOUR BRUSHES WHICH YOU WANT TO USE HERE -->
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>

<!-- END INCLUDE BRUSHES -->
<!-- INIT SyntaxHighlighter -->
<script type='text/javascript'>
   SyntaxHighlighter.config.bloggerMode = true;
   SyntaxHighlighter.all();
</script>

3-Paste the code in the HTML of your template just above </head> tag

   
   Click on save template-





4-After saving template open your post editor and open HTML-

  
   After opening the HTML section of your code enclose your code with the given tags-
<pre class="brush:language name(html) in this case"><----your code's HTML----></pre>
  

5-Save the code and publish the post and you will see that- 

open your post in your blog and see the changes-

22 on: "how to highlight code syntax in blogger, best syntax highlighter for blogger"
  1. This comment has been removed by the author.

    ReplyDelete
  2. Hi, i am using this way, but if my websites turn on https, it doesn't work. it only work on http. can you help me please?

    ReplyDelete
    Replies
    1. Change all links on http:// to https:// in your theme

      Delete
  3. Thank you @KC B for the comment.
    https is a secure gateway and google does not allow third party scripts in secure gateway.So it is not working.
    Go to setting in dashboard and make https redirects no in basic settings.
    and your site will always open on http and this will work.

    ReplyDelete
  4. I think this is an informative post and it is very useful and knowledgeable. therefore, I would like to thank you for the efforts you have made in writing this article. website development agency

    ReplyDelete
  5. Thankyou for this blog its really interesting and informative, but there is some errors
    Which need to be recorrect by owner. See i also have some good blogs related to
    Technical services, you can check on my website.

    Avast Login
    garmin.com/express
    avg.com/retail
    bullguard support number

    ReplyDelete
  6. I would like to thank you because your site’s blog is very informative and very knowledgeable. I shared your site with my friends because they can take information from your site. I found some sites relate your site Check link Below...
    Thank you..

    Avast Login
    garmin.com/express
    avg.com/retail
    bullguard login
    mcafee.com/activate

    ReplyDelete
  7. This is working only for http blogger and not working for https blogger. Is there any additional setup required for https bloggers?

    ReplyDelete
  8. The TomTom is the most feature-packed, best connected, and smartest navigation device on the market, packing a number of features which help it compete with your smartphone.
    tomtom.com/getstarted | tomtom get started | www.tomtom.com/getstarted | tomtom update

    ReplyDelete
  9. It is not working for me . I want to use java brush and included the same in my themes. But it is not working

    ReplyDelete


  10. AVG antivirus is a prominent virus protection program among the world of software . As many hackers and data stealers are waiting for the user’s mistake, they can misuse of user’s identity and other data.
    www.avg.com/retail |
    avg.com/retail

    ReplyDelete
  11. You are very cool! I dont suppose I have read something similar to this before. So nice to search out somebody with authentic applying for grants this subject. Totally a helpful project for bringing new things for the Sourcecode.

    ReplyDelete
  12. I check your blog and it is really information for us Otherwise if anyone want to Learn C & C++ so You Can Contact US-+91-9311002620 Or Visit Our Website- https://www.htsindia.com/Courses/modular-courses/c-plus-plus-training-course

    ReplyDelete
  13. Great Article! I got too much information from this post. Thanks for sharing such a helpful article.If any one who want to learn C&C++ get a free demo call on 9311002620 or visit our further website :-https://htsindia.com/Courses/embedded-systems-and-robotics/cplusplustraininginstituteinsouthdelhi

    ReplyDelete
  14. I was looking for a post that provides important information and this post meets my expectations. This post is written after a good research and every piece of information seems reliableHow to check the storage on the Gmail app?

    ReplyDelete
  15. Really great post that you sharing very informative and very helpful content you put into your blog apart from that if anyone looking for training institute for C++ training checkout then. Contact Here-+91-9311002620 Or Visit Website-https://htsindia.com/Courses/embedded-systems-and-robotics/cplusplustraininginstituteinsouthdelhi

    ReplyDelete
  16. Anyone looking for Experience Certificate Providers in Delhi, India with Complete Documents So Dreamsoft Consultancy is the Best Place.Further Details Here- 9599119376 or Visit Website- https://experiencecertificates.com/experience-certificate-provider-in-delhi.html

    ReplyDelete
  17. Anyone looking for Best Consulting Firm for Fake Experience Certificate Providers in hyderabad, India with Complete Documents So Dreamsoft Consultancy is the Best Place.Further Details Here- 9599119376 or VisitWebsite-https://experiencecertificates.com/experience-certificate-provider-in-Hyderabad.html

    ReplyDelete
  18. Thanks for posting these kinds of post its very helpful and very good content a really appreciable post apart from that if anyone looking for Python training institute in delhi so contact here +91-9311002620 visit https://www.htsindia.com/Courses/python/python-training-institute-in-delhi

    ReplyDelete
  19. Great Article on Blog design Css And Html Tutorials and Premium Blogger Themes Free Download

    Blog Name :- TheForyou
    Blog Url :- https://www.theforyou.xyz/

    ReplyDelete