VIDEO TEMPLATE 2

Demo | Download

VIDEO TEMPLATE

Demo | Download

ElegantRed Free Premium Blogger Template

	Template Name : ElegantRed
	Original Designer : Elegant WP Themes
	Bloggerize by : Free Blogger Template
	Demo Url : CLICK HERE
	Download : ElegantRed.zip

FBTMaG V1 Free Premium Blogger Template

	Template Name : FBTMaG V1
	Design by : Free Blogger Template
	Demo Url : CLICK HERE
	Download : Release Page

Box Office

Demo                                       Download

SimpleVideoblog

DemoDownload

Free Blogger Templates LIST

btemplatesbloggerstylesbietemplates99bloggertemplatesblogspottemplatesblogcrowdsprobloggertemplatesblogger-templates.bloggerstop.netzoomtemplatetemplate-godownbloggertemplatesblogbloggertemplateblogtheblogtemplatesbloggerthemesoasisvdantearaujobloggertemplatesfreenewbloggertemplatesfreebloggertemplatesanshuldudejabloggertemplatescahayabirubeautifultemplatesbloggertemplateplaceskincorneripietoonblogtemplate4utemplatesblockbloggerblogtemplatesthemecraft.netfreebloggertemplatetemplatesbloggerfalconhivebloggertemplatesgeniebthemedeluxetemplatesblogspot-templatesallblogtools

Divide Blogger Labels/Categories widget into Two Columns

Previously you only have single column for Labels. It is good for few labels upto 5 to 10. But if you have more labels, say 20 - 30 then the list goes very long. How about having two or more columns for labels as shown in the image. It will take less space and looks good.


To do this go to Layout > Edit HTML > Expand Widget Templates.


We need to find the Label id first. Press CTRL F and look for id='Label
Your Label id may be id='Label1 or id='Label2.

Now look for the following code
]]></b:skin>

Now add following code before the ]]></b:skin>

#Label1 ul li{
float: left;
width: 45%;
}

.,

Remember Label1 is your label id. If your label id is Label2 then use following code instead of above

#Label2 ul li{
float: left;
width: 45%;
}

.,

Now click Save Template

Width will depend on how many columns you want included, and not always accurate, because the widget will inherit the label from the sidebar padding schedule (. Sidebar ul li or something similar). In this case, 45% is good for the two columns become 3 columns, you can walk along with 30 or 33%)

Make a snow effect on the mouse cursor on the blog

STEP #1 Log in to Blogger, go to Layout

Add a Gadget of HTML/JavaScript type. 

Then add this code in to it:.

<script type='text/javascript'>
// <![CDATA[
var colour="black";
var sparkles=100;

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="3px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="3px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";

star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}

}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {


tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>

Now click Save

 you can change :

var colour="black";

• Hex Color Code Chart and Generator

• color charts

• Html Color Codes Generator