Attributes als Attribute-Set im Webshop darstellen
View this post in english at http://web-design.sayyor.com (short translation)
In Magento lassen sich, bedingt durch das EAV-Datenmodell, quasi beliebig viele Felder bzw. Attribute zu einem Produkt hinzufügen. Die neuen Attribute lassen sich zusätzlich noch im Administrationsbereich gruppiert darstellen – das schafft beim Pflegen deutlich mehr Übersicht aber warum diese Gruppierung nicht auch im Webshop darstellen? Wie das geht schauen wir uns heute einmal näher an.
Update: Die Gruppenansicht von Attributen ist nun per MagentoConnect direkt zum installieren verfügbar.
Vorab ein paar Grundlagen zum Anlegen von Attributen. Einfache Attribute lassen sich über Catalog/ Attributes/ Manage Attributes erstellen. Die einzelnen Attribute können dabei zu Attribute Sets zusammengefasst werden. Das Attribute-Set können wir uns wie einen Baum vorstellen – es gibt viele Äste, die Gruppen, die unsere einzelnen Attribute, die Blätter, tragen. Ein Baum hat dabei natürlich mehr Äste, Zweige und Blätter als unsere einfache Gruppierung in Magento. Im Admin sieht das ganze in der Regel wie folgt aus:
Nun, merken wir uns einmal die Attribute “megapixels”, “dimensions”, “model” und “manufactor”. Für unser Produkt sollen diese Attribute einzeln und tabellarisch auf der Webseite dargestellt werden. Dazu müssen sie mit Hilfe von Catalog/ Attributes / Manage Attributes bearbeitet bzw. geprüft werden. Wichtig ist das überall der Wert von “Visible on Product View Page on Front-end” auf “Yes” steht. Diese Dropdown schaltet die Anzeige im Frontend für das jeweilige Attribute frei. Sind alle Attribute angepasst stellt Magento in das Basis-Installation alle Attribute wie folgt dar:
So lange nur ein paar Attribute angezeigt werden ist die Übersicht gewährleistet. Wollen wir jedoch eine größere Menge an Informationen zum Produkt auf diesem Wege anzeigen geht sie schnell verloren. Hier wäre es sinnvoll die Darstellung noch einmal in “General” und “Camera Attributes” zu gliedern. Magento gibt die Möglichkeit von Haus aus jedoch nicht her, deswegen erstellen wir unseren eigenen Block.
Eigenen Block erstellen
Unser Ziel ist es nicht nur die Attribute über den Block darzustellen sondern zusätzlich noch das Attribute-Set. Folgender Code hilft uns dabei weiter:
Datei: code/local/Mage/Catalog/Block/Product/View/Attributesgroups.php
<?php
class Mage_Catalog_Block_Product_View_Attributesgroups extends Mage_Core_Block_Template
{
protected $_product = null;
function getProduct()
{
if (!$this->_product) {
$this->_product = Mage::registry('product');
}
return $this->_product;
}
public function getAdditionalData(array $excludeAttr = array())
{
$data = array();
$product = $this->getProduct();
$attributes = $product->getAttributes();
foreach ($attributes as $attribute) {
if ($attribute->getIsVisibleOnFront() && !in_array($attribute->getAttributeCode(), $excludeAttr)) {
$value = $attribute->getFrontend()->getValue($product);
// TODO this is temporary skipping eco taxes
if (is_string($value)) {
if (strlen($value) && $product->hasData($attribute->getAttributeCode())) {
if ($attribute->getFrontendInput() == 'price') {
$value = Mage::app()->getStore()->convertPrice($value,true);
} elseif (!$attribute->getIsHtmlAllowedOnFront()) {
$value = $this->htmlEscape($value);
}
$group = 0;
if( $tmp = $attribute->getData('attribute_group_id') ) {
$group = $tmp;
}
$data[$group]['items'][ $attribute->getAttributeCode()] = array(
'label' => $attribute->getFrontend()->getLabel(),
'value' => $value,
'code' => $attribute->getAttributeCode()
);
$data[$group]['attrid'] = $attribute->getId();
}
}
}
}
// Noch Titel lesen
foreach( $data AS $groupId => &$group ) {
$groupModel = Mage::getModel('eav/entity_attribute_group')->load( $groupId );
$group['title'] = $groupModel->getAttributeGroupName();
}
return $data;
}
}
Im oberen Beispiel wurde der Magento-Kern Code benutzt und in einer eigenständigen Class um die Gruppendarstellung erweitert.
Ein kleiner Tipp am Rande: Die Magento-Controller sorgen dafür das in Mage::registry(‘product’) immer das Produkt, das in dem Moment dargestellt werden soll, hinterlegt ist. So ist es jederzeit möglich Produkt-Darstellung-Blöcke auch in anderen Controller zu verwenden. Es muss durch den Controller nur gewährleistet sein das die Mage-Registry ein Produkt enthält.
Template vorbereiten
Nun haben wir einen Block der die Funktion beinhaltet alle Attribute gegliedert nach Gruppen zu zurückzugeben. Was wäre naheliegender als diese Funktion in einem Template aufzurufen und deren Informationen darzustellen?
Dabei: app/design/frontend/default/default/template/catalog/product/view/attributesgroups.phtml
<?php
$_helper = $this->helper('catalog/output');
$_product = $this->getProduct()
?>
<?php if($_additionalgroup = $this->getAdditionalData()): ?>
<div class="box-collateral box-additional">
<h2><?php echo $this->__('Additional Information') ?></h2>
<?php $i=0; foreach ($_additionalgroup as $_additional): $i++; ?>
<h3><?php echo $this->__( $_additional['title'] )?></h3>
<table class="data-table" id="product-attribute-specs-table-<?php echo $i?>">
<col width="25%" />
<col />
<tbody>
<?php foreach ($_additional['items'] as $_data): ?>
<tr>
<th class="label"><?php echo $this->htmlEscape($this->__($_data['label'])) ?></th>
<td class="data"><?php echo $_helper->productAttribute($_product, $_data['value'], $_data['code']) ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
<script type="text/javascript">decorateTable('product-attribute-specs-table-<?php echo $i?>')</script>
<?php endforeach; ?>
</div>
<?php endif;?>
Hier fügen wir nun zwischen jeder Gruppe eine neue H3-Überschrift ein. Damit die Möglichkeit der Übersetzung der Überschrift der Sets bei mehrsprachigen Shops bestehen bleibt wird diese durch den Aufruf von echo $this->__(…) ausgeben.
Layout aktualisieren
Letztlich müssen wir unseren Layout-XML noch sagen das wir unsere Attribute mit einem eigenen Block und einem anderen Template darstellen möchten. Dazu suchen wir in der catalog.xml die Zeile
<block type="catalog/product_view_attributes" name="product.attributes" as="additional" template="catalog/product/view/attributes.phtml"/>
und ersetzen sie durch
<block type="catalog/product_view_attributesgroups" name="product.attributes" as="additional" template="catalog/product/view/attributesgroups.phtml"/>
Schon wird anstelle der alten Produktdarstellung unsere eigene genutzt. Das Ergebnis sieht dann im Demo-Shop beim gleichen Produkt wie folgt aus:
Der Autor
Tobias Vogt arbeitet seit 2008 mit Magento und ist seit 2011 durch Magento zertifizierter Entwickler. Beschäftigt ist er bei der code-x GmbH, einer Agentur für Internet und Marketing aus Paderborn. Er gehört zum Gründer-Team der Webguys und ist seit November 2011 Bachelor of Science (Wirtschaftsinformatik). Sie erreichen Ihn per E-Mail unter tobi@webguys.de.
Cool, danke!
Hi habe das ganze mal in 1.4 versucht. Scheint aber nur für 1.3 zu funktionieren…kann das jemand bestätigen
Noch viel schliemmer nun habe ich gerade die Änderungen rückgängig gemacht und bekomm in der Produktansicht einen Fehler angezeigt.?!
Fatal error: Call to a member function addToChildGroup() on a non-object in /var/www/vhosts/tt-home.net/httpdocs/magento/app/code/core/Mage/Core/Block/Abstract.php on line 649
Obwohl ich in der Datei und auch sonst nirgends was geändert habe.
Gruß Boris
Also der Artikel ist auf der Basis von Magento 1.3 entstanden. Ob er so oder ähnlich auf Magento 1.4 funktioniert kann ich nicht ohne weiteres sagen. Ich gehe aber davon aus das ein paar Kleinigkeiten angepasst werden müssen.
Der Fehler klingt nach einem Problem in den Layouts-XML. Bitte kontrolliere doch noch einmal ob du wirklich alle Änderungen rückgängig gemacht hast. Zudem leere einmal den Cache deiner Webseite – sonst wirst du Änderungen so erst einmal nicht korrekt sehen können.
Ein kleiner Rat noch am Ende: Bitte probiere Änderungen an Magento erst local aus bevor du sie online stellt. Wir machen das z.B. mithilfe von Subversion und einer Branche mit dem Namen “live”. Sobald die Änderungen freigeben sind und funktionieren werden Sie im Live-Branche nachgepflegt (mittels merge) und dann auf dem Kundenserver publiziert. Das hat zudem den Vorteil das man quasi jederzeit jeden Stand wiederherstellen kann.
Tobi du bist mein Held die layout.xml war wohl zerschossen, hab bestimmt den String hier aus dem Beitrag zurückkopiert. Es läuft wieder. Da ich wie man merkt nicht so Plan von Code habe, lasse ich mal weiter versuche und warte auf eine stabile 1.4 Lösung. Ich danke dir nochmal herzlichst für die schnelle Hilfe und werde mir deine Tips zu Herzen nehmen.
Gruss Boris
Hey Boris,
aber immer gern
Am offenen Herzen sollte man wirklich nur im Notfall arbeiten – quasi wenn eh alles kaputt ist 
Ob es diesen Beitrag für die 1.4 Magento geben wird steht aber noch in den Sternen bzw. das ist z.Z. nicht geplant. Was genau hast du denn vor? Vlt. hilft dir ja auch ein Modul von MagentoConnect weiter?
schönen Gruß
Tobi
Ja ich habe halt Mobilfunkgeräte mit etlichen Attributen und um Übersicht zu schaffen wollte ich halt nur alle Attribute in Attributgruppen aufteilen.
Da sollte ich eigentlich nicht der erste sein, aber finde nur diesen Beitrag hier.
Gruß Boris
Ich habe aus dem Quellcode oben gerade mal eine Extension für MagentoConnect auf Basis von 1.4 erstellt. Ich warte gerade drauf das die Freigeschaltet wird dann kannst du die über MagentoConnect installieren
Der Name der Extension lautet “Webguys_AttributesAsGroup”. Aber wie gesagt: Ist leider noch nicht freigeschaltet.
Modul ist freigeschaltet
http://www.magentocommerce.com/magento-connect/t-ob-i/extension/4191/webguys_attributesasgroup
Hi, I have just installed the module but…no result. Should I move/write any file/code? v1.4.0.1.
this is a very interesting feature (I have another very simple approach I can share with you). Please email-me. Thanks
Hey AMG,
did you reset your magento cache after you installed the module using
magento-connect? sounds like module is not active because some caching
problems.
i tested my modul using magento 1.4.1.1 – but in my opionen it is going
to work in other 1.4.x.x versions..
nice greetings from germany
Hi Tobi… I am currently working with the code snippets you provided here…. works great man… thanks a lot.I also improved the code for hiding the atributes with value “null” assigned.
__($_data['value'])) !== “null”): ?> .. then print label and value
Cheers from Colombia.
OK, fine
Is the MagentoConnect module really not working? I’m going to improve my module using your code in the next version.. thanks a lot!
Hi ! im under magento 1.4.1.1 using hellowired theme.
i installed the extension with magento connect but it doesnt work.
Since im using a theme (not default) do i need to move some files ?
thx
Hi ! I have also magento 1.4.1.1 with a special theme. i installed the extension with magento connect, cleared the cache, but it doesnt work.Since im using a theme (not default) do i need to move or change some files ?
Thanks
Sounds like you have same problem as shibal. I will check it up in a few days, ok?
hi Tobias
did you fix find out how to fix the problem ?
Habe es über Magento Connect installiert und funktioniert einwandfrei, nur …
wo ist das Template, um die Ausgabe auf der Produktseite anpassen zu können?
Das Modul bringt nur ein Template mit. Dieses findest du unter app/design/frontend/base/default/template/webguys/attributesasgroup/. Es heißt groupview.phtml – in der Regel hilft es, wenn du ein Template nicht finden kannst, sehr Block-Hints im Magento Admin zu aktivieren. So hast du lauter kleine Kästchen die dir Anzeigen woher welche Inhalt kommt
Hallo Tobi,
erstmal vielen Dank für die tolle Extension! Habe sie bereits eingebaut gehabt, bevor du die Extension der Community bereitgestellt hast, hatte es aber vergessen im Forum bereitzustellen!
Sag mal eine Frage wegen der Mehrsprachigkeit!
Geht generell um Attributsets
Ich kann mit inline Translate leider nicht diese übersetzen!
Brauche das für eine Advancded SuFu, zu sehen hier:
http://int.mission-solar.eu/eu_store/catalogsearch/advanced/
Aufgerufen wird das ganze unter :
__($_attributeSet->getAttributeSetName());?>
Kannst du mir eventuell weiterhelfen wie ich das so umstellen kann, das die Attributset Namen auch übersetzt werden können pro Store View! ?
Vielen Dank schon mal im Voraus!
Liebe Grüße aus HH
Phil
Hey Philipp,
wird dir denn Angeboten das du die Attribute-Set-Namen dort übersetzen darfst? Wenn ja schau mal ob du den Cache geleert hast und ob du in dem Moment den richtigen Store-View ausgewählt hast. Vom Aufruf sieht das nämlich erst mal richtig aus
schönen Gruß
Tobi
Hi, eine Frage für den Laien: Wie genau muss der Code komplett aussehen, wenn ich den von AMG genannten Schnipsel einfügen will:
__($_data['value'])) !== “null”): ?>
Es sollen die Attribute unterdrückt werden, die keinen Wert haben. Betrifft nicht Eure Extension, sondern das default-Template attributes.phtml. Bin für Hinweise dankbar.
Viele Grüße
Patrick
Super sache die Darstellung der Attributsets in Gruppen.
Ich habe z.B. bereits das Modul “EasyTabs” installiert und nun erscheind deine Gruppierung generell über den Tabs.
Dachte ich mir einfach, hauste die Gruppierung in den “Additional Tab” rein, dann sollte dort deine Gruppierung angewendet werden, funktioniert allerdings nicht.
Kennst du eine ähnliche Umsetzung die Funktioniert?
Andi, das ist leider nicht so super einfach da, soweit ich mich erinnere, beide Extension in Magento an ähnlichen Stellen ins System greifen. Du müsstest mal prüfen ob du den neuen Block den die dir Extension mitliefert mittels addTab irgendwie per Layout-Update dort rein bekommst.
Zeitlich ist es leider bei mir sehr eng um die Extension gratis zu supporten, sorry!
Ist es auch möglich, dass ganze beim Produktvergleich einzubinden? Wenn ja wie muss man vorgehen?
Super Extension, ich habe es auf 1.4.2 installiert und es läuft prima. Aber, die nächste Schritte wäre natürlich daß die Attribute-gruppen auch in der Vergleichsliste gezeigt wurden. Wie könnten wir daß machen?
Hallo Wasserman
Danke erst einmal für das Lob. Ja, gehen würde das. Ähnlich wie hier beschrieben aber bis dato hatte ich noch keine Möglichkeit das Umsetzen. Die meisten Blog-Beiträge und Module entstehen letztlich im Tagesgeschäft. Aber vielleicht hättest du Lust die Erweiterung um dieses Feature zu sponsoren? 
Hallo wir bekommen wie oben bereit schon erwähnt folgende Meldung:
Fatal error: Call to a member function addToChildGroup() on a non-object in htdocs\magento\app\code\core\Mage\Core\Block\Abstract.php on line 649
Trotz des BackUps der Änderung an die XML Dateien, die wir bis dato vorgenommen haben, erscheint die Fehlermeldung weiterhin.
Aber nur wenn wir in die Produktdetails gehen. Trotz der Deinstallation der Extension erscheint die Fehlermeldung immer noch.
Vielen Dank und viele Grüße
Hi Martin,
hast du deinen Cache deaktiviert als du die Extension getestet hast? Klingt so als würden sich dort zwei Extension eventuell in die Quere kommen..
Tobi
Hallo Cache ist deaktiviert.
Kann ich die installierten Extensions einfach nach und nach deaktivieren und testen ob es geht?
Oder klappt das so nicht.
Viele Grüße und besten Dank!
Hi Martin,
ja bei Layout-Probleme sollte das kein Problem sein so. Aber immer dran denken den Cache aus zu lassen
Tobi
Hello Tobias,
Thanks for the extention! I’ve installed it manualy on 1.5.0.1 and it works just the way I want!
For the error:
Fatal error: Call to a member function addToChildGroup() on a non-object in htdocs\magento\app\code\core\Mage\Core\Block\Abstract.php on line 649
just remove \ on the line for catalog.xml:
…template=”catalog/product/view/attributesgroups.phtml”/>
should be
…template=”catalog/product/view/attributesgroups.phtml”>
Thanks and have a nice day!
Bruno
BTW I read German, but writing and speaking is a bit rusty after 25 years …
First, thanks a ton on this clean tutorial. Second, is there a way to fix special symbol problem? to be more specific, after installing your code i have “&” instead of “&” everything else is gr8
[...] for the same thing. First, I’m using Magento 1.5.0. Second, I found the answer in German here, with an extension already created, but the installation failed. So, I added [...]
Tell me how this can be done in version 1.6?
I have yet to not succeed.