Joomla Tabs Component

Joomla Tabs examples
Joomla Tabs/Likno Web Tabs Builder features

The Likno Web Tabs Joomla add-in & component combination has been developed to let you create stylish, feature-rich tab controls for your sites! You can fully customize your tab controls by adding your own non-joomla content with external or internal links, html-rich content, colors, borders, effects, designs of your choice and many more!

The solution consists of a combination of 2 parts:

Our Likno Web Tabs Builder...(1/2)

This already exists inside your Likno Web Tabs Builder installation (v2.0.200 or above only - no need to download and install separately), and can be accessed through the following menu:

& ...our special Joomla Component (2/2)

This is the component that you need to install on your Joomla website.

The component adds 2 plugins that must be enabled.

These plugins are Likno Web Tabs: Linker Plugin, and Likno Web Tabs: Tabs Button Plugin

The first adds the necessary linking code to your page, and scans your article/page to find a tab control while the seccond provides you an editor button to make inserting tab controls inside a page/article easy.

The Joomla component supports 2 positioning options:

• The first is the normal Joomla module management. Upload the Tabs module produced by Likno Web Tabs Builder desktop application, go to module manager select it and select the module position that you want it to appear (don't forget to enable it).
• The second allows you to insert the tab control inside a page/article you want. The Tabs Plugin Button makes the whole process easy. Just Click it select the tab control you want, click insert and you are ready.

Click below on the Joomla version of your desire,
to Download the Joomla Component and see instructions on how to use it.

Download and install the Likno Web Tabs Component on Joomla

Step 1: Download the component's ZIP file

Download component for Joomla version 3.x

Release Version:	1.0.3
License / Size:	GNU/GPL 30.9 KB
Requirements:	This "Component" version (i.e. code installed on Joomla) requires Likno Web Tabs Builder v2.1.226 or above in your PC (click [About] on its [Help] menu to view its version) and Joomla version 3.x . Download the latest Likno Web Tabs Builder if not installed yet.

Step 2: Install the component to your Joomla site

• Login to your Joomla administrator area.
• Install the component by selecting the "Extensions > Extension Manager" item of the Joomla administration menu.
  
  Then, click on "Choose File" and select the pkg_liknowebtabs.zip file. After you have selected click on "Upload & Install" and you will receive the message "Installing package was successful".
  
  
• When the "Likno Web Tabs Component" is successfully installed, "Likno Web Tabs: Linker Plugin" and "Likno Web Tabs: Tabs Button Plugin" are automatically installed.
  You need to enable them.
  
  Go to plugins manager (found at Extensions Plugin Manager item of the Joomla administration menu)
  
  
  Enable these two plugins:
  Likno Web Tabs: Linker Plugin, and
  Likno Web Tabs: Tabs Button Plugin.
  
  

Configure and use the "Likno Web Tabs Builder Component" on Joomla

Step 1: Configure your tab control

Switch to the Likno Web Tabs Builder desktop application:

• Configure your tab control (colors, borders, effects, styles, etc.) through the Likno Web Tabs desktop application.
• Choose how/where your tab control is "positioned" inside your Joomla pages

  While in Likno Web Tabs Builder software, you will find the Positioning property at the bottom of the Project Panes tab.

  There are 3 sub-options:

  "Insert inside a page Element (div, span, td, etc)",
  "Replace a page Element",
  "Replace a page Image" (by using it's filename).
  
  

  View how positioning works through examples/use cases

Step 2: Setup, Compile and Upload the tab control files

While in Likno Web Tabs Builder desktop application:

• Compile the tab control using the "Add-ins Joomla Project Compile Joomla Project" (item [1] on screenshot).
  
  

  Note: When asked for "Site_Root folder" use any local folder on your hard drive you like for the compiled files to be produced. These files will be added in a ZIP file that will contain all the necessary tab control files.
  Also, it is strongly recommended to use a custom unique name for the Compiled JavaScript Project.

  
• Switch back to your Joomla Administration Panel.
  Go to Extension Manager (Extensions Extension Manager)
  Choose the zip file produced when you compiled your tabs project in Likno Web Tabs Builder.
  Click "Upload & Install".
• Now you have uploaded your tab project to your Joomla. You need to place that tabs to your articles.
  Create a new Article or edit your existing ones.
  You will notice that in your Article Editor there is a new button on the bottom called "Tab Control"
  
  
• Click on the button "Tab Control". This opens a modal window with some options.
  
  Select the tab control you want to place in your article and click "Insert".
  Save your Article and the tabs should appear where you placed them.

Download and install the Likno Web Tabs Component on Joomla

Step 1: Download the component's ZIP file

Download component for Joomla version 1.6 - 2.5

Release Version:	1.0.2
License / Size:	GNU/GPL 16.9 KB
Requirements:	This "Component" version (i.e. code installed on Joomla) requires Likno Web Tabs Builder v2.0.200 or above in your PC (click [About] on its [Help] menu to view its version) and Joomla version 1.5 NATIVE or above. Download the latest Likno Web Tabs Builder if not installed yet. The latest "Add-in" (i.e. code within Likno Web Tabs Builder) is already included with the installation (since v2.0.200, Jun. 2011), so no separate download link exists for install.

Step 2: Install the component to your Joomla site

• Login to your Joomla administrator area
• Install the component by selecting the "Extensions > Install/Uninstall" item of the Joomla administration menu
• Go to plugins manager (found at extensions/Plugin Manager item of the Joomla administration menu) and enable these two plugins: Likno Web Tabs: Linker Plugin, and Likno Web Tabs: Tabs Button Plugin.

Configure and use the "Likno Web Tabs Builder Component" on Joomla

Step 1: Configure your tab control

Switch to the Likno Web Tabs Builder desktop application:

• Configure your tab control (colors, borders, effects, styles, etc.) through the Likno Web Tabs desktop application.
• Choose how/where your tab control is "positioned" inside your Joomla pages

  While in Likno Web Tabs Builder software, you will find the Positioning property at the bottom of the Project Panes tab.

  There are 3 sub-options:

  "Insert inside a page Element (div, span, td, etc)",
  "Replace a page Element",
  "Replace a page Image" (by using it's filename).
  
  

  View how positioning works through examples/use cases

Step 2: Setup, Compile and Upload the tab control files

While in Likno Web Tabs Builder desktop application:

• Compile the tab control using the "Add-ins Joomla Project Compile Joomla Project" (item [1] on screenshot).
  
  

  Note: When asked for "Site_Root folder" use any local folder on your hard drive you like for the compiled files to be produced. These files will be added in a ZIP file that will contain all the necessary tab control files.

• Upload the compiled tab control (the ZIP file mentioned above) via the Joomla administrator area. Go to Joomla extension installer by selecting "Extensions Install/Uninstall" item of the Joomla administration menu. Select the tab control file from the location you selected above and upload it. Your Likno Web Tabs tab control has been successfully uploaded and installed. Now you need to enable this module from Joomla Module Manager, and select it's position or place it inside an article, using the button found at the bottom of your editor.

Download and install the Likno Web Tabs Component on Joomla

Step 1: Download the component's ZIP file

Download component for Joomla version 1.5 (old)

Release Version:	1.0.3
License / Size:	GNU/GPL 16.9 KB
Requirements:	This "Component" version (i.e. code installed on Joomla) requires Likno Web Tabs Builder v2.0.200 or above in your PC (click [About] on its [Help] menu to view its version) and Joomla version 1.5 NATIVE or above. Download the latest Likno Web Tabs Builder if not installed yet. The latest "Add-in" (i.e. code within Likno Web Tabs Builder) is already included with the installation (since v2.0.200, Jun. 2011), so no separate download link exists for install.

Step 2: Install the component to your Joomla site

• Login to your Joomla administrator area
• Install the component by selecting the "Extensions Install/Uninstall" item of the Joomla administration menu
• Go to plugins manager (found at extensions/Plugin Manager item of the Joomla administration menu) and enable these two plugins: Likno Web Tabs: Linker Plugin, and Likno Web Tabs: Tabs Button Plugin.

Configure and use the "Likno Web Tabs Builder Component" on Joomla

Step 1: Configure your tab control

Switch to the Likno Web Tabs Builder desktop application:

• Configure your tab control (colors, borders, effects, styles, etc.) through the Likno Web Tabs desktop application.
• Choose how/where your tab control is "positioned" inside your Joomla pages

  While in Likno Web Tabs Builder software, you will find the Positioning property at the bottom of the Project Panes tab.

  There are 3 sub-options:

  "Insert inside a page Element (div, span, td, etc)",
  "Replace a page Element",
  "Replace a page Image" (by using it's filename).
  
  

  View how positioning works through examples/use cases

Step 2: Setup, Compile and Upload the tab control files

While in Likno Web Tabs Builder desktop application:

• Compile the tab control using the "Add-ins Joomla Project Compile Joomla Project" (item [1] on screenshot).
  

  Note: When asked for "Site_Root folder" use any local folder on your hard drive you like for the compiled files to be produced. These files will be added in a ZIP file that will contain all the necessary tab control files.

• Upload the compiled tab control (the ZIP file mentioned above) via the Joomla administrator area. Go to Joomla extension installer by selecting "Extensions Install/Uninstall" item of the Joomla administration menu. Select the tab control file from the location you selected above and upload it. Your Likno Web Tabs tab control has been successfully uploaded and installed. Now you need to enable this module from Joomla Module Manager, and select it's position or place it inside an article, using the button found at the bottom of your editor.