Magento group attributes on product page

Image may be NSFW.
Clik here to view.For a Magento project I was looking for a way to group the attributes so the visitor can view the ‘Product features’ and ‘Technical features’ grouped together. The project involves the Magento Connector by Tinx-IT which synchronizes the data from Microsoft Dynamics to a Magento database.

Magento has default functionality to create attributes groups.

1. Goto CMS-> Catalog->Attibutes->Manage attributes sets
2. Choose an Attribute set
3. The center window will show Attribute Groups. You can add Groups at you wish and drag and drop attributes in a specific group. In my case I made a group called ‘Technical’ and added the technical product attributes to that group.

I found this page which has code to group the attributes: http://www.magentocommerce.com/boards/viewthread/26167/.

The code is not fully functional in my case so this is my edited version. Features of my version:

• Only show attributes from attribute groups defined in $listable_groups = array (‘group1′,’group2’).
• Add the names of your attribute groups in the array.
• Neglect all other attributes groups.
• Add this code to in the page: app/design/frontend/default/theme/template/catalog/product/view/attributes.phtml. This will edit the standard attributes overview.
• You can also add a new tab to the product page if you want to separate the attributes in two tabs.

<?php
 $_helper = $this->helper('catalog/output');
 $_product = $this->getProduct()
 ?>
 <?php
 $listable_groups = array('General','Technical'); //The attribute groups listed here will display as a single list beneath the group name
 $group_names = array();
 $active_group_name = null;
 $attributes = $_product->getAttributes();
 $new_group = true;

foreach ($attributes as $attribute) {
   $new_group = false;
   if ($attribute->getIsVisibleOnFront() ) {
      $group_id = $attribute->getData('attribute_set_info/' . $_product->getAttributeSetId() . '/group_id');
      if ( !isset($group_names[$group_id]) ) {
         $group_model = Mage::getModel('eav/entity_attribute_group');
         $group_model->load($group_id);
         // group names are cached to prevent having to check the DB on each iteration
         $group_names[$group_id] = $group_model->getAttributeGroupName();
      }
      if ( $group_names[$group_id] != $active_group_name ) {
         $active_group_name = $group_names[$group_id];
         $new_group = true;
      }
      $value = $attribute->getFrontend()->getValue($_product);
      if ( in_array($active_group_name, $listable_groups) ) { 
         // If a "listable" attribute
         if ($new_group) { //display the heading of a new group
         ?>
         <div class="product-attribute-title">
            <?php echo $active_group_name ?>
         </div>
         <?php
      }
      if (strlen($value) && $_product->hasData($attribute->getAttributeCode())) {
      ?>
      <div class="product-attribute-label">
         <?php echo $this->__($attribute->getFrontend()->getLabel()) ?>
      </div>
      <div class="product-attribute-data">
         <?php echo $_helper->productAttribute($_product, $value, $attribute->getAttributeCode()) ?>
       </div>
       <div style="clear:both;"></div>
       <?php
       }
    }
 }
?>

Styles used:

/* attributes tab */
 .product-attribute-title {
    width:400px;
    font-weight: bold;
    margin:12px 0 8px 0;
 }
 .product-attribute-label {
    display:inline-block;
    width:200px;
    font-weight: bold;
 }
    .product-attribute-data {
    display:inline;
 }