As stated in #332895: render quicktab programatically, it is possible to use the Quick Tabs API to add a Quick Tabs block directly to a node, or a template file.

There are several ways, listed below, to add a Quick Tabs block to a node. Choose whatever works best for you.

  1. Use the Insert Block module.
  2. Enable the PHP Input Format (which is a separate module in Drupal 6) and use either of the following code snippets
    1. Display a Quick Tabs block that has already been created.
    2. <?php
      $qtid = 42; // write here your quicktabs id.
      $quicktabs = quicktabs_load($qtid);
      print theme('quicktabs', $quicktabs);
      ?>
    3. Create the Quick Tabs block programmatically.
    4. <?php
      $tabs['first'] = array(
        'title' => t('One'),
        'type' => 'view',
        'vid' => 'my_view_id',
        'display' => 'my_display',
        'args' => 'my_arguments',
      );
      $tabs['second'] = array(
        'title' => t('Two'),
        'type' => 'block',
        'bid' => 'modulename_delta_id', // e.g. user_delta_1
        'hide_title' => TRUE,
      );
      $tabs['third'] = array(
        'title' => t('Three'),
        'type' => 'node',
        'nid' => 'my_node_id',
        'teaser' => TRUE,
        'hide_title' => TRUE,
      );
      $tabs['fourth'] = array(
        'title' => t('Four'),
        'type' => 'freetext',
        'text' => 'Hello World',
      );
      
      $quicktabs['qtid'] = 'any-unique-id';
      $quicktabs['tabs'] = $tabs;
      $quicktabs['style'] = 'Excel';
      $quicktabs['ajax'] = FALSE;
      print theme('quicktabs', $quicktabs);
      ?>
  3. Enable the Quick Tabs block in the blocks admin page (admin/build/block), and set the visibility options to show only on the path of the node in question.
  4. Note that this method may not be as flexible as you need, depending on the regions provided by your theme.

As stated in #332895-13: render quicktab programatically, it is also possible to render a Quick Tabs block in the theming layer, but it is best done through a preprocess function. The following code example illustrates the technique:

function MYTHEMENAME_preprocess_page(&$vars) {
  // As quicktabs require additional js and css files, we must construct the quicktab here.
  $quicktabs = quicktabs_load(42);
  $vars['myquicktab'] = theme('quicktabs', $quicktabs);

  // Reconstruct CSS and JS variables.
  $vars['styles'] = drupal_get_css();
  $vars['scripts'] = drupal_get_js();
}

After doing this, you can simply use

print $myquicktab

in your theme.

Comments

Jonathan Björkskog’s picture

Hello!
I have a lot of product-pages that all have a QT-block in the content-bottom. Now I populate the two tabs with plain text that i fill in by adding new blocks and then populating the qt-block with these two new blocks. So when adding a product i have to first create the product, then create the two blocks, then create a qt-block with the two new blocks as tabs, then activate the new QT-block for only the product-page I just created. This takes a lot of time, and is not user friendly.

The thing I should want to do is the following:
Add two fields with CCK to the node-type product. Then, when I fill in the two fields when creating a product, they should automatically appear as a QT-block below the content.

Is this possible with QT, or should i have to hide and present the two fields with javascript in the theme instead?

Anonymous’s picture

Hi Jonathan!

You can do that rather easily. First you disable or hide the CCK fields in the content types field visibility settings. After that you have to create a little module that implements hook_block(). In that module you check if arg(0) is 'node' and if arg(1) is numeric. If so, you can do a node_load(arg(1)) and receive the currently shown node page. After that you might check if the node's type is correct (you don't want to show empty quicktabs on other content type's pages).

Following above's code snippet for programatically creating quicktabs you can now get the cck fields' values out of the node, add some HTML around and put it in a freetext tab. The themed quicktab output is what your YOURMODULE_block() function actually returns when viewed.

Another solution without having to code may be using the CCK Blocks module which lets you create blocks to show node's CCK fields. These you may also use as quicktab tabs and you could then set the quicktab block into a node bottom or content bottom region of your theme. But I haven't tested the latter approach myself.

