Showing posts sorted by date for query adding-elegant-rss-email-subscription. Sort by relevance Show all posts
Showing posts sorted by date for query adding-elegant-rss-email-subscription. Sort by relevance Show all posts

Friday, May 8, 2020

Adding A Elegant Rss Electronic Mail Subscription Widget Box To Blogger


Rss Feed play's important role inwards increaseing the website/blogs traffic.Most of the weblog owner's exercise it equally a machine which generates traffic for them.Creating a Rss Feed Subscription box is smart move.If your website/blog Content is of good quality then Rss Feed Subscription Box volition non permit you lot down.Usually reader's as well as user's subscribe to your weblog via e-mail to larn your blog's latest updates straightly into in that location inbox.Setting Up H5N1 Rss Feed Email Subscription Widget is non really hard it is really simple,you don't demand whatever form of training.You practise your ain Rss Feed inwards unproblematic steps but earlier that you lot should bring a Rss Feed for your blog,if you lot don't bring Rss Feed For your Blog Go Here to Learn How You Can Burn Your Blog Feed In Feedburner.Now permit us starting fourth dimension working

Go to Blogger.com >>Your Blog >> Template >> Download BackUp of template>>then Expand Widget Templates>>Search for </head> as well as only inwards a higher house it paste the next code                                                                                                  
<style type='text/css'>
.sub-box{
width: 600px;
background: #fff;
padding: 2px 5px 7px 7px;
border: 2px company #000;
border-radius: 15px;
}
.sub-box:hover{
border-style:dashed; 2px solid: #389af2;
}
.followlinks h1{
font-family:Cabin Condensed;
font-weight: bold;
color: #000;
padding: 0px 0px 2px 40px;;
font-size:17px;
}
.followlinks ul{
font-family:Cabin Condensed;
font-weight: bold;
}
.followlinks ul li{
float:left;
width:90px;
padding-left:40px;
margin:0 0 0 5px !important;
line-height:35px !important;
}
.followlinks ul li a{
font-size:20px !important;
text-decoration:none;
font-weight:normal;
}
.followlinks ul li.otrss{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiegvyuMNDyUcBMhicPpsqHuj_zTrlJG3V4jzqqQp9EHgxLOK4QKI2OG7W9LUmOQPAvrzp4mGjdnB7tmW3WYpa9ZKifINmi7GE81ey2GLvLMO17P8CTcWAQ3_1DXGUkXa_BAaiX3f1uTZ6t/s1600/rss-ot.png) no-repeat scroll left oculus transparent;
}
.followlinks ul li.otgoogleplus{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW8ldaGHIvbIEisBdIH993wqyI00nS_enWZ9x_DqWGeYnOIoB21jDPrBjR5ZiPys6-T5aDvIhNXtrz6yEv_g0pmi7kE-seiM90WLKoepx6ltowBjwkP1T8FfpE1gONQhB9GN0ntppeXm-5/s1600/googleplus-ot.png) no-repeat scroll left oculus transparent;
}
.followlinks ul li.ottwitter{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4EC6KExZKvZHGyVhsnycZKNuilit8-7xBB_QhSZeSBVAFAxDZZi4MtibZr5drXEMQbX78KoK5B_f11F3drclDFg3xnycs5NHsZXBeXjAchaNCAVS31dZFHYbWsX5QcPT8Z526bRogfKCR/s1600/twitter-ot.png) no-repeat scroll left oculus transparent;
}
.followlinks ul li.otfacebook{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF5Q9eGBcrWwSh-DZGQwRwe2-CHxW5-R0MotWVtqY7qSCiO5eOcBk-T7ERndb03yoACM4E4_GyGjTtSyBx6ffDKzQs79QTK2Mieat3K_7U-GqQaZvdnvwcyQmSaS3bmCppkAw_d9G3rRS7/s1600/facebook-ot.png) no-repeat scroll left oculus transparent;
}
form.emailform{
margin:5px 0 0;
display:block;
clear:both;
}
.emailtext{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipi1AexW1aCvrRubT4mo__LcRvVHiMkyVxUQLw_AhJvilLwS67jo7mLylVxE2DYoU1xsCUUmz7H918ILwFzz1jgPhNlsX6Qbc-QzgBDj__iM0vxlqM2sq_jKxeSFfpJo3B0iv8rd-9ArMx/s1600/ot-mail.png) no-repeat scroll 4px oculus transparent;
padding:7px 15px 7px 35px;
color:#444;
font-weight:bold;
text-decoration:none;
border:1px company #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
width: 550px;
}
.emailtext:focus{
outline: none;
}
.sub-button{
color:#444;
font-weight:bold;
text-decoration:none;
padding:6px 10px;
border:1px company #D3D3D3;
cursor: pointer;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-goog-ms-border-radius: 5px;
border-radius: 5px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
.sub-button:hover{
background: -moz-linear-gradient(top, #e7e7e7 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e7e7e7), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#e7e7e7&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
background: linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
}</style>
<script type='text/javascript'>
  WebFontConfig = {
    google: { families: [ &#39;Cabin+Condensed::latin&#39; ] }
  };
  (function() {
    var wf = document.createElement(&#39;script&#39;);
    wf.src = (&#39;https:&#39; == document.location.protocol ? &#39;https&#39; : &#39;http&#39;) +
      &#39;://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js&#39;;
    wf.type = &#39;text/javascript&#39;;
    wf.async = &#39;true&#39;;
    var sec = document.getElementsByTagName(&#39;script&#39;)[0];
    s.parentNode.insertBefore(wf, s);
  })(); </script>

Now Just Save your Template By Pressing Save Now and proceed to adjacent footstep forthwith house the next code where you lot desire to display Rss Feed Email Subscription Box in your blog.If you lot desire to house it inwards sidebar larn to>> Blogger.com >> YourBlog >> Layout >> Add H5N1 Gadget >> Html/Javascript >> as well as re-create as well as glue the next code there                                                                                                  
<div class='sub-box'>
<div class='followlinks'>
<h1>Get Free Email Updates or Like us on your favourite Social networking site</h1>
<ul>
<li class='otrss'><a href='http://feeds.feedburner.com/Everfreetech' target='_blank'>RSS</a></li>
<li class='otgoogleplus'><a href='http://plus.google.com/114636838169087641091' target='_blank'>Google+</a></li>
<li class='ottwitter'><a href='http://twitter.com/Fosterzone' target='_blank'>Twitter</a></li>
<li class='otfacebook'><a href='https://www.facebook.com/Mybloggerlab' target='_blank'>Facebook</a></li>
</ul>
</div>
<br/>
<div style='text-align: left; display: inline-block;'>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=Everfreetech&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>

<input name='uri' type='hidden' value='Everfreetech'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='emailtext' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>
<input alt='' class='sub-button' title='' type='submit' value='SignUp'/>
</form></div></div>

Customizing Rss Feed Email Subscription Box According to your Details:
1.To add together your Rss Feed await for http://feeds.feedburner.com/Everfreetech as well as supervene upon it alongside your feed url

2.To Add Google Plus Look For http://plus.google.com/114636838169087641091 as well as supervene upon it alongside your Google Plus page Url

3.To Add your Twitter Page Look For Fosterzone And Replace it alongside your Twitter Username

4.To Add Your Facebook Page Look For https://www.facebook.com/Mybloggerlab and supervene upon it alongside your Facebook page url

5.Now the principal affair adding Email Subscription,Look For Everfreetech and supervene upon it alongside your Rss Feed page username i.e (http://feeds.feedburner.com/Everfreetech) alone username don't add together amount url

And Then Hit Save Button And Now Your Work is done if you lot desire to preview this Widget Click HERE if you lot bring whatever employment inwards adding the widget experience gratuitous to ask

Sunday, February 16, 2020

How To Job A Mega Driblet Downward Bill Of Fare Inwards Blogger

Over the previous twosome of years, the basis of the Blogosphere has progressed quite handsomely. Nowadays Bloggers too webmasters are concentrating to a greater extent than on their website’s designing rather than focusing on their content. Undoubtedly, having a beautiful website is the latest tendency too fifty-fifty visitors admire those blogs which are highly professional person inwards damage of their Layout, Header, Footer, Menu too etc. Therefore, having a construct clean too perfect navigation are the basic needs of each too every blog. However, bulk of blogs are all the same using the sometime navigation menus which kills the consummate presentation of a blog. If your site’s navigation is non perfect thus how tin yous facial expression your visitors to search your website inwards depth? Today nosotros volition larn how to practice a Fresh Mega Drop downward Menu for blogger blogs.




Why To Use Mega Drop Menu:

The biggest payoff of having a Mega navigation card is that it keeps the thinks together inwards ane place, thus your visitors won’t receive got to pass much fourth dimension inwards searching for a specific category of their interest. On the other hand, it volition come about your weblog facial expression construct clean too elegant because the consummate site navigation keeps things together.

How Mega Drop Down Menu Looks Like:

Unlike other mega menus, it has an elegant pattern which volition compliment your website or weblog because yous tin easily alter its color according to your desired needs. It is sparse inwards size thus it’s quite clear that it tin easily fit whatever site without whatever occupation whatsoever. Following is the animated representation of the MBL Mega Drop Down Menu.


Some Key Features Of MBL Mega Drop Menu:

Following are roughly of the initiatory of all features of the Drop card which volition non exclusively amuse yous but your visitors would dearest to play amongst it.
  • It supports almost every browser i.e. Firefox, Chrome too Internet explorer.  
  • You tin easily alter its color to gibe the color system of your website.
  • Unlike other menus, exclusively ane JavaScript is used thus it is extremely lite weighted.
  • It has a cute Email Subscription box inwards the driblet downward card that volition maximize your subscribers.

How To Create a Mega Drop Down Menu inwards Blogger:

Just similar our previous tutorials, the steps are pretty much straightforward too basis hardly accept 10 minutes to consummate the integration. Just follow the next instructions correctly.

  • Go To Blogger.com >> Your Site >> Template.
  • Try to brand a habit of creating a Backup of templates earlier editing it.
  • Select Edit HTML >> Proceed.
  • Now inside the template search for ]]></b:skin> and glue the next Style canvas coding.
  1. /*  MBL Mega Drop Down Menu Bar For Blogger (www.mybloggerlab.com) */
  2. ul.dropmenu{
  3. position: relative;
  4. margin: 0px;
  5. padding: 1px 0px 0px 0px;
  6. background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgprFmx0ywr-FojQjQmWdDJ14cgCPd676DWfGS4cbC5k9Dbfyo6GgF05HoOtpn9YR6BLYwu1Upnsud4zsyYcP2GAhYy_BtB_GFjJPZHe9XJsrlkchaUUnQbHFwtvAOKIknD7-9WAUTHSCk/s1600/navigation.png) repeat-x scroll 0 0;
  7. display:block;
  8. height: 35px;
  9. font-family:Verdana,Arial,Helvetica,sans-serif;
  10. font-size: 12px;
  11. }
  12. .dropmenu li{
  13. position: relative;
  14. list-style: none;
  15. float: left;
  16. margin: 0px;
  17. padding: 0px;
  18. }
  19. .dropmenu li a{
  20. height: 22px;
  21. padding: 9px 30px 0px 15px;
  22. display: block;
  23. cursor: point;
  24. border-right: corporation 1px #4a779d;
  25. color: #FFFFFF;
  26. text-transform: uppercase;
  27. text-decoration: none;
  28. }
  29. .dropmenu li span{
  30. display: block;
  31. float: right;
  32. height: 10px;
  33. width: 10px;
  34. background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEid6JvTsjad_dyoTIgzwmjRxvnncLa0GVKhVJZYxO0iDQKgfncRPjtp7idjUKrQQKpV7OQQ2DgYSoiX-tTqyFaE3dIspbpba4ElsuYH65b5TRcW8tacn084Z_G45QXJ4WgPtshoDCVKTy0/s1600/arrow_up.png) repeat-x scroll 0 0;
  35. position: absolute;
  36. top: 12px;
  37. right: 10px;
  38. }
  39. .dropmenu li  a:hover span{
  40. background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMsByPmg0wX7cfqRPqyrwbTInTJ5mKgNzVjY9CyoURDdenfW8bMreJkFJ-QKpqolaKIukKzi4fHelsJgm6NW_3pNPdYXpIPhd4iJCkZDGyVaFp8xbx_G3VQZNb6HWJD3DGV98-eR5oICo/s1600/arrow_hover.png) repeat-x scroll 0 0;
  41. }
  42. .dropmenu li:hover ul, .dropmenu li:hover div{
  43. display: block;
  44. }
  45. .dropmenu ul{
  46. position: absolute;
  47. display: none;
  48. width: 140px;
  49. padding: 0px;
  50. margin: 0px;
  51. border-bottom: 1px corporation #ccc;
  52. background: #FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz_WYGULnNFUKkIHXa-F8meuQjlaDkZR3Tkfll-6yIyEMtYOUE6VLzKAMsCl9Zj7ZygYW0BaBL4MkPFcvYYYTMxyEYO5hjc7kEYY29qOZToBItjkMCHwdJ01USczwcu5e2gVoFoU5YxEg/s1600/gradient.png) repeat-x scroll 0 0;
  53. }
  54. .dropmenu ul li{
  55. border: 0;
  56. float: none;
  57. }
  58. .dropmenu ul a {
  59.   border: 1px corporation #ccc;
  60.   border-bottom: 0;
  61.   white-space: nowrap;
  62.   display:block;
  63.   color: #0657AD;
  64.   text-decoration: underline;
  65.   text-transform: none;
  66. }
  67. a.selected, a:hover{
  68. color: #0657AD !important;
  69. background: #FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz_WYGULnNFUKkIHXa-F8meuQjlaDkZR3Tkfll-6yIyEMtYOUE6VLzKAMsCl9Zj7ZygYW0BaBL4MkPFcvYYYTMxyEYO5hjc7kEYY29qOZToBItjkMCHwdJ01USczwcu5e2gVoFoU5YxEg/s1600/gradient.png) repeat-x scroll 0 0;
  70. }
  71. a.selected span{
  72. background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMsByPmg0wX7cfqRPqyrwbTInTJ5mKgNzVjY9CyoURDdenfW8bMreJkFJ-QKpqolaKIukKzi4fHelsJgm6NW_3pNPdYXpIPhd4iJCkZDGyVaFp8xbx_G3VQZNb6HWJD3DGV98-eR5oICo/s1600/arrow_hover.png) repeat-x scroll 0 0;
  73. }
  74. .dropmenu ul a:hover {
  75. color:#F67A00 !important;
  76. text-decoration: none;
  77. background-color: #F0F0F0;
  78. background-image: none;
  79. }
  80. .dropmenu div ul{
  81. position: relative;
  82. display: block;
  83. }
  84. .dropmenu li div{
  85. background: #FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz_WYGULnNFUKkIHXa-F8meuQjlaDkZR3Tkfll-6yIyEMtYOUE6VLzKAMsCl9Zj7ZygYW0BaBL4MkPFcvYYYTMxyEYO5hjc7kEYY29qOZToBItjkMCHwdJ01USczwcu5e2gVoFoU5YxEg/s1600/gradient.png) repeat-x scroll 0 0;
  86. border: 1px corporation #ccc;
  87. padding: 5px;
  88. display: none;
  89. position: absolute;
  90. }
  91. .dropmenu li div ul{
  92. border: none;
  93. background: none;
  94. position: relative !important;
  95. }
  96. .dropmenu li div a{
  97. border: none;
  98. border-bottom: 1px corporation #ccc;
  99. }
  100. .dropmenu li div div{
  101. display: block;
  102. position: relative;
  103. background: none;
  104. border: none;
  105. }
  106. .dropmenu li div div a{
  107. display: inline;
  108. border: none;
  109. color: #666;
  110. text-decoration: underline;
  111. padding: 0px;
  112. margin: 0px;
  113. text-transform: none;
  114. }
  115. .dropmenu li div div a:hover{
  116. color: #000;
  117. text-decoration: none;
  118. }
  119. ul.left{
  120. float: left;
  121. width: 145px;
  122. }
  123. ul.right{
  124. float: right;
  125. width: 145px;
  126. }
  127. .small{
  128. color: #666;
  129. font-size: 10px;
  130. padding: 10px 5px 8px 5px !important;
  131. display: block;
  132. clear: both;
  133. }
  134. .products{
  135. width: 300px;
  136. padding: 15px !important;
  137. }
  138. .products ul{
  139. width: 100%;
  140. }
  141. .products ul li{
  142. border-bottom: 1px corporation #ccc;
  143. height: 40px;
  144. padding: 10px 0px;
  145. }
  146. .products h2{
  147. font-size: 16px;
  148. padding: 2px 0px 3px 0px;
  149. margin: 0px;
  150. }
  151. .products p{
  152. color: #666;
  153. font-size: 10px;
  154. padding: 0px;
  155. margin: 0px;
  156. }
  157. .products img{
  158. float: left;
  159. padding-right: 10px;
  160. }
  161. .products  ul li a{
  162. display: inline;
  163. border: none;
  164. color: #666;
  165. text-decoration: underline;
  166. padding: 0px;
  167. margin: 0px;
  168. text-transform: none;
  169. }
  170. .products  ul li  a:hover{
  171. color: #000 !important;
  172. text-decoration: none;
  173. background: none !important;
  174. }

  175. .tutorials{
  176. width: 300px;
  177. }


  178. input{
  179. border:1px corporation #4A779D;
  180. padding: 3px 8px;
  181. margin-bottom: 8px;
  182. width: 164px;
  183. }
  184. label{
  185. padding: 0px 0px 4px 0px;
  186. display:block;
  187. }
  188. button{
  189. background: #4A779D url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgprFmx0ywr-FojQjQmWdDJ14cgCPd676DWfGS4cbC5k9Dbfyo6GgF05HoOtpn9YR6BLYwu1Upnsud4zsyYcP2GAhYy_BtB_GFjJPZHe9XJsrlkchaUUnQbHFwtvAOKIknD7-9WAUTHSCk/s1600/navigation.png) repeat-x scroll 0 0;
  190. color: #FFF;
  191. border:1px corporation #4A779D;
  192. padding: 4px 10px;
  193. width: 180px;
  194. }

  195. .emailupdatesform{margin: 10px 0 5px 5px; width: 180px; float: left;}

  196. .emailupdatesform input.emailupdatesinput{background: #fff !important; float: left; border: 1px corporation #d2d2d2; padding: 0px 8px 0px 8px; color: #a19999; font-size: 12px; height: 25px; width: 160px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

  197. .emailupdatesform input.joinemailupdates{background:-moz-linear-gradient(top,#57ABFE 0%,#0080ff 100%); background:-webkit-gradient(linear,left top,left bottom,from(#57ABFE),to(#0080ff)); border: 1px corporation #0080ff; text-transform: none; font:bold 12px arial; color: #fff; height: 25px; padding: 0 12px 0 12px; margin: 0 0 0 5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; cursor:pointer;}

  • Again search for </head> too higher upward it glue the next JQuery coding.
  1. <script type="text/javascript" src="http://mybloggerlab.com/Scripts/jquery.js"></script> 
  2. <script type="text/javascript" src="http://mybloggerlab.com/Scripts/dropdown.js"></script> 
  3. <script>
  4. $(document).ready(function(){
  5. $("#nav-one").dropmenu();
  6. });
  7. </script>
  • Now Save your template yesteryear pressing Save template button.

Adding the Mega Drop Down Menu To Blogger

Now amongst inwards your template search for the next chunk of coding. Remember it is not necessary that yous receive got the exact same coding, simply facial expression for the similar coding. TIP: To Find the coding rapidly Search for "Header1" or "(Header)". 

  1. <div id='header-wrapper'> 
  2. <div class='headerleft'> 
  3. <b:section class='headerleft' id='headerleft' maxwidgets='1' showaddelement='no'>
  4. <b:widget id='Header1' locked='true' title=' (Header)' type='Header'/>
  5. </b:section> 
  6. </div>
Once yous receive got institute the Similar coding thus below it glue the next Mega Menu HTML Coding. 


  1. <ul id="nav-one" class="dropmenu"> 
  2. <li> 
  3.     <a href="#">Home</a> </li><li> 
  4.     <a href="#">Forum</a><ul> 
  5.         <li><a href="#">Support</a></li> 
  6. <li><a href="#">Help</a></li> 
  7. <li><a href="#">Examples</a></li>
  8. <li><a href="#">Your work</a></li>
  9. </ul> 
  10. </li> 
  11. <li> 
  12.     <a href="#item3">Downloads</a><ul> 
  13.        <li><a href="#">Tools</a></li> 
  14.        <li><a href="#">Office</a></li> 
  15.        <li><a href="#">Custom projects</a></li> 
  16. </ul> 
  17. </li>  
  18. <li> 
  19. <a href="#">Products</a> 
  20. <div class="products">
  21. <ul> 

  22. <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh-wMkJwtZnTRoLp2OqpKNXwX491BuoCPIJzQQ8y5v_787iTC_dNIOGtvxaQBgjxuAD2ZoNYfiX6w9rMQCJfPNaASiuPg8VyUQHPc17srIU5UvaTqwzbf9Thb3_x_NEiTi0gh2TbI3Xx0/s1600/1.jpg" width="40" height="40" alt=" the basis of the Blogosphere has progressed quite handsomely How To Create a Mega Drop Down Menu inwards Blogger" border="0" /><h2>Featured Box</h2><p><a href="#">More data virtually this product</a></p></li> 
  23. <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhnIalOt6XOxcAbN0l5_hlMow4_ARA9SoQvNdHN-d7amVYUuOtDL171iNDqsn0ZdKw9KUI83yzuhHeaR4NTHNx0qJ47U7fGb6sZCIh4gxvF6-TEiB3iFFBzwGrGcW-woImkyv6VdQ8F2Q/s1600/2.jpg" width="40" height="40" alt=" the basis of the Blogosphere has progressed quite handsomely How To Create a Mega Drop Down Menu inwards Blogger" border="0" /><h2>Mod Rewriter</h2><p><a href="#">More data virtually this product</a></p></li> 
  24. <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEix8RHcD573jeW34LzltGEUsoR6k_lLqGFG8oVRXNurNi7HJzTbAQB0BLLHuN6zkKFUDhQbf1h9K1Syf2QkHRiq9PPq8Wid854dmeBi1AUXu7ZVzgNiGfi_ye9GRk0-k0eEk_pEJyJv_ik/s1600/3.jpg" width="40" height="40" alt=" the basis of the Blogosphere has progressed quite handsomely How To Create a Mega Drop Down Menu inwards Blogger" border="0" /><h2>Byte Scrambler</h2><p><a href="#">More data virtually this product</a></p></li> 
  25.  
  26. <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEix8RHcD573jeW34LzltGEUsoR6k_lLqGFG8oVRXNurNi7HJzTbAQB0BLLHuN6zkKFUDhQbf1h9K1Syf2QkHRiq9PPq8Wid854dmeBi1AUXu7ZVzgNiGfi_ye9GRk0-k0eEk_pEJyJv_ik/s1600/3.jpg" width="40" height="40" alt=" the basis of the Blogosphere has progressed quite handsomely How To Create a Mega Drop Down Menu inwards Blogger" border="0" /><h2>Image Processor</h2><p><a href="#">More data virtually this product</a></p></li> 
  27. <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpRqTwc_y46Dy3qCmvLIAylKlOtwbSxwu2WiMIBcQ9SD8LNuG6xeRN2_O8ESra6Y-ONV30y-xQlX1NdjMY0Tjz64oBi56Os7Atsz_xRNJTjQ0oWJnqJGHAT_EY_rTFPKwQ9GD8M0W9gRE/s1600/5.jpg" width="40" height="40" alt=" the basis of the Blogosphere has progressed quite handsomely How To Create a Mega Drop Down Menu inwards Blogger" border="0" /><h2>Registry Class</h2><p><a href="#">More data virtually this product</a></p></li> 
  28. <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh32iLSnbuxQRRhQLfSamqoyNkUwAuPVaJ8fskNlbOTDN2Abv1vDsXSdYDtoWgaw7C9B1JZOHtRUfRuX_Tg1ayquC6H7yiAe9BSBV70LqRbHaikzVHjnYRsbUrWTcndGB9pC5yWqX83_oM/s1600/6.jpg" width="40" height="40" alt=" the basis of the Blogosphere has progressed quite handsomely How To Create a Mega Drop Down Menu inwards Blogger" border="0" /><h2>Data Validation</h2><p><a href="#">More data virtually this product</a></p></li> 
  29. <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWG67bbGevLRJGHzfZWJS3WLsrlt1dsAR1T03xuYMGMsnMygojR_ed-ucE5wOu36o6rJ5p4WlrnEtJ9SSOM1n7nVrzAJNjEcNYYvszMdy6dEf0rqJ9EqFxo3Ld5Gv90_ZfbdD141nm_lk/s1600/7.jpg" width="40" height="40" alt=" the basis of the Blogosphere has progressed quite handsomely How To Create a Mega Drop Down Menu inwards Blogger" border="0" /><h2>Ajax Tables</h2><p><a href="#">More data virtually this product</a></p></li> 
  30. </ul>

  31. <div class="small">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident.</div>
  32. </div>
  33. </li>
  34. <li> 

  35. <a href="#">Tutorials</a> 
  36. <div class="tutorials">
  37. <ul class="left"> 
  38. <li><a href="#">Javascript</a></li> 
  39. <li><a href="#">Python</a></li> 
  40. <li><a href="#">PHP</a></li> 
  41. </ul>
  42. <ul class="right"> 
  43. <li><a href="#">HTML/CSS</a></li> 
  44. <li><a href="#">ASP.NET</a></li> 
  45. <li><a href="#">Actionscript</a></li> 
  46. </ul>
  47.  <div class="small">View <a href="#">all categories</a> or a <a href="#">list of the best tutorials</a>.</div>
  48. </div>
  49. </li>
  50. <li> 

  51. <a href="#">Links</a> <ul> 
  52.   <li><a href="#">Programming</a></li> 
  53.   <li><a href="#">Inspiration</a></li> 
  54.    <li><a href="#">My websites</a></li> 
  55.    <li><a href="#">Clients</a></li> 
  56.    <li><a href="#">Cool stuff</a></li> 
  57.    <li><a href="#">Sitebase</a></li> 
  58.    <li><a href="#">Other</a></li> 
  59. </ul> 
  60. </li>
  61. <li> 

  62. <a href="#">Subscribe Now</a> 
  63. <div class="emailsub">
  64.         <div class="emailupdatesform">
  65.         <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=MYBLOGGERLAB', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="emailupdatesinput" name="email" value="Enter your electronic mail here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your electronic mail here...&#39;;}" onfocus="if (this.value == &#39;Enter your electronic mail here...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="tntbystc" name="uri" type="hidden" /><input value="Submit" class="joinemailupdates" type="submit" /></form></div></div>
  66. </li>
  67. </ul>
Customization:
Replace MYBLOGGERLAB amongst your RSS Feed Email Subscription Username.
Replace All Light Pink,Light Orange,Light Blue Links According to your needs.


From The Editor’s Desk:
We promise yous receive got enjoyed the feast, this calendar week nosotros receive got shared almost 3 totally unique widgets i.e. Twitter Man, Sticky Footer too this Mega Menu. Our Developers are busy inwards creating a novel Blogger Template thus come about your figures cross. If yous receive got whatever difficulty piece adding this Mega Menu experience gratuitous to enquire till thus Peace, Blessings too Happy learning.