Simple trick to implement it..
1. Go to (Layout->Edit HTML) and find this code </head> and paste the following code above it..Change 'hi geng how are u' to your words..Easy
<SCRIPT language='JavaScript'>alert("hi geng how are u");</SCRIPT>
-
-
0
comments
Simple trick to implement it..
1. Go to (Layout->Edit HTML) and find this code </head> and paste the following code above it..Change 'hi geng how are u' to your words..Easy
[ Read More ]
Simple trick to implement it..
1. Go to (Layout->Edit HTML) and find this code </head> and paste the following code above it..Change 'hi geng how are u' to your words..Easy
-
-
0
comments
Here How to add recent posts with thumbnails..
Source from Kanthi
[ Read More ]
Here How to add recent posts with thumbnails..
1. Go to (Layout->Page Elements->Add A Gadgets->HTML) and paste the below codes..
Change http://yourblog.blogspot.com/ to your blog url...
Other thing,you can costumize according to your blog..
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 298;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#000000";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 5;
home_page = "http://yourblog.blogspot.com/";
</script>
<script src="http://malaysiaforunity.comxa.com/misc/recentposts_thumbnail.js" type="text/javascript"></script>
-
-
1 comments
Here how to make page peel effect
There are two method you can try...
Method 1 (Source from CssReflex)
[ Read More ]
1. Go to (Layout-Edit HTML) and find this code </head>
2. Paste the below code just after <body>
<div id='pageflip'>
<a href='http://feeds.feedburner.com/naeemnur'><img alt='' src=
'http://www.wallheaven.com/page_flip.png'/></a>
<div class='msg_block'></div>
</div>
Method 2
1. As always go to (Layout-Edit HTML) and find this code </head> and paste below codes above it..
<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://www.wallheaven.com/subscribe.png) no-repeat right top;
}
</style>
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
//Page Flip on hover
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({
width: '307px',
height: '319px'
}, 500);
} , function() {
$("#pageflip img").stop()
.animate({
width: '50px',
height: '52px'
}, 220);
$(".msg_block").stop()
.animate({
width: '50px',
height: '50px'
}, 200);
});
});
</script>
2. Then find this code <body> and paste the below code after it.
Change http://feeds2.feedburner.com/firdausforlife to your own feedburner
<div id='pageflip'>
<a href='http://feeds2.feedburner.com/firdausforlife'><img alt='' src='http://www.wallheaven.com/page_flip.png'/></a>
<div class='msg_block'></div>
</div>
-
-
0
comments
I get this hacks from Blognarol..This hacks is very interested to be..Here how to do it..
1.The first step that we need to do are to put the following Code Between <head> and </head> of your Template..
2. Second step are go to (Layout->Page Elements->Add A gadget->HTML) and add below codes..
3. Replace "Title Here" with your Widget Title and Replace "Content Here" with your own title and content..Example As below
[ Read More ]
I get this hacks from Blognarol..This hacks is very interested to be..Here how to do it..
1.The first step that we need to do are to put the following Code Between <head> and </head> of your Template..
<!-- flooble Expandable Content header start -->
<script language="javascript">
// Expandable content script from flooble.com
// Promoted by bloganol.blogspot.com
// For more information please visit:
// http://www.flooble.com/scripts/expand.php
// Copyright 2002 Animus Pactum Consulting Inc.
//----------------------------------------------
var ie4 = false; if(document.all) { ie4 = true; }
function getObject(id) { if (ie4) { return document.all[id]; } else {
return document.getElementById(id); } }
function toggle(link, divId) { var lText = link.innerHTML; var d =
getObject(divId);
if (lText == '+') { link.innerHTML = '−'; d.style.display = 'block'; }
else { link.innerHTML = '+'; d.style.display = 'none'; } }
</script>
<!-- flooble Expandable Content header end -->
<!-- flooble Expandable Content box start -->
<div style="border: 1px solid #000000; padding: 0px; background: #EEEEEE;
"><table border="0" cellspacing="0" cellpadding="2" width="100%"
style="background: #000000; color: #FFFFFF; "><tr><td>Title Here</td><td
align="right">
[<a title="show/hide" id="exp1209796610_link" href="javascript:
void(0);" onclick="toggle(this, 'exp1209796610');"
style="text-decoration: none; color: #FFFFFF; ">−</a>]</td></tr></table>
<div id="exp1209796610" style="padding: 3px;">Content Here</div>
</div><noscript><a href="http://www.flooble.com/scripts/expand.php">this
expanable content box is made using a
free javascript from flooble</a> | <a href="http://perplexus.info/">logic
problems, math puzzles</a>
</noscript>
<script language="javascript">toggle(getObject('exp1209796610_link'),
'exp1209796610');</script>
<!-- flooble Expandable Content box end -->
-
-
1 comments
How to Create Tabbed View Content Box? Thanks for LawnyDesigns for this cool hacks and modified by me to make it more simple..
4. Then, add this css codes on top of your template(see my example picture)
[ Read More ]
How to Create Tabbed View Content Box? Thanks for LawnyDesigns for this cool hacks and modified by me to make it more simple..
1. The first step you need to do are go to (Layout->Edit HTML) and find the code below..
</head>
2. Secondly, you need to open and copy the java script codes and paste it into the red code below and paste all this code below before
</head>...
<script type='text/javascript'>
//<![CDATA[
document.write('<style type="text/css">.tabber{display:none;}<\/style>');
/* paste the full contents of your tabber script here */
//]]>
</script>
3. After that, find this <div id='sidebar-wrapper'>just below there add the following code
<div class='tabber'>
<b:section class='tabbertab' id='tab1' maxwidgets='1'/>
<b:section class='tabbertab' id='tab2' maxwidgets='1'/>
<b:section class='tabbertab' id='tab3' maxwidgets='1'/>
</div>
<Variable name="tbbxbgcolor" description="Tab box Background Color" type="color" default="#f8f8f8" value="#f8f8f8">
<Variable name="tbbxbrcolor" description="Tab box Border Color" type="color" default="#dcdcdc" value="#dcdcdc">
<Variable name="tbbxcolor1" description="Tab box Color 1" type="color" default="#ffffff" value="#ffffff">
<Variable name="tbbxcolor2" description="Tab box Color 2" type="color" default="#5588aa" value="#5588aa">
/* start tab styles */
.tabberlive{
margin:0;
padding:5px;
clear:both;
background:$tbbxbgcolor;
border:1px solid $tbbxbrcolor;
}
.tabbernav {
margin:0;
padding: 3px 0;
border-bottom: 1px solid $tbbxbrcolor;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:bold;
}
.tabbernav li {
list-style:none;
margin:0;
display:inline;
}
.tabbernav li a {
padding:3px 0.5em;
margin-right:1px;
border:1px solid $tbbxbrcolor;
border-bottom:none;
background:$tbbxcolor2;
text-decoration:none;
color:$tbbxcolor1;
}
.tabbernav li a:hover {
color:$tbbxcolor2;
background:$tbbxcolor1;
border-color:$tbbxbrcolor;
text-decoration:none;
}
.tabbernav li.tabberactive a,
.tabbernav li.tabberactive a:hover {
background:$tbbxcolor1;
color:$tbbxcolor2;
border-bottom: 1px solid $tbbxcolor1;
}
.tabberlive .tabbertab {
padding:5px;
border:1px solid $tbbxbrcolor;
border-top:0;
background:$tbbxcolor1;
}
.tabberlive .tabbertab h2,
.tabberlive .tabbertabhide {
display:none;
}
.tabbertab .widget-content ul{
list-style:none;
margin:0 0 10px 0;
padding:0;
}
.tabbertab .widget-content li {
border-bottom:1px solid $tbbxbrcolor;
margin:0 5px;
padding:2px 0 5px 0;
}
/* end tab styles */
4.Lastly, go to Layout->Fonts and colors if you want to change the colors..doNE!
p/s Example in page eif you are success to create it..
