I was very excited to use expandable content in my blog.It searched it for an hours and finally found it on the site named Flooble.This site contains multiple of Blogger Scripts,Blogger hacks and Many More.i think this is the greatest Hacks on this Site.They said they spent Full Two days to Build This Script.Now without wasting the time lets start creating This Hack on your blog.
| The installation has Mainly two Parts . First is to put the Following Code Between <head> and </head> of your Template.Once you Paste the code in your Template you donot need to paste it again and again when you add more widgets. |
<!-- flooble Expandable Content header start -->And the second step is to Paste the following code to Your blog by adding a New page Element.But remember Don't write The title in when you add the Code.
<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 -->
In the above code Replace Title Here with your Widget Title and Replace Content Here with your Widget Code and see how my Livetraffic Code looks Like.
<!-- flooble Expandable Content box start -->
<div style="border: 1px none #000000; padding: 0px; background: #ffffff;
"><table border="0" cellspacing="0" cellpadding="2" width="100%"
style="background: #e6e6e6; color: #000000; "><tr><td>Live Traffic
Feed</td><td align="right">
[<a id="exp1209792360_link" style="text-decoration: none; color:
#000000; " href="javascript: void(0);" title="show/hide"
onclick="toggle(this, 'exp1209792360');">−</a>]</td></tr></table>
<div id="exp1209792360" style="padding: 3px;">
<script
src="http://feedjit.com/serve/?bc=FFFFFF&tc=494949&brd1=ffffff&lnk=494949&hc=336699&ww=180"
type="text/javascript"></script><noscript><a
href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript></div>
</div><noscript>
<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://www.flooble.com/scripts/">free javascripts</a>
</noscript>
<script language="javascript">toggle(getObject('exp1209792360_link'),
'exp1209792360');</script>
<!-- flooble Expandable Content box end --></noscript>
Not satisfied?Then Visit Flooble Expandable Content Script Creator page.
comments
4 Responses to "Expandable Content Script for Blogger"May 26, 2008 at 3:41 PM
thank you i learn so many things form ur blog and ably it in mine
January 6, 2009 at 9:58 AM
I am sorry to say that you need to explain details this thing.
May 6, 2009 at 8:21 PM
really awesome trick now i saved a lot of space on my blog
if you want to see it
here TIPS-BOX Demo
July 1, 2009 at 5:30 AM
I don't understand
Speak Your Mind
Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!