Show HTML and Other Codes With Code Language Name

Show HTML and Other Codes in blogger, Now this is new and updated widget with tutorials of blogger where you can show your codes in blogger with coding language name like jQuery, HTML, CSS, JavaScript etc, this tutorial is very simple and very highly customize with CSS Codes. It's a very Pro widget be'coz it include the orange bar where you can mention the code name with your site name. This widget is highly customize with many kinds of sensitive codes and made by the CSS only no javascript  is used in it, so you can easily install it and it works very awesome.

Live Demo

Installation of Widget

• Login to Blogger > Dashborad
• Click on Drop Down Menu and select Template
• Backup your Template before making any changes to your blog
• Now Click on Edit HTML > Proceed > Expand Widget Templates
• Press Ctrl + F and search the code shown below.

]]></b:skin>

• Paste  below before ]]></b:skin> 

 

/*------Codes By www.widgetgenerators.blogspot.com------*/
pre{
position:relative;
background:#333;
color:white;
font-family:Monaco, Courier, MonoSpace;line-height:1.8;-moz-border-radius:8px;-webkit-border-radius:8px;border-radius:8px;font-size:12px;padding:10px;margin:0 0 25px 0;overflow:auto}pre code{padding:0;color:white;background:#333;white-space:pre
}
pre[rel]{padding-top:40px}pre[rel]:after{content:attr(rel);position:absolute;top:0;background:#F3A01E;padding:4px;left:0;right:0;font-size:36px;line-height:0;color:white;font:bold 20px "myriad-pro-1",Verdana;
/*------Codes By www.widgetgenerators.blogspot.com------*/ 

• Now Save Your Template.

How to Add it in post?

• After adding the CSS part 
• Go to Posting > Edit HTML
• Paste below code where you want to show the HTML CSS and others codes.

<pre class="lang-js" rel="HTML Codes By www.widgetgenerators.blogspot.com"><code><p>Write Your Codes Here
</code></pre>

Make Changes....!

• Replace it HTML Codes By www.widgetgenerators.blogspot.com with coding language and with your site URL.
• Replace Write Your Codes Here it with your codes.
   

If Any Problem Comes, Ask in Comments