Index: lams_central/src/web/template/js/tabcontroller.js
===================================================================
diff -u -r855a82a382534668d78443c7e29f7e2f95925bcd -r6334676846fe08ede1032c36db545c4cee622548
--- lams_central/src/web/template/js/tabcontroller.js	(.../tabcontroller.js)	(revision 855a82a382534668d78443c7e29f7e2f95925bcd)
+++ lams_central/src/web/template/js/tabcontroller.js	(.../tabcontroller.js)	(revision 6334676846fe08ede1032c36db545c4cee622548)
@@ -5,11 +5,14 @@
 var themeName = "aqua";
 var currentTab = "";
 
+//added comments to show how to add a new tab, we'll call the new tab 'x'
 function initTabs(){
-	//put all the tab contents in an array
+	//put all the tab contents layers in an array
 	tabsContents.push(document.getElementById('content_b'));
 	tabsContents.push(document.getElementById('content_a'));
 	tabsContents.push(document.getElementById('content_i'));
+	//to add a new tab add a new line here:
+	tabsContents.push(document.getElementById('content_x'));
 	
 	//position the advanced (a) and instructions (i) layers over the basic (b) layer
 	var bTabC_x = findPosX(tabsContents[0]);
@@ -69,7 +72,7 @@
 	}	
 }
 
-
+//call this function to show a tab (and hide all the others)
 function showTab(tabId){
 	if (currentTab == tabId){
 		return;
@@ -79,18 +82,36 @@
 	
 	selectTab(tabId);
 
+//note  you need to de-select the tabs you are not showing, including the new one:
 	if(tabId == "i"){
 		deSelectTab("a");
 		deSelectTab("b");
+		//e.g.:
+		//deSelectTab("x");
 	}else if(tabId=="a"){
 		deSelectTab("i");
 		deSelectTab("b");
-	}else{
+		//deSelectTab("x");
+	}else if(tabId="i"){
 		deSelectTab("i");
 		deSelectTab("a");
+		//deSelectTab("x");
 	}
+	//add new if to select the new tab:
+	/*
+	else if(tabId="x"){
+		deSelectTab("i");
+		deSelectTab("a");
+		deSelectTab("b");
+	}
+	*/
 	
-	//sort out the content
+	
+	*/
+	
+	//sort out the content layers:
+	//note: to add a new tab , you must also add a new content layer! a reference to which is created in innitTabs.
+
 	var contentId = "content_"+tabId;
 	for(var i=0; i < tabsContents.length; i++){
 		if(tabsContents[i].id==contentId){
Index: lams_central/src/web/template/lams_example_tool/author_page_basic.html
===================================================================
diff -u -r855a82a382534668d78443c7e29f7e2f95925bcd -r6334676846fe08ede1032c36db545c4cee622548
--- lams_central/src/web/template/lams_example_tool/author_page_basic.html	(.../author_page_basic.html)	(revision 855a82a382534668d78443c7e29f7e2f95925bcd)
+++ lams_central/src/web/template/lams_example_tool/author_page_basic.html	(.../author_page_basic.html)	(revision 6334676846fe08ede1032c36db545c4cee622548)
@@ -73,6 +73,27 @@
 	</table>
 
 </td>
+<!--  to add a new tab, add a new tab table here.
+note: the ID must be different to the other IDs in teh document, here we hae used x so the 
+ left image = tab_left_x
+ centre h-ref = x 
+ right image = tab_right_x 
+ -->
+<!-- the tab:
+    <td valign="bottom">
+	
+	<table border="0" cellspacing="0" cellpadding="0">
+	  <tr>
+		<td ><a href="#" onClick="showTab('i');return false;"><img border="0" src="../images/aqua_tab_left.gif" width="8" height="22" id="tab_left_i"   name="tab_left_x" /></a></td>
+		<td class="tab tabcentre" width="90" id="tab_tbl_centre_i"  onClick="showTab('i');return false;" ><a href="#" onClick="showTab('i');return false;" id="x" >Instructions</a></td>
+		<td ><a href="#" onClick="showTab('i');return false;"><img src="../images/aqua_tab_right.gif"  width="9" height="22" border="0" id="tab_right_i"  name="tab_right_x"/></a></td>
+	  </tr>
+	</table>
+
+</td>
+END new tab comments, see also ../tabController.js for additional changes required.
+-->
+
   </tr>
 </table>
     <!-- end tab buttons -->