Joomla Extensions
RokFeatureTableLatest Version: J1.5 1.1 - J2.5/J3.0 1.4
Tabular Data Presenter RokFeatureTable offers a stylistic and user friendly solution for displaying tabular based data. It is perfect for price or product comparisons, or essentially, any type of data display that suits a matrix format.
A simple, yet dynamic, interface provides you with the tools to quickly edit the contents of the module. There are a series of parameters allowing for unlimited row, with options for text, link, class and much more, which allows for extensive control.
List of Features
- Up to 20 Rows: Display extensive amounts of data.
- Extensive data control: Control over text, links, classes and other.
- Highlight Column Control: Set which column is defaulted as the highlight.
- Assign Custom Classes: Per classes control over tabular data.
- Custom CSS styles: Add per item inline styling.
- Template specific layouts: Create a series of layouts.
Screenshot
Default Style
Omnicron Joomla Template Style (Requires Omnicron Template)
History
RokFeatureTable debuted with the September 2010 Joomla Template Release, the Omnicron template. You can see its various configurations in action on the demo (link previous).
Installation - Joomla 1.5
Downloading the Extension Files
- RokFeatureTable Module (mod_rokfeaturetable.zip) This file is the module package you will use to install RokFeatureTable into Joomla.
Using the Joomla Installer
From the Menu in your Joomla Administrator, go to Extensions → Install/Uninstall.
Next, browse for your mod_rokfeaturetable.zip file you downloaded and then click Upload File & Install.
Accessing the Module Page
Next, go to Extensions → Module Manager. From the list, find RokFeatureTable and open it to be brought to the RokFeatureTable Module Manager page, which lists all the available options for the module.
RokFeatureTable Parameters
Module Class Suffix: you can type any classname and it will be added to the wrapper of the RokFeatureTable on front-end
Built-in CSS: RokFeatureTable comes with a default style that integrates with the default template of Joomla! If you want to use your own or if the template you are using supports a custom style, you might want to set this param to No.
Highlight Column: listed are the columns from 1 to 6 or none. It allows to highlight the selected column, so that on front-end it "pops out".
Preset Templates: RokFeatureTables has the ability to import predefined templates from both the module folder or even from your template. RokFeatureTable comes with 2 predefined templates as examples: Browsers and Price Table.
To import a template, select it from the dropdown and click import (Parameter 6)
If you want to add your own, you can create a file (let's say my-table.txt) in your template at the location /templates/rt_yourtemplate_j15/admin/rft-templates/ (note, if admin/rft-templates/ folders do not exist, please create them).
Once you have create the file, you'll notice that it's going to be listed in Preset Templates
You can use one of the two examples from the module as reference or follow below the "How do custom templates work?" documentation.
Layout Setup: this is the 'core' of the whole RokFeatureTable functionality. To open or close the table so that you can manage it, just click the gear (Parameter 7) button.
This parameter also shows you how it is structured at the moment your table. In the screenshot you can see "1 x 1", which means "1 ROW x 1 COLUMN".
More detailed information on "How does the Layout Setup work?" below.
Allows to import a predefined template into the Layout Setup. Please see Parameter 4 and "How do custom templates work?" section.
Allows to open and close the Layout Setup table. Please see Parameter 5 and "How does the Layout Setup work?" section.
How do custom templates work?
Creating custom templates is very easy. You just need your favorite text editor and some knowledge on how the syntax is. Below an example of custom template that we are going to cover on all its aspects.
First things first, each Column is separated by 3 dashes "---", so everytime you are done writing rows, to 'switch' to another column, just add "---".
To create a row, or even better, a cell, you start typing the classname of reference followed by 2 colons "::". Let's ignore all the columns and let's just take as reference the first one. Even without knowing the syntax, yet, you can easily tell all the columns and rows are equals, what makes them difference are just the values, but not the structure.
So, as said earlier, we started writing a cell name::padding-top:10px;|Firefox. This translated means: "Create a cell, use as referenced classname 'name', add some inline styling 'padding-top:10px;' and use 'Firefox' as text of the cell". Pretty easy, isn't it?
But it's not all that, you might want that cell to have a subline, so how to do that? The next line of the code is what we need: name-sub::Gecko Engine. As you can see, 'name' has been kept for referencing to the 'name' cell, but we added a new keyword '-sub'. That's what let's RokFeatureTable know that our 2nd line in the code needs to be a subline of 'name'. Translation: "In the cell that has 'name' as reference class add a subline with the text 'Gecko Engine'".
Now we want our cell to have also other classes and not just 'name', to do so, following the same rules of '-sub', we write: name-classes::class2 class3, which translated is "In the cell that has 'name' as reference class, I also need other classnames: 'class2' and 'class3'".
What follows is not prefixed by any 'name' anymore. That means we are done with the 'name' cell and we are switching to a new one, 'button-text'.
Everything is exactly as in 'name' cell, except we have a new keyword, '-link', that I'm sure you already guessed what it does and how it works.
NOTE: All the referenced cells allows HTML syntax, if instead of just plain "Firefox" (in the example above), we wanted a bold, red and italic "Firefox" (Firefox) this is how we would have written our cell: name::padding-top:10px;|<strong style="color:red;"><em>Firefox</em></b>
How does the Layout Setup work?
The UI of Layout Setup is very easy to understand, but there are few things you might want to know.
RokFeatureTable has a limit of 20 ROWS x 6 COLUMNS. You can add new columns by simply clicking on the "+" button (see Parameter 2). Everytime you hover over a Column button, like "COL 2" in the screenshot (see Parameter 1), a "remove" link appears and by clicking it you are going to delete that column.
Every Column is associated to its rows, which is the big panel that appears under the Columns buttons.
To add or remove a row you can simply click on the "+" or "-" buttons (see Parameter 4). Everytime you click the "+" button, a new Row will be created right under the row you have clicked the "+" from.
Every Row of a Column is what is called a "cell". RokFeatureTable allows to provide many functionalities to each Cell.
What gives the Cell the actual text that should appear, is the inputbox (see Parameter 3). That is considered most of the time all a cell needs but with RokFeatureTable you can add more.
subline: If you want the cell to have a subline added, right under the Cell text, you can click on the "subline" button (see Parameter 5) and write the subline text you want to appear.
link: If you want your cell text to be linked to any URL, you can click the "link" button and write the URL (you can see ROW 2 in the screenshot).
class: If you need your cell to have a special classname, you can change it by clicking on "class" button. Note that RokFeatureTable allows multiple classes as well, they must be separated by a space and the first classname is the reference one for RokFeatureTable.
style: Finally, you can have any type of inline styles, if needed, by clicking the "style" button and writing the css rules in there (you can see ROW 1 in the screenshot).
Changelog
This is a changelog for RokFeatureTable, inclusive of any alpha, beta, release candidate and final versions.