Jonathan Björkskog’s picture

Thank you Webseiter, I just figured out how to do it myself, and the funny part is that it is very close to your solution! I made two new blocks, I pulled the cck-fields to the blocks with php, i made a quick-tab that is only shown on my product pages (that's where I needed the tabs), and I populated the tabs with the two blocks that I made before. I made an article describing how I did, just tell me if you think I should have done something in another way. :)

http://jonathanbjorkskog.com/create-quicktab-block-that-is-populated-by-...

TajinderSingh’s picture

Wonderful,

This code sample's 2nd point really saved me....

I had to generate quicktabs for content being generated randomly using a views and further call another view being content of that quicktabs block.

Thanks a lot for posting.

Best Regards,

Tajinder Singh Namdhari
https://TajinderSinghNamdhari.com

Pasqualle’s picture

Instead of enabling the PHP Input Format I would suggest to use custom node template to display the quicktab.

for story content type use node-story.tpl.php

rksadit’s picture

hi,
I'm writing below code in my node--story.tpl.php, but only empty page is loading when i load the node page.Can you please help in knowing my mistake.
What i need to add to display quicktab and its corresponding viewmode content?

 $nid=$node->nid;

$tabs['Home'] = array(
  'title' => t('Home'),
  'type' => 'node',
  'nid' => $nid,
  'viewmode_home' => TRUE,
  'hide_title' => FALSE,
);
$tabs['About'] = array(
  'title' => t('About'),
  'type' => 'node',
  'nid' => $nid,
  'viewmode_about' => TRUE,
  'hide_title' => FALSE,
);


$quicktabs['qtid'] = 111; //given a random number
$quicktabs['tabs'] = $tabs;
$quicktabs['style'] = 'Mac';
$quicktabs['ajax'] = FALSE;
print theme('quicktabs', $quicktabs);
wszxg8866’s picture

$qtid = 42; // 这个地方在drupal6下面应该用你在后台建quicktabs时使用的机器读的machine_name而不是qtid
$quicktabs = quicktabs_load($qtid);
print theme('quicktabs', $quicktabs);
philpro’s picture

Doesn't look like this is clearly documented, but you can add $quicktabs['hide_empty_tabs'] = TRUE; to hide empty tabs (views, blocks, freetext, etc)

philpro’s picture

In addition to
$quicktabs['hide_empty_tabs'] = TRUE;
You can also add:
$quicktabs['default_tab'] = 'featured_product';

		$quicktabs['qtid'] = 'product-tabs';
		$quicktabs['tabs'] = $tabs;
		$quicktabs['style'] = 'sky';
		$quicktabs['hide_empty_tabs'] = TRUE;
		$quicktabs['ajax'] = FALSE;
		$quicktabs['default_tab'] = 'featured_product';
		print theme('quicktabs', $quicktabs);
achu68’s picture

How can i achieve this on drupal 7 I need to put the tabs on one node.

pfx’s picture

Try to insert a code like this in a node

<?php
$tabs['tab1'] = array(
  'title' => t('tab1'),
  'type' => 'node',
  'nid' => '122',  // write here the id of the node you want display
  'teaser' => FALSE,
  'hide_title' => TRUE,
);

$tabs['tab2'] = array(
  'title' => t('tab2'),
  'type' => 'node',
  'nid' => '123',
  'teaser' => FALSE,
  'hide_title' => TRUE,
);

$quicktabs->machine_name = 'tab-serie';
$quicktabs->tabs = $tabs;
$quicktabs->style = 'Excel';
$quicktabs->ajax = false;
$quicktabs->hide_empty_tabs = 1;
print render(quicktabs_render($quicktabs));
?>

now it is better to use the 7.x-2.x-dev version rather than the 7.x-2.0-beta1 version.

ihsanfaisal’s picture

I use 7.x-3.0-beta1.
To insert it in a node, I use something like this:

// in 7.x-3.0-beta1, it uses name not id
// quicktabs name available in admin interface: admin/structure/quicktabs
$qtname = 'first_quicktab';
print drupal_render(quicktabs_build_quicktabs($qtname));
Pasqualle’s picture

if someone wants to render quicktabs without storing it in database it is still possible.
check the quicktabs_build_quicktabs() function.

aspitzer’s picture

I try to use this code but I get a blank page. Since the change to machine name I can't get to render a QT using php code in a node.

I am using the machine name i get from the admin/structure/quicktabs .

<?php
$qtname = 'my_machine_name_here';
print drupal_render(quicktabs_build_quicktabs($qtname));
?>

Can someone provide some help please?
Thanks!

hendrohwibowo’s picture

in my case I got a blank page because i use "Filter HTML" as Text Format in the contents of quicktab. It got it to work after I set them all to "Full HTML".

simone960’s picture

You can embed in your node template using following code in Drupal 7 :

 $block = module_invoke('quicktabs', 'block_view', 'machine_name');
 print render($block);

*machine name can be found in admin/structure/quicktabs

I have tested in Drupal 7.21, it works.

hansnavas’s picture

This snippet of code worked for me using D7! Thanks simone960!!

drupal_newb’s picture

Thank you! This helped me a lot! Tested on 7.32

shuva.15’s picture

This works perfectly for rendering quicktabs in tpl.

gafenn08’s picture

I created a module that creates a field for quicktabs this might be useful for simple tabs. Quicktabs Field

peter.thorndycraft’s picture

This worked for me (D7):

$tabs['add'] = array(
            'title' => t('Add Content'),
            'type' => 'callback',
            'path' => 'node/'.$node->nid.'/dashboard/add',
        );

        $quicktabs_settings = array(
            'machine_name' => 'dashboard-tabs',
            'style' => 'Excel',
            'ajax' => TRUE,
            'hide_empty_tabs' => FALSE,
        );

        $tabs = quicktabs_build_quicktabs('dashboard-tabs',$quicktabs_settings , $tabs);

        $return .= render($tabs);
ocim’s picture

How did you alter the list classes for the tabs?

hooface’s picture

Wonderful!Thanks.

soulston’s picture

Using D6 this only worked for me if I put this code in MYTHEME_preprocess_node($&vars), in case anyone is banging their head, although I'm not sure if this code should really be in page_preprocess.:

$vars['styles'] = drupal_get_css();
$vars['scripts'] = drupal_get_js();
dunx’s picture

I did all of the above for D6 in various different ways just for 3 tabs of freetext "TAB 1" thru "TAB 3". Custom modules, pre-process page and node and then eventually in template.php. Each time all I was seeing was the tab title of the first tab; "TAB 1". The HTML looked fine. I had the JS and CSS already on the page for a "proper" quicktab block.

In the end all I needed to do was surround the quicktab in
<div class="block block-quicktabs">...</div>

Stupidly simple, but not mentioned anywhere. Hopefully of help to somebody.

WoozyDuck’s picture

How can we pass more than one argument to the Views in a tab? I have tried array(...) and it didn't work (D6)

Pasqualle’s picture

"excessive" example:

$tabs['first'] = array(
  'title' => t('One'),
  'type' => 'view',
  'vid' => 'my_view_id',
  'display' => 'my_display',
  'args' => 'arg1/arg2/tax1+tax2+tax2/tax1,tax2,tax3',
);

the example is nothing special, it is how views module uses arguments (contextual filters):
/ argument separator
+ OR (for 1 argument with multiple values)
, AND (for 1 argument with multiple values)

anthony0perez’s picture

$tabs['third'] = array(
'title' => t('Three'),
'type' => 'node',
'nid' => $myothernode,
'teaser' => TRUE,
'hide_title' => TRUE,
);

When using your example in node-myName.tpl.php, it seems to fail to load another node into a node tab view.
Am I doing this wrong or what?

craigtockman’s picture

thanks