Creating a Quicktabs style
Published by emacstheviking on Thu, 04/07/2011 - 14:03
I am currently using Quicktabs on a site and I needed to create a new style for my theme that was very close to the Sky theme but as usual, not exactly what I wanted and completely the wrong colour.
Thanks to Drupal being so awesome as well as the Quicktabs module being so well written and documented it wasn't long before I found what I was after... the author has kindly done a good thing and performed a message broadcast to all active modules to see if they too want to supply any themes that can be used...
Here's what I ended up with, this is working code and is an exact copy of the implementation of the Quicktabs code except the function name is different. Here's the code...
function MODULE_quicktabs_tabstyles() {
$tabstyles_directory = drupal_get_path('module', 'MODULE') . '/tabstyles';
$files = file_scan_directory($tabstyles_directory, '/\.css$/');
$tabstyles = array();
foreach ($files as $file) {
// Skip RTL files.
if (!strpos($file->name, '-rtl')) {
$tabstyles[$file->uri] = drupal_ucfirst($file->name);
}
}
return $tabstyles;
}
All you need to do then is to create a folder in your modules folder called 'tabstyles', here's what the structure ought to look like...
MODULE_ROOT
+--- tabstyles
+- foostyle
+- foobar.css
+- foobar-rtl.css
+- barstyle
+- bar-style.css
+- bar-style-rtl.css
The name that you see in the Quicktabs list and Styles page is the same as the CSS file (the RTL variant is hidden) with the first character converted to upper case. In our example you would be able to select "Foobar" or "Bar-style" as a Quicktab style.
That's it. Simple, effective and yet again a glowing credit to the awesome architecture that is Drupal!
Add new comment