For those users who implemented my 1.00 version of this modification, here's what you need to do to upgrade. The upgrade includes changes to address the login issue that some users where experiencing and validates the the code to comply with XHTML standards. (That's geek-speak that means it makes the code compatible across all browser types.)
Upgrade Instructions
Upgrading is not all that hard, you just need to be a little careful. All that needs to be done is move a few of bits of code around, so read closely. Other then that, you shouldn't have too much trouble. Some of you have already taken these steps. Open your
postbit_legacy template.
Step 1.
Take the code in
red and move it to the bottom of your
headinclude template. Delete the opening and closing
<head></head> tags.
Code:
<!-- BEGIN AJAX CONTENT -->
<head>
<link rel="stylesheet" type="text/css" href="postbit_tabs/tabcontent.css" />
<script type="text/javascript" src="postbit_tabs/tabcontent.js">
/***********************************************
* Tab Content script v2.2- ? Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
</head>
Step 2.
Reverse the order of each instance of
$post[postid]tab#, so that it reads
tab#$post[postid] instead. Also reverse the order of
$post[postid]postbittabs so that
postbittabs comes first.
TIP: The find feature and CTRL+V (Paste) come in handy when finding and replacing lines of code.
Code:
<div id="$post[postid]postbittabs" class="djdot">
<ul>
<li><span title="View Tab 1"><a href="#" rel="$post[postid]tab1" id="selected"> </a></span></li>
<li><span title="View Tab 2"><a href="#" rel="$post[postid]tab2"> </a></span></li>
<li><span title="View Tab 3"><a href="#" rel="$post[postid]tab3"> </a></span></li>
<li><span title="View Tab 4"><a href="#" rel="$post[postid]tab4"> </a></span></li>
<li><span title="View Tab 5"><a href="#" rel="$post[postid]tab5"> </a></span></li>
</ul>
<br style="clear: left" />
</div>
Step 3.
Do the same for each TAB CONTENT block. Reverse the order of
$post[postid]tab#, so that they read
tab#$post[postid] instead.
Code:
<!--TAB 1 CONTENT -->
<div id="$post[postid]tab1" class="tabcontent">
<div class="info">Tab 1 Content:Block A</div>
<div class="info">Tab 1 Content:Block B</div>
<div class="info">Tab 1 Content:Block C</div>
</div>
Step 4.
Reverse the order of
$post[postid]postbittabs to
postbittabs$post[postid]. Change
true to false.
Code:
<script type="text/javascript">
var mytabs=new ddtabcontent("$post[postid]postbittabs")
mytabs.setpersist(true)
mytabs.setselectedClassTarget("link")
mytabs.init()
</script>