I love these tags, my theme isn't the best to have one, though. I'll put this out there for future reference, and to share with everyone. This is simplest if you have at least a basic, beginner knowledge of CSS & HTML, if not, go to w3schools.com and browse through.
Go into your blog's HTML. You should know how to do this. Honestly.
Locate the </style> tag. Paste this code above it, in with the CSS.
#updates {
text-align: center;
font-size: 11px;
position:fixed;
left:30px;
top:-183px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
z-index:999;
}
#updates:hover {top:0px;}
#update {
border-right-style:double;
border-bottom-style:double;
border-left-style:double;
border-width:3px;
border-color:#aaa;
font-size:9px;
padding: 5px 0 5px 0;
background: #fff;
width:200px;
height:170px;
z-index: 9999;
}
#updatestab {
border-top-style:none;
border-right-style:none;
border-bottom-style:none;
border-left-style:none;
border-color:#aaa;
text-align: center;
height:10px;
padding: 6px 0 8px 0;
background:#fff;
border-bottom-left-radius: 5px;
-moz-border-radius-bottomleft: 5px;
-webkit-border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-right-radius: 5px;
width: 200px;
}
Now, find the <body> tag (it should be somewhere below the </style>). Paste the following right after the <body> tag. You edit this yourself to display what you want to be visible on your blog.
<div id="updates">
<div id="update"> <center>
<p> [THIS IS WHERE YOU ADD THE PHOTOS AND INFORMATION TO DISPLAY INSIDE THE TAB]
</center></div>
<div id="updatestab">
[THIS IS WHERE YOU ADD THE PHOTO AND/OR TEXT THAT YOU ROLL OVER TO DISPLAY THE TAB. BELOW IS AN EXAMPLE OF A GOOD SIZED IMAGE, I PICKED A TEENY TINY TARDIS, BUT IT CAN BE ANYTHING]
