Hacks
Table of Contents
|
dhtml tabview
easy, instant dhtml tabview
get it here: http://www.widgetbox.com/widget/dhtmltabview
blogspot / blogger dhtml tabview
#
# do NOT copy anything started with #
#
# view your blogspot html source
# note the widget ID that you want to build into tabview
#
# copy and paste this code right after </title> so that it looks like this:
<title><data:blog.pagetitle/></title>
<!--// dhtml tabview blogspot hack begins. (c) 2008 dennyhalim.com //-->
<link href='http://statics.mypolaris.com/tabcontent.css' rel='stylesheet' type='text/css'/>
<script src='http://statics.mypolaris.com/tabcontent.js' type='text/javascript'/>
<!--// dhtml tabview blogspot hack end. (c) 2008 dennyhalim.com //-->
# you can setup your own css if you like.
#
# Add a Page Element
# choose 'HTML/JavaScript'
# paste this code into it:
<ul id="posttabs" class="shadetabs">
<li class="selected"><a href="#" rel="LinkList2">Features</a></li>
<li><a href="#" rel="Feed2">Posts</a></li>
<li><a href="#" rel="Feed1">Comments</a></li>
<li><a href="#" rel="Profile1">Me</a></li>
<li><a href="http://it.dennyhalim.com/" title="get this blogspot dhtml tabview hack">!</a></li>
</ul>
# replace everything in rel="your widget ID here"
# note the ul id.
# klik Save
# move this widget right before all your tabbed widgets
#
# Add a Page Element again
# choose 'HTML/JavaScript' again
# paste this code into it:
<script type="text/javascript">
//activate the dhtml tab
var myposts=new ddtabcontent("posttabs") //enter ID of Tab Container
myposts.setpersist(true) //toogle persistence of the tabs' state
myposts.setselectedClassTarget("link") //"link" or "linkparent"
myposts.init()
</script><noscript><a href="http://wiki.dennyhalim.com/blogspot:hacks" title="get this blogspot hack">this dhtml tabview blogspot hack require javascript enabled browser</a></noscript>
# Save
# move this widget to the most bottom of your blogspot
# repeat it to build more tabviews from more widgets
# Save all changes
# Finish
slideshow
<b:widget id='Slideshow1' locked='false' title='TITLE YOU ENTERED IN
THE WIDGET' type='Slideshow'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<div class='slideshow-container' expr:id='data:widget.instanceId +
"_slideshow"' style='width:300px; height:200px;'> # change the width and height to suite your needs.
<span class='slideshow-status'>Loading...</span>
</div>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
wah berguna banget nih tutornya..
I'm going to try this, thank You
Post preview:
Close preview