I am extremely sorry for delaying this post. Due to burden of studies I was finding it difficult to publish posts but now everything is fine. Now without wasting your time lets jump straight to the tutorial of adding a beautiful Subscription form to the sidebars of your BlogSpot blogs.
Before Proceeding make sure you have burnt your feeds at www.feedburner.com Now do the following,
Now you need to make some important changes to customize the widget.
Replace http://feeds2.feedburner.com/TntByStc with your Feed URL that Feedburner has provided you. If you don’t now how to get it simple replace TntByStc with your Feed title like this,
Replace TntByStc with your own Feedburner Feed Title
The Color code #5C6AA4 refers to the text colour and border colour of the Subscription Box. May be Color Chart will help you. If you are using Buster Themes than change the colours as follows,
For Buster Theme 1 leave the code #5C6AA4 unchanged.
For Buster Theme 2 replace #5C6AA4 with #64A6E4
For Buster Theme 3 replace #5C6AA4 with #37BD07
For Buster Theme 4 replace #5C6AA4 with #7CA2C4
If you are using Church Theme then replace #5C6AA4 with #7CA2C4
That’s it. Hit Save and Preview Your Widget!
I hope it was simple to understand :|
I am pretty excited to share the trick of adding one of the best flash players to your blog. This player is different from rest of the Mp3 players found elsewhere. It is simple in design, supports music with a high range of frequencies and most importantly works with all browsers. Adding this player will add a pro look to your blog because many bloggers don’t know about this player as yet, so be the first to use it. Many bloggers also think that this audio player works with WordPress only but with a little tweaking I will help you add this player successfully to your BlogSpot blogs.
This is how your cool flash player would look like,
To add this player to your blog post or sidebar, do the following,
Go to Layout > Edit HTML >
Backup your template >
Press Ctrl + F and look for </head> by using the search box,
Immediately above </head> tag add this code,
Tip of Copying the Code Below:- Start Highlighting the Code from bottom to top and then Press Ctrl + C to copy it. To Paste it above </head> simply press Ctrl + V
That’s it.
<script type='text/javascript'>
//<![CDATA[
var AudioPlayer=function(){var F=[];var C;var E="";var A={};var D=-1;function B(G){return document.all?window[G]:document[G]}return{setup:function(H,G){E=H;A=G},getPlayer:function(G){return B(G)},embed:function(K,O){var I={};var M;var G;var P;var H;var N={};var J={};var L={};for(M in A){I[M]=A[M]}for(M in O){I[M]=O[M]}if(I.transparentpagebg=="yes"){N.bgcolor="#FFFFFF";N.wmode="transparent"}else{if(I.pagebg){N.bgcolor="#"+I.pagebg}N.wmode="opaque"}N.menu="false";for(M in I){if(M=="pagebg"||M=="width"||M=="transparentpagebg"){continue}J[M]=I[M]}L.name=K;L.style="outline: none";J.playerID=K;audioplayer_swfobject.embedSWF(E,K,I.width.toString(),"24","9",false,J,N,L);F.push(K)},syncVolumes:function(G,I){D=I;for(var H=0;H<F.length;H++){if(F[H]!=G){B(F[H]).setVolume(D)}}},activate:function(G){if(C&&C!=G){B(C).close()}C=G},load:function(I,G,J,H){B(I).load(G,J,H)},close:function(G){B(G).close();if(G==C){C=null}},open:function(G){B(G).open()},getVolume:function(G){return D}}}()/* SWFObject v2.1 <http://code.google.com/p/swfobject/>
Copyright (c) 2007-2008 Geoff Stearns, Michael Williams, and Bobby van der Sluis
This software is released under the MIT License <http://www.opensource.org/licenses/mit-license.php>
*/
var audioplayer_swfobject=function(){var b="undefined",Q="object",n="Shockwave Flash",p="ShockwaveFlash.ShockwaveFlash",P="application/x-shockwave-flash",m="SWFObjectExprInst",j=window,K=document,T=navigator,o=[],N=[],i=[],d=[],J,Z=null,M=null,l=null,e=false,A=false;var h=function(){var v=typeof K.getElementById!=b&&typeof K.getElementsByTagName!=b&&typeof K.createElement!=b,AC=[0,0,0],x=null;if(typeof T.plugins!=b&&typeof T.plugins[n]==Q){x=T.plugins[n].description;if(x&&!(typeof T.mimeTypes!=b&&T.mimeTypes[P]&&!T.mimeTypes[P].enabledPlugin)){x=x.replace(/^.*\s+(\S+\s+\S+$)/,"$1");AC[0]=parseInt(x.replace(/^(.*)\..*$/,"$1"),10);AC[1]=parseInt(x.replace(/^.*\.(.*)\s.*$/,"$1"),10);AC[2]=/r/.test(x)?parseInt(x.replace(/^.*r(.*)$/,"$1"),10):0}}else{if(typeof j.ActiveXObject!=b){var y=null,AB=false;try{y=new ActiveXObject(p+".7")}catch(t){try{y=new ActiveXObject(p+".6");AC=[6,0,21];y.AllowScriptAccess="always"}catch(t){if(AC[0]==6){AB=true}}if(!AB){try{y=new ActiveXObject(p)}catch(t){}}}if(!AB&&y){try{x=y.GetVariable("$version");if(x){x=x.split(" ")[1].split(",");AC=[parseInt(x[0],10),parseInt(x[1],10),parseInt(x[2],10)]}}catch(t){}}}}var AD=T.userAgent.toLowerCase(),r=T.platform.toLowerCase(),AA=/webkit/.test(AD)?parseFloat(AD.replace(/^.*webkit\/(\d+(\.\d+)?).*$/,"$1")):false,q=false,z=r?/win/.test(r):/win/.test(AD),w=r?/mac/.test(r):/mac/.test(AD);/*@cc_on q=true;@if(@_win32)z=true;@elif(@_mac)w=true;@end@*/return{w3cdom:v,pv:AC,webkit:AA,ie:q,win:z,mac:w}}();var L=function(){if(!h.w3cdom){return }f(H);if(h.ie&&h.win){try{K.write("<script id=__ie_ondomload defer=true src=//:><\/script>");J=C("__ie_ondomload");if(J){I(J,"onreadystatechange",S)}}catch(q){}}if(h.webkit&&typeof K.readyState!=b){Z=setInterval(function(){if(/loaded|complete/.test(K.readyState)){E()}},10)}if(typeof K.addEventListener!=b){K.addEventListener("DOMContentLoaded",E,null)}R(E)}();function S(){if(J.readyState=="complete"){J.parentNode.removeChild(J);E()}}function E(){if(e){return }if(h.ie&&h.win){var v=a("span");try{var u=K.getElementsByTagName("body")[0].appendChild(v);u.parentNode.removeChild(u)}catch(w){return }}e=true;if(Z){clearInterval(Z);Z=null}var q=o.length;for(var r=0;r<q;r++){o[r]()}}function f(q){if(e){q()}else{o[o.length]=q}}function R(r){if(typeof j.addEventListener!=b){j.addEventListener("load",r,false)}else{if(typeof K.addEventListener!=b){K.addEventListener("load",r,false)}else{if(typeof j.attachEvent!=b){I(j,"onload",r)}else{if(typeof j.onload=="function"){var q=j.onload;j.onload=function(){q();r()}}else{j.onload=r}}}}}function H(){var t=N.length;for(var q=0;q<t;q++){var u=N[q].id;if(h.pv[0]>0){var r=C(u);if(r){N[q].width=r.getAttribute("width")?r.getAttribute("width"):"0";N[q].height=r.getAttribute("height")?r.getAttribute("height"):"0";if(c(N[q].swfVersion)){if(h.webkit&&h.webkit<312){Y(r)}W(u,true)}else{if(N[q].expressInstall&&!A&&c("6.0.65")&&(h.win||h.mac)){k(N[q])}else{O(r)}}}}else{W(u,true)}}}function Y(t){var q=t.getElementsByTagName(Q)[0];if(q){var w=a("embed"),y=q.attributes;if(y){var v=y.length;for(var u=0;u<v;u++){if(y[u].nodeName=="DATA"){w.setAttribute("src",y[u].nodeValue)}else{w.setAttribute(y[u].nodeName,y[u].nodeValue)}}}var x=q.childNodes;if(x){var z=x.length;for(var r=0;r<z;r++){if(x[r].nodeType==1&&x[r].nodeName=="PARAM"){w.setAttribute(x[r].getAttribute("name"),x[r].getAttribute("value"))}}}t.parentNode.replaceChild(w,t)}}function k(w){A=true;var u=C(w.id);if(u){if(w.altContentId){var y=C(w.altContentId);if(y){M=y;l=w.altContentId}}else{M=G(u)}if(!(/%$/.test(w.width))&&parseInt(w.width,10)<310){w.width="310"}if(!(/%$/.test(w.height))&&parseInt(w.height,10)<137){w.height="137"}K.title=K.title.slice(0,47)+" - Flash Player Installation";var z=h.ie&&h.win?"ActiveX":"PlugIn",q=K.title,r="MMredirectURL="+j.location+"&MMplayerType="+z+"&MMdoctitle="+q,x=w.id;if(h.ie&&h.win&&u.readyState!=4){var t=a("div");x+="SWFObjectNew";t.setAttribute("id",x);u.parentNode.insertBefore(t,u);u.style.display="none";var v=function(){u.parentNode.removeChild(u)};I(j,"onload",v)}U({data:w.expressInstall,id:m,width:w.width,height:w.height},{flashvars:r},x)}}function O(t){if(h.ie&&h.win&&t.readyState!=4){var r=a("div");t.parentNode.insertBefore(r,t);r.parentNode.replaceChild(G(t),r);t.style.display="none";var q=function(){t.parentNode.removeChild(t)};I(j,"onload",q)}else{t.parentNode.replaceChild(G(t),t)}}function G(v){var u=a("div");if(h.win&&h.ie){u.innerHTML=v.innerHTML}else{var r=v.getElementsByTagName(Q)[0];if(r){var w=r.childNodes;if(w){var q=w.length;for(var t=0;t<q;t++){if(!(w[t].nodeType==1&&w[t].nodeName=="PARAM")&&!(w[t].nodeType==8)){u.appendChild(w[t].cloneNode(true))}}}}}return u}function U(AG,AE,t){var q,v=C(t);if(v){if(typeof AG.id==b){AG.id=t}if(h.ie&&h.win){var AF="";for(var AB in AG){if(AG[AB]!=Object.prototype[AB]){if(AB.toLowerCase()=="data"){AE.movie=AG[AB]}else{if(AB.toLowerCase()=="styleclass"){AF+=' class="'+AG[AB]+'"'}else{if(AB.toLowerCase()!="classid"){AF+=" "+AB+'="'+AG[AB]+'"'}}}}}var AD="";for(var AA in AE){if(AE[AA]!=Object.prototype[AA]){AD+='<param name="'+AA+'" value="'+AE[AA]+'" />'}}v.outerHTML='<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'+AF+">"+AD+"</object>";i[i.length]=AG.id;q=C(AG.id)}else{if(h.webkit&&h.webkit<312){var AC=a("embed");AC.setAttribute("type",P);for(var z in AG){if(AG[z]!=Object.prototype[z]){if(z.toLowerCase()=="data"){AC.setAttribute("src",AG[z])}else{if(z.toLowerCase()=="styleclass"){AC.setAttribute("class",AG[z])}else{if(z.toLowerCase()!="classid"){AC.setAttribute(z,AG[z])}}}}}for(var y in AE){if(AE[y]!=Object.prototype[y]){if(y.toLowerCase()!="movie"){AC.setAttribute(y,AE[y])}}}v.parentNode.replaceChild(AC,v);q=AC}else{var u=a(Q);u.setAttribute("type",P);for(var x in AG){if(AG[x]!=Object.prototype[x]){if(x.toLowerCase()=="styleclass"){u.setAttribute("class",AG[x])}else{if(x.toLowerCase()!="classid"){u.setAttribute(x,AG[x])}}}}for(var w in AE){if(AE[w]!=Object.prototype[w]&&w.toLowerCase()!="movie"){F(u,w,AE[w])}}v.parentNode.replaceChild(u,v);q=u}}}return q}function F(t,q,r){var u=a("param");u.setAttribute("name",q);u.setAttribute("value",r);t.appendChild(u)}function X(r){var q=C(r);if(q&&(q.nodeName=="OBJECT"||q.nodeName=="EMBED")){if(h.ie&&h.win){if(q.readyState==4){B(r)}else{j.attachEvent("onload",function(){B(r)})}}else{q.parentNode.removeChild(q)}}}function B(t){var r=C(t);if(r){for(var q in r){if(typeof r[q]=="function"){r[q]=null}}r.parentNode.removeChild(r)}}function C(t){var q=null;try{q=K.getElementById(t)}catch(r){}return q}function a(q){return K.createElement(q)}function I(t,q,r){t.attachEvent(q,r);d[d.length]=[t,q,r]}function c(t){var r=h.pv,q=t.split(".");q[0]=parseInt(q[0],10);q[1]=parseInt(q[1],10)||0;q[2]=parseInt(q[2],10)||0;return(r[0]>q[0]||(r[0]==q[0]&&r[1]>q[1])||(r[0]==q[0]&&r[1]==q[1]&&r[2]>=q[2]))?true:false}function V(v,r){if(h.ie&&h.mac){return }var u=K.getElementsByTagName("head")[0],t=a("style");t.setAttribute("type","text/css");t.setAttribute("media","screen");if(!(h.ie&&h.win)&&typeof K.createTextNode!=b){t.appendChild(K.createTextNode(v+" {"+r+"}"))}u.appendChild(t);if(h.ie&&h.win&&typeof K.styleSheets!=b&&K.styleSheets.length>0){var q=K.styleSheets[K.styleSheets.length-1];if(typeof q.addRule==Q){q.addRule(v,r)}}}function W(t,q){var r=q?"visible":"hidden";if(e&&C(t)){C(t).style.visibility=r}else{V("#"+t,"visibility:"+r)}}function g(s){var r=/[\\\"<>\.;]/;var q=r.exec(s)!=null;return q?encodeURIComponent(s):s}var D=function(){if(h.ie&&h.win){window.attachEvent("onunload",function(){var w=d.length;for(var v=0;v<w;v++){d[v][0].detachEvent(d[v][1],d[v][2])}var t=i.length;for(var u=0;u<t;u++){X(i[u])}for(var r in h){h[r]=null}h=null;for(var q in audioplayer_swfobject){audioplayer_swfobject[q]=null}audioplayer_swfobject=null})}}();return{registerObject:function(u,q,t){if(!h.w3cdom||!u||!q){return }var r={};r.id=u;r.swfVersion=q;r.expressInstall=t?t:false;N[N.length]=r;W(u,false)},getObjectById:function(v){var q=null;if(h.w3cdom){var t=C(v);if(t){var u=t.getElementsByTagName(Q)[0];if(!u||(u&&typeof t.SetVariable!=b)){q=t}else{if(typeof u.SetVariable!=b){q=u}}}}return q},embedSWF:function(x,AE,AB,AD,q,w,r,z,AC){if(!h.w3cdom||!x||!AE||!AB||!AD||!q){return }AB+="";AD+="";if(c(q)){W(AE,false);var AA={};if(AC&&typeof AC===Q){for(var v in AC){if(AC[v]!=Object.prototype[v]){AA[v]=AC[v]}}}AA.data=x;AA.width=AB;AA.height=AD;var y={};if(z&&typeof z===Q){for(var u in z){if(z[u]!=Object.prototype[u]){y[u]=z[u]}}}if(r&&typeof r===Q){for(var t in r){if(r[t]!=Object.prototype[t]){if(typeof y.flashvars!=b){y.flashvars+="&"+t+"="+r[t]}else{y.flashvars=t+"="+r[t]}}}}f(function(){U(AA,y,AE);if(AA.id==AE){W(AE,true)}})}else{if(w&&!A&&c("6.0.65")&&(h.win||h.mac)){A=true;W(AE,false);f(function(){var AF={};AF.id=AF.altContentId=AE;AF.width=AB;AF.height=AD;AF.expressInstall=w;k(AF)})}}},getFlashPlayerVersion:function(){return{major:h.pv[0],minor:h.pv[1],release:h.pv[2]}},hasFlashPlayerVersion:c,createSWF:function(t,r,q){if(h.w3cdom){return U(t,r,q)}else{return undefined}},removeSWF:function(q){if(h.w3cdom){X(q)}},createCSS:function(r,q){if(h.w3cdom){V(r,q)}},addDomLoadEvent:f,addLoadEvent:R,getQueryParamValue:function(v){var u=K.location.search||K.location.hash;if(v==null){return g(u)}if(u){var t=u.substring(1).split("&");for(var r=0;r<t.length;r++){if(t[r].substring(0,t[r].indexOf("="))==v){return g(t[r].substring((t[r].indexOf("=")+1)))}}}return""},expressInstallCallback:function(){if(A&&M){var q=C(m);if(q){q.parentNode.replaceChild(M,q);if(l){W(l,true);if(h.ie&&h.win){M.style.display="block"}}M=null;l=null;A=false}}}}}();
//]]>
</script>
Save your template
Now whenever you want to add this WordPress Audio Player to your posts or sidebar, add the code below to the Edit HTML section of your Post or to the HTML/JavaScript widget in your sidebar.
Remember to replace the text in green with the URL of your MP3 file. To know how to get URLs for your files read Learn how to get hotlinking/Direct URLs for your files Now publish your post and enjoy listening to your favorite music! Add more than one Wordpress audio player per post
To add more than one audio player to your post, simply add the code below for your second player,
<object type="application/x-shockwave-flash" data="http://mustafastc.fileave.com/player.swf" id="audioplayer2" height="24" width="290">
<param name="movie" value="http://mustafastc.fileave.com/player.swf">
<param name="FlashVars" value="playerID=2&soundFile=URL of your second MP3 file">
<param name="quality" value="high">
<param name="menu" value="false">
<param name="wmode" value="transparent">
</object>
You get another Mp3 player just like the first one
Remember to replace the text in green with the URL of your MP3 file. If you want to use an extra player, simply change the text in red to the number of player. For adding a third player change the text in red to 3 and so on. Attention! The Reason why many readers were getting errors while using this player is that I have saved the flash file of this player in a free hosting service like www.fileave.com To have this player work efficiently kindly save the following files in a free file hosting service and link to them using your own URLs,
I have linked to the above flash file as http://mustafastc.fileave.com/player.swf in the codes shared above. Kindly replace this URL with yours. Update:- If you wish to colorize the player or want to change its look and feel then read this post –> Customize The Color Scheme Of Wordpress MP3 Player
I hope you would like this new update. If you have any question please feel free to ask me in the comment box below.
Keeping the posts unique in every way should be the aim of every blogger. The Number list (ol) and Bullet list (ul) is an important part of a good article. To change the entire look and feel of these lists we will use simple CSS effects to bring about a change in bullets and number style on mouse hover. This tutorial consists of two very interesting parts,
Change Bullet list (un-ordered list) style on Mouse Hover
Change Number List (order list) style on Mouse Hover
Change Bullet list (ul) style on Mouse Hover
Before I may start lets see a Live Demo. Make sure you hit the Preview button.
To add this effect to your posts, do the following,
Log into Blogger
Go To Layout > Edit HTML
Now add this piece of code just above ]]></b:skin>
.post ul {list-style-type: circle; }
.post ul li {
line-height: 1.5em;
color:#289728;
}
.post ul li:hover {
color:#0080ff; list-style-type: disc; }
.post ul p { color:#555555;
line-height:1.4em; }
You can change the colors with any Hexa Decimal Value you like and can also change list-style-type: with many options like : circle, disc or square.
Save Your template
Now whenever you create a bullet list in your posts make a minor change to it by adding p tag to it. How? Read below,
Once you have created a bullet list in your post switch to the EDIT HTML Section and search for <ul> You will find a code something like below,
<ul>
<li>Your Content Here</li>
<li>Your Content Here</li>
</ul>
It doesn’t matter if the code appears horizontally. You just need to replace <li> with <li><p> and </li> with </p></li> . Replace them as many times as they appear. Now the code will look like this,
<ul> <li><p>
Your Content Here</p></li> <li><p>Your Content Here</p></li> </ul>
To add this effect to your posts, do the following,
Log into Blogger
Go To Layout > Edit HTML
Now add this piece of code just above ]]></b:skin>
.post ol {
font: italic 1em Georgia, Times, serif;
color: #999999;
}
.post ol li {
line-height: 1.4em;
font: italic 1em Georgia, Times, serif;
color: #289728;
}
.post ol li:hover {
font:bold italic 1em Georgia, Times, serif;
color: #0080ff;
}
.post ol p {
font: normal 1em Arial, Helvetica, sans-serif;
color: #555555;
line-height:1.4em;
}
Change the colors to suit your preferences. For help use our color chart.
Save your template
Now whenever you write a post and use a number list just make similar changes to the code in edit html section as you did for un-ordered list. But this time instead of searching for <ul> search for <ol> Make sure you change <li> with <li><p> and </li> with </p></li>
That’s it! preview you template to see the new change in number list.
The biggest problem faced by majority of newbie bloggers and web developers is editing their templates. And the reason for this is lack of awareness with browser languages like CSS, XML, HTML, JavaScript etc. There are several websites online that have tutorials in these fields and one of such websites is www.w3schools.com This website is popular because it lets you play with the code! It has an Online HTML Editor Tool that lets you see live preview of the code that you use. Many developers find this tool pretty useful but has someone ever imagined that you can actually rip this tool out of w3schools and use it offline for practicing coding while offline? Well fortunately after some trial and error we could successfully create a similar tool entitled as “HTML Editor” This is the first time all bloggers are having a chance to have fun playing with important codes like CSS, HTML and JavaScript and learn important coding in a more interesting way! Now you can actually test a code before adding them to blogger.
This tool is better than any other HTML Editor found online or available as a software, in the following ways,
It works Offline in any browser available
Takes less than a fraction of a second to show live preview
Is equal in size to a peanut i.e 2.32 Kb
Code is saved in browser if your PC shutdowns accidently
You can go back several times using Ctrl + Z and go forward using Ctrl + Y
Can be used to test a code for Cross Browser Compatibility
It is free of charge thanks to ! :D
Downloading Instructions
To Download MBT HTML Editor follow the steps below,
The MBT HTML Editor window will expand. Now you can start using it Online but to work offline in it you need to save it first. To save it click on the file menu at top-left-corner of your browser and then choose “Save As” or “Save Page As”. Select a safe location and hit enter, as shown below,
Done!
Troubleshoot:- In IE a Security alert will appear, ignore it by right clicking on it and then selecting Allow Blocked Content
Instructions For Using MBT HTML EDITOR
This tool consists of two panes i.e left pane and right pane. See a screen shot below,
The left pane is the area where you add your code and the right pane is the area responsible for displaying a visual view of the code. The CSS code is added just between <style> and </style> and the HTML code is added just below </style>
Playing With A Code
Lets now play with a code using our HTML Editor. I am using the Image Opacity Effect Trick here as an example.
The CSS code for Opacity Effect looks like this,
Now The best part, add the CSS code just between <style> and </style> and the HTML code just below </style>. Hit the Preview button and watch the dancing code in action in front of your eyes. You can now start the play!
See this screen shot,
Some Important Tips:-
To go backward to previous changes, click Ctrl + Z
To go forward to last changes made, click Ctrl + Y
To get URL of an image saved in your hard drive suppose Drive F, open Firefox browser and simply type F: in the address bar and hit enter. That drive will open and now simply browse to that image and right click on it and then click on Copy Link Location. Alas! you got the URL. Now use this URL wherever required during your offline code editing adventure.
Once you are happy with the code that you prepared then simply paste the CSS code just above ]]></b:skin> inside your blogger template and the HTML code where you want the effect to be seen i.e post or sidebar
The look and appearance of a great blog is always an inspiration for bloggers and web designers. I hope you all are well aware of Amanda’s blog “Blogger Buster” and I am sure you all love the overall look and feel of her blog. But have you ever imagined that you could have a premium looking template just like Amanda’s for free? If not then let me announce that you surely could have one, thanks to us :>
I am proud to let you know that after a week of hard work I was able to create a series of blogger templates similar to Blogger Buster and I named each one of them: “Buster Theme”
Have a glance of them by clicking the link below each theme,
There are many new features in these MBT template series which will be of great interest to even Amanda herself. And as I say always MBT templates are stylized,customized and optimized by default! There is absolutely no work required on your side but a little push start at first :>
Lets look at some of its Main features,
Navigation bar
Well organized Post Header with separate date, time and label sections
Wide post body with Stylized Post images and BlockQuote
Post Footer With- MBT Social Bookmarking Icons
Post Footer With- Subscription Block
Post Footer With- Built-in Related Post Widget
Sidebars with rounded header corners
Stylized and un-stylized Sidebar Sections for multiple use
Flexible Search Box
Flexible Subscription Form
Flexible Advertisement section
Cross Browser Compatible Multi Tab Widget – Highly User Friendly!
Embedded and stylized Comment section. Author and Readers comment with different style
Comment Count
Comment Avatar, with Comment Icon for anonymous users
Footer Three Column Widget. One Column Can accommodate as many widgets as you can add!
IMPORTANT WIDGET SECTIONS IN LAYOUT
As shown in the image below, there a total of 4 widget sections in right sidebar. Widget Section 2 and 4 are stylized sections whilst section 1 and 3 are un-stylized. Add only those widgets to section 1 and 3, for which you want a completely unique customization. To know what I mean by that read the Customization Instructions
Now you need to Boost up your selected template with Three Important Professional Procedures. Which are,
Below are important steps to upload and customize your MBT Buster Theme. I have also shared codes to flexible widgets used in the template. Click each link for details.
Once you have downloaded Buster theme then follow the steps below to replace your current template with it,
Go To Layout > Edit HTML
You will see a box with two buttons at its side that says “ Browse” and “Upload” as shown below,
3. Click the browse button, locate the buster theme file and then click the upload button
4. Now you will be asked that certain widget data will be lost if you click save. Since we have already backed up all our widgets so we don’t care. Go on and click the “Confirm Save” button. Alas! you have successfully replaced your current template. View your blog to see the new mega change.
4. Edit the bolded text in the code above with your own Page links and Page Titles. Replace the hash sign (#) with your Page URL and bolded green text with your Page Name/Title. Also Replace http://www.themobilehub.blogspot.comwith your own Page URL
5.If you want to add another link/tab but have no option left than paste the code below just above </ul>
<li>
<a href='#'>Page Name</a>
</li>
6. Save your template and view your template to see the changes in action.
Click Add a Gadget from the Widget Section-3, and choose HTML/JavaScript
Now For the rest of detailed instructions read this post –> 125 By 125 Ad Banner Widget For Bloggers Where you will get the code to add to your HTML/JavaScript widget.
Replace Tab 1, 2, 3 With Tab Titles and TAB 1,2,3 CONTENT GOES HERE with the HTML code of your Recent Comments, Posts and Popular Posts Widgets. You can add anything in Tab Content Area.
I worked really hard to make this widget user friendly. You will find this widget code really handy. Further I have also solved the Browser compatibility Issue i.e The tabs will look rounded in Firefox, Safari, Opera, Chrome and they will only look rectangular in IE. IE was a real headache for me!
You will have to create a Header image in gif format and with dimensions 1024 by 214. After you have created one, upload it to your template as follows,
Go To layout
Then click the Edit link at the top of your layout as shown below,
3. A window will open. Click the Browse button and locate your header image. Make sure you check the box saying “Instead of Title and Description”
As I said all MBT Templates are optimized by default! Hence you do not need to find meta tags and add them inside your templates. You only need to add the required keywords, description and your name to the metas. Follow the steps below,
Go To Layout > Edit HTML
And search for <head>(Tip:- Press Ctrl + F to use a search box for finding <head>)
You will find 4 important meta tags under the <head> tag as shown in the image below,
You just need to edit the required fields as guided in the bolded text below.
Update:-I have observed that for some unknown reasons the meta tags get automatically deleted. If you see no metas in your buster theme than simple copy paste the code below just under <b:include data='blog' name='all-head-content'/>
<link href='mailto:Your Email Address Goes Here' rev='made'/> <b:if cond='data:blog.url == data:blog.homepageUrl'> <meta content='Add your blog description here. Maximum Characters (including spaces) should be 120' name='Description'/></b:if> <meta content='Add your keywords here, Maximum Characters (including spaces) should be 200' name='keywords'/> <meta content='Write your name here' name='Author'/>
Once done, hit Save. You have now successfully optimized your Buster Theme by allowing search engines to crawl your template smoothly.
For Details on how to choose good keywords and how to write effective keywords and description, read the
I have emailed the MBT Buster Theme Download File to all MBT subscribers. Those who haven’t subscribed yet may read the instructions below,
Previously I used to offer open downloads but many bloggers and web owners misused this availability by directly linking to MBT download link. Due to bandwidth issues I can now offer free downloads of blogger resources to MBT Subscribers only. If you want to download MBT Buster Theme then you will only need to fill up the simple Email subscription form below, Do let me know in the comment box below after you have subscribed and activated MBT email updates. Make sure you include the email ID with which you subscribed. To prevent spam, write your Email ID in the comment box the following way,
If you use Gmail then write it as xyz G mail despite writing as xyz@gmail.com
If you use Hotmail then write it as xyz H mail and for Yahoo write as xyz Y mail
If you use any other Email ID then follow the same pattern
The moment I receive your email and see that you have subscribed and activated MBT Feed Updates, I will email you the Download File.
By becoming MBT Subscriber you are opening the doors for unlimited free downloads of rare Blogger Resources.
Fortunately we are back again with a new set of social bookmarking icons that are oval in shape and have a window like reflection. This set consists of a total seven social media icons which includes Facebook, Stumbleupon, Digg, Technorati, Twitter, Delicious and as usual an RSS Icon. The downloadable file consists of png images with different sizes i.e 128px by 128px, 64px by 64px and 48px by 48px all compressed into a winrar file.
Below is an embeddable Web Colour Chart most probably known as hexadecimal colour chart. The chart below consists of a total 216 hexadecimal colours which are well interpreted by all browsers and are compatible in every sense. The Colour chart below uses a combination of well scripted HTML and CSS to produce a mouse over effect when you hover your cursor over the table cells. You can use this chart for both free and commercial purpose. You can use these colour codes/hexadecimal values for editing your Blogspot, Wordpress or web templates. They are web safe colours so they look the same in any browser. You can embed this Colour Chart or table in your websites or weblogs. You only need to subscribe to this blog by filling up the simple Subscription form on the sidebar. Once you have subscribed kindly inform me by using the comment box below and include in it the email address with which you subscribed. To avoid spam robots, write your email address as follow,
If you use hotmail write like this –> xyz hot mail
If you use gmail write like this –> xyz g mail
where xyz is your email ID. If you use any other emailing service then simply follow the above pattern.
The moment I receive your comment, I will send you the embeddable code to this chart.
CSS Web Colour Chart
#FFFFFF
#FFFFCC
#FFFF99
#FFFF66
#FFFF33
#FFFF00
#FFCCFF
#FFCCCC
#FFCC99
#FFCC66
#FFCC33
#FFCC00
#FF99FF
#FF99CC
#FF9999
#FF9966
#FF9933
#FF9900
#FF66FF
#FF66CC
#FF6699
#FF6666
#FF6633
#FF6600
#FF33FF
#FF33CC
#FF3399
#FF3366
#FF3333
#FF3300
#FF00FF
#FF00CC
#FF0099
#FF0066
#FF0033
#FF0000
#CCFFFF
#CCFFCC
#CCFF99
#CCFF66
#CCFF33
#CCFF00
#CCCCFF
#CCCCCC
#CCCC99
#CCCC66
#CCCC33
#CCCC00
#CC99FF
#CC99CC
#CC9999
#CC9966
#CC9933
#CC9900
#CC66FF
#CC66CC
#CC6699
#CC6666
#CC6633
#CC6600
#CC33FF
#CC33CC
#CC3399
#CC3366
#CC3333
#CC3300
#CC00FF
#CC00CC
#CC0099
#CC0066
#CC0033
#CC0000
#99FFFF
#99FFCC
#99FF99
#99FF66
#99FF33
#99FF00
#99CCFF
#99CCCC
#99CC99
#99CC66
#99CC33
#99CC00
#9999FF
#9999CC
#999999
#999966
#999933
#999900
#9966FF
#9966CC
#996699
#996666
#999933
#999900
#9933FF
#9933CC
#993399
#993366
#993333
#993300
#9900FF
#9900CC
#990099
#990066
#990033
#990000
#66FFFF
#66FFCC
#66FF99
#66FF66
#66FF33
#66FF00
#66CCFF
#66CCCC
#66CC99
#66CC66
#66CC33
#66CC00
#6699FF
#6699CC
#669999
#669966
#669933
#669900
#6666FF
#6666CC
#666699
#666666
#666633
#666600
#6633FF
#6633CC
#663399
#663366
#663333
#663300
#6600FF
#6600CC
#660099
#660066
#660033
#660000
#33FFFF
#33FFCC
#33FF99
#33FF66
#33FF33
#33FF00
#33CCFF
#33CCCC
#33CC99
#33CC66
#33CC33
#33CC00
#3399FF
#3399CC
#339999
#339966
#339933
#339900
#3366FF
#3366CC
#336699
#336666
#336633
#336600
#3333FF
#3333CC
#333399
#333366
#333333
#333300
#3300FF
#3300CC
#330099
#330066
#330033
#330000
#00FFFF
#00FFCC
#00FF99
#00FF66
#00FF33
#00FF00
#00CCFF
#00CCCC
#00CC99
#00CC66
#00CC33
#00CC00
#0099FF
#0099CC
#009999
#009966
#009933
#009900
#0066FF
#0066CC
#006699
#006666
#006633
#006600
#0033FF
#0033CC
#003399
#003366
#003333
#003300
#0000FF
#0000CC
#000099
#000066
#000033
#000000
Web developers and bloggers are requested to attach a link-back to this blog if they wish to share this chart with their readers.
I would love to know how you liked it. Any comment is appreciated.
Keeping the posts unique in every way should be the aim of every blogger. The Number list (ol) and Bullet list (ul) is an important part of a good article. To change the entire look and feel of these lists we will use simple CSS effects to bring about a change in bullets and number style on mouse hover. This tutorial consists of two very interesting parts,
The biggest problem faced by majority of newbie bloggers and web developers is editing their templates. And the reason for this is lack of awareness with browser languages like CSS, XML, HTML, JavaScript etc. There are several websites online that have tutorials in these fields and one of such websites is 
Fortunately we are back again with a new set of social bookmarking icons that are oval in shape and have a window like reflection. This set consists of a total seven social media icons which includes 
Below is an embeddable