Wednesday, January 7, 2009
 
Careers
Sitemap
Contact us
 
   
 
 
 
 
 
 
 
   
Home arrow Other Links arrow TabDemo
TabDemo
Other Links - Other Links
Joomla! Tab System
We use the default Joomla! tab functions to create tabs systems.

Basically the guys at joomla have made things very easy and created the tab system code within the 'mostabs' function, so all we need to do is just reference the 'startPane', 'startTab' and 'endTab', 'endPane' fucntions to begin and finish the tabs for each piece of content.

Tab One

Serious relevance. The promise and performance of CRM that is mobile.

Tab Two

You must have a mobile with a browser, a GPRS connectivity, and work to do. Way to go!



You can have as many tabs as you want within the tab Pane and you can also nest the tab pages within parent tab pages as you can see from this example:

Nested One

Nested Three

put the content of your third tab here

Nested Four

put the content of the fourth tab here

Nested Two

Nested Five

put the content of the fifth tab here

Nested Six

put the content of the sixth tab here

Nested Tab Problem:

Now you may have noticed that we blanked out the second argument on the following code:

This is because we want the tabs to be nested and if that second argument exists they will not format properly, so we simply blank out the second argument and that solves the following problem:

Problem One

Problem Three

put the content of your third tab here

Problem Four

put the content of the fourth tab here

Problem Two

Tab Five

put the content of the fifth tab here

Problem Six

put the content of the sixth tab here



However, this again will cause a slight problem in that the argument we removed is actually the id of that tab page and if we remove it, it means the <div> tag's id will be null or missing and this causes validation errors.

So, what you do is create a new function called 'startNestedTab()', which looks like this:

What this extra function does is remove the id from the <div> tag allowing us to have valid nested tabs.  This extra function would go into the joomla.php file around line number 4365, as long as its beside the other tabs function code you'll always know where to find it.


// instantiate new tab system
$tabs = new mosTabs(1);

// start nested tab pane
$tabs->startPane("NestedmainPane");
// start first nested main tab
$tabs->startNestedTab("Nested One");

// start new nested tabs pane
$tabs->startPane("NestedPaneTwo");

//First of first tab
$tabs->startTab("Nested Three", "nested-three");

echo 'put the content of your third tab here';

$tabs->endTab();

//Second of first tab
$tabs->startTab("Nested Four", "nested-four");

echo 'put the content of the fourth tab here';

$tabs->endTab();

// end tab pane
$tabs->endPane();
$tabs->endTab();

// this is the second main nested tab pane
$tabs->startNestedTab("Nested Two");
// this is the second main nested tab
$tabs->startPane("NestedPaneThree");

//First of third tab system
$tabs->startTab("Nested Five", "nested-five");

echo 'put the content of the fifth tab here';

$tabs->endTab();

//Second tab of third system
$tabs->startTab("Nested Six", "nested-six");

echo 'put the content of the sixth tab here';

$tabs->endTab();

$tabs->endPane();
$tabs->endTab();
// end the first main tab pane
$tabs->endPane();

Adding the tabs:

There are a few methods of adding the tab code -any of the following:

  • Create a module and assign it to any of the module positions.
  • Create a component and use it within that component to display some content.
  • Hardcode it directly into the pages of your components or modules.
  • You can use the mambot from Run Digital, we will cover using this below.
If you decide to use the Run Digital mambot you can create php pages on the server and include them using the following code ( without the sapce after the first brace { and before the second brace } ):

{ rdaddphp file=templates/yourtemplate/tabs.php }

This of course is assuming that you placed the php file within your template folder, you can substitute the url to the php page and the name of the php page to wherever and whatever you called or placed them. 

Now all you need to do is set up some module positions within the already created tab pages and then assign your modules to them and hey presto you now have modules assigned within your tab system placed on your content pages.

 
 
 
 
  Copyright 2008 CRMIT Solutions