Getting Started with ApPHP Tabs (v3.0.0 or above)

Common Notices

• Please, use a $tabs->Debug(true); before you say "Why Nothing Works ?!"
• Use standard opening and closing tags <html>...</html>. Enclose everything else in these otherwise your page may display incorrectly.
• Do not place ApPHP Tabs code inside another HTML Form: <form>...</form>

Getting Started

Step 1. Creating Tabs object

Make sure you define a valid relative (virtual) path to the tabs.class.php file.
## *** include tabs class
define ("TABS_DIR", "");
There are two classes in this package: the Tabs class creates the tabs structure and the Tab class is used for each tab. First you must create a Tabs object.
## *** create tabs object
$tabs = new Tabs();

Step 2. General Settings

First you have to define a method for data submission type. You may write "get", "post" or "ajax".
## *** set form submission type: "get", "post" or "ajax"
If you want to use several independently configured Tabs objects on a single page, you should set unique numeric (integer-valued) identifier for this Tabs object.
## *** set id
ApPHP Tabs support embedded CSS styles: "xp", "grey", "light-green", "dark-red", "black" and "g-style". You can choose style using function "SetStyle". Select appropriate style to suit your needs.
## *** set CSS style
The tabs can be displayed from left to right ('ltr') or from right to left ('rtl'):
## *** set Tabs direction (ltr or rtl)
There is also an option to display a caption above the tabs.
## *** set Tabs caption
$tabs->SetCaption("ApPHP Tabs v".$tabs->Version());
Define whether the debug mode is turned on or not.
## *** show debug info - false|true
There are three possible ways of displaying child tabs. You can use function 'SetChildTabsType' to choose one. Option "dropdown" means that child tabs will be displayed in a dropdown menu. Option "tabs" means that child tabs will be displayed in the same way as the parent tabs are displayed. Option "links" which is selected by default means that child tabs will be displayed in a manner similar to hyperlinks.
## *** set mode of displaying child tabs
You are free to save GET-parameters that were used to get access to the page (like: my_page.php?act=34&id=56 etc.). Then they will not be lost when you select another tab.
## *** set variables that were used to get access to the page
This method defines whether selected tabs are clickable.
##  *** allow refreshing selected tabs
You can use an anchor to navigate to the tabs after a tab is clicked.
##  *** use anchor
The anchor can be created automatically.
##  *** create anchor automatically
If the previous option is set to false, you have to create the anchor manually by putting this line anywhere in the HTML-code.
<!-- create anchor manually -->
<a name='tabs'></a>

Step 3. Adding tabs.

Now you can add tabs by using the method 'AddTab'. It takes three arguments:
  • Tab's caption (obligatory)
  • File associated with this tab (optional)
  • Icon associated with this tab (optional)
  • Tab's tooltip (optional)
The method returns Tab object which supports 'AddTab' method as well so you can create multilevel tabs.
## *** add tabs
## Example 1: $tabs->AddTab("Title");
## Example 2: $tabs->AddTab("Title", "text.txt");
## Example 3: $tabs->AddTab("Title", "text.txt", "icon.gif");
## Example 4: $tabs->AddTab("Title", "text.txt", "icon.gif", "tooltip");
$son = $tabs->AddTab("Son's Title #1");
$son2 = $tabs->AddTab("Son's Title #2");
$grandson1=$son->AddTab("Grandson's Title #1");
$grandson2=$son->AddTab("Grandson's Title #2", "examples/code.php");
You may associate tabs not with files but with HTML code snippets.
## *** associate tabs with HTML code snippets
<span onclick='alert(\"How do you do?\")'>HTML</span></i> code snippet</b>");
A tab may open its file in a new window.
## *** open a tab in a new window
You can also set a tooltip for a tab.
## *** set a tooltip for a tab
$son->SetTooltip("Child tab's tooltip");

Step 4. Visual settings.

Now you may change appearance of the container where content is displayed. You may set its width (in pixels, inches, points, per cent or "auto"):
## *** set container's width
Its height (in pixels, inches or "auto"):
## *** set container's height

Step 5. Choosing default tabs.

Both Tabs and Tab objects have a 'SetDefaultTab' method. It defines which of its sub-tabs will be selected by default when you click on it.
## *** choose a default tab

Step 6. Disabling tabs.

Every tab may be disabled.
## *** disable a tab

Step 7. Drawing Tabs

Now you can draw tabs on the screen.
## *** display tabs
Create Your Free Account
Please remember that this information is essential to use our services correctly.
After creating the account you will be able to download all of our FREE products.
Fields marked with * are mandatory

Please send me information about updates, new products, specials and discounts from ApPHP!
We recommend that your password should be at least 6 characters long and should be different from your username/email. Please use only letters of the English alphabet to enter your name.

Your e-mail address must be valid. We use e-mail for communication purposes (order notifications, etc). Therefore, it is essential to provide a valid e-mail address to be able to use our services correctly.

All your private data is confidential. We will never sell, exchange or market it in any way. Please refer to Privacy Policy.

By clicking "Create Account", you are indicating that you have read and agree to the ApPHP Terms & Conditions.

Quick Registration with: Facebook / Google