Upgrade Your Drupal Skills

We trained 1,000+ Drupal Developers over the last decade.

See Advanced Courses NAH, I know Enough

Split a large content type into separate tabs (Drupal)

Parent Feed: 

As some you might have experienced, some of the content types in your Drupal site might get too unwieldy because of their sheer size. Displaying a form for the content type of displaying the node is not elegant anymore and the user has to scroll till figures hurt. I had a similar situation recently (attached image with the fields lists all the fields in this 'Event' content type:

All fields in the Event object The simple and elegant solution is to divide the object into logical tabs both for the form and view. and the final output looked like below for me: After doing all the tab work The way to achieve this is to: 1. Divide the fields in the object into fieldgroups, which will eventually be the different tabs (these are standard groups). 2. Have a custom module where you will override the form and do at least these changes: 2.1 edit form_alter hook to have something like

 

$group_eventcontacts = $form['group_eventcontacts'];
unset($form['group_eventcontacts']);
$form['group_tabs']['group_eventcontacts'] = $group_eventcontacts;

where eventcontacts is the name of the fieldgroup. So we are creating a new group and removing the fieldgroup from the original form. 2.2. Override the theme hook to have the following: return array( 'myfunc' => array( 'arguments' => array('form' => NULL), ),2.3 In the myfunc function: have the following (refer 2.1 above): $event_keyContacts = drupal_render($form['group_tabs']['group_eventcontacts']); and append the $event_keyContacts variable to the $output. $output .= <div id="event_keycontacts-'.$nid.'">'.$event_keyContacts.'</div> Thats pretty much all for the form. Do this for all the groups(tabs) you want to create . 3. Now for the node viewing part. I created a separate node-event.tpl.php for handling my event content type. This file is created in the theme directory. $content = preg_replace('~<fieldset.+ class="content-multigroup-group-eventcontacts"?</fieldset>~s','',$content); this removes the fieldgroup content from the $content. Do this for all the groups. Now get the contents from $node->content if (isset($node->content['group_eventcontacts'])){ $group_eventcontacts = $node->content['group_eventcontacts']['#children'];Add the $group_eventcontact variable to the tab $tabs_div .= '<div id="event_contacts-'.$nid.'">'.$group_eventcontacts.'</div>';It is important to understand the difference between $content and $node->content. Former is the formatted representation of the content and later is a data structure containing the contents. $node->content has to be themed to become $content. There be sure to manipulate both variables correctly. That is all for getting the tabs. Happy coding

Author: 
Original Post: 

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web