Display code snippet in blogger

Introduction

In this article, we learn about an easy way to Display or add code snippet/Sample

in Blogger article and highlight different types of language code snippet 

using GitHub code or gist code.

Description

To display code in an article or to highlight code in blogger or in any other
blogging platform you can use Github Gist, I found this way is very easy which 

doesn't depend on any external highlighting javascript library or CSS library.

Step 1 
Here you can create any public gist for code snippet for javascript (.js),
Csharp(.cs), shell script (.sh) etc So it can be loaded in an article.

Once you saved gist file one link or Embed option is displayed on a gist as per
below screenshot.



Step 2 Copy Embed Link or gist link and paste that embed code link in Article's in HTML mode
not in compose mode. I have attached a screenshot for blogger article as below. 



Step 3  Once you have added embed script in blogger article you can see a preview of code

the snippet which rendered as below screenshot.




You can see sample code snippet how it can be rendered as below from gist embed script.

Conclusion

In this article, we have learned about how to highlight or add code snippet in a blog article.

Comments

  1. This is an awesome post. Really very informative and creative contents. This concept is a good way to enhance knowledge. I like it and help me to development very well. Thank you for this brief explanation and very nice information. Well, got good knowledge.
    WordPress website development Chennai

    ReplyDelete

Post a Comment

Popular Posts