Kurzinfo


Andreas von Studnitz

mehr »

Andreas von Studnitz arbeitet seit 2012 als Geschäftsführer und Entwickler für die Magento-Agentur integer_net GmbH. Aktuelle Informationen finden Sie unter www.integer-net.de

Kontakt

Telefon:
0170 486 0 464

E-Mail:
avs(at)avs-webentwicklung.de

Twitter: twitter.com/avstudnitz

mehr »

< Magento: Partielle Indizierung von Produkten

Magento: Anlegen eines WYSIWYG-Textfelds für Kunden im Adminbereich

29.06.2012 10:16

Will man im Magento-Adminbereich ein Textfeld mit Formatierungen bereit stellen, ist das für Produkte durch den Administrator machen, für die Kundenansicht aber mit ein paar Schwierigkeiten verbunden. Dieser Artikel zeigt, wie es geht.

Wie man WYSIWYG-Felder in eigenen Formularen anlegt, zeigt ein Artikel von MagePsycho sehr anschaulich. Diese Erkenntnisse in das Anlegen eines neuen WYSIWYG-Felds für Kunden umzusetzen, ist leider etwas komplizierter, v.a. wenn man eine saubere, updatefähige Lösung haben möchte. Den Aufbau eines entsprechenden zeige ich Schritt für Schritt, das fertige Modul gibt es auch zum Download.

Ziel ist es, ein Feld namens "customer_info" anzulegen, in das der Administrator im entsprechenden Formular für seine Kunden eine Information eintragen kann.

Schritt 1: Modul aktivieren

app/etc/modules/AvS_CustomerWysiwygField.xml

<?xml version="1.0"?>
<config>
    <modules>
        <AvS_CustomerWysiwygField>
            <active>true</active>
            <codePool>local</codePool>
        </AvS_CustomerWysiwygField>
    </modules>
</config>

Schritt 2: Modulkonfiguration

app/code/local/AvS/CustomerWysiwygField/etc/config.xml

<?xml version="1.0"?>
<config>
    <modules>
        <AvS_CustomerWysiwygField>
            <version>0.1.0</version>
        </AvS_CustomerWysiwygField>
    </modules>
    <global>
        <models>
            <customerwysiwygfield>
                <class>AvS_CustomerWysiwygField_Model</class>
            </customerwysiwygfield>
        </models>
        <resources>
            <customerwysiwygfield_setup>
                <setup>
                    <module>AvS_CustomerWysiwygField</module>
                    <class>Mage_Customer_Model_Resource_Setup</class>
                </setup>
            </customerwysiwygfield_setup>
        </resources>
    </global>
    <adminhtml>
        <events>
            <adminhtml_block_html_before>
                <observers>
                    <customerwysiwygfield>
                        <type>singleton</type>
                        <class>customerwysiwygfield/observer</class>
                        <method>beforeHtml</method>
                    </customerwysiwygfield>
                </observers>
            </adminhtml_block_html_before>
            <core_block_abstract_prepare_layout_after>
                <observers>
                    <customerwysiwygfield>
                        <type>singleton</type>
                        <class>customerwysiwygfield/observer</class>
                        <method>afterLayoutPrepare</method>
                    </customerwysiwygfield>
                </observers>
            </core_block_abstract_prepare_layout_after>
        </events>
    </adminhtml>
</config>

Hier werden ein Model-Shortcut und das Setup-Verzeichnis definiert. Hierüber wird das neue Kunden-Attribut bei der Installation angelegt. Das Setup-Model Mage_Customer_Model_Resource_Setup wird dabei für das Anlegen von Kundenattributen benötigt.

Dazu kommen zwei Event-Observer, die den WYSIWYG-Editor für das Kundenformular aktivieren.

Schritt 3: Observer

app/code/local/AvS/CustomerWysiwygField/Model/Observer.php

<?php
class AvS_CustomerWysiwygField_Model_Observer extends Mage_Core_Model_Abstract
{
    /**
     * @param Varien_Event_Observer $observer
     */
    public function beforeHtml($observer)
    {
        $block = $observer->getBlock();

        if ($block instanceof Mage_Adminhtml_Block_Customer_Edit_Tab_Account) {

            /** @var $block Mage_Adminhtml_Block_Customer_Edit_Tab_Account */
            /** @var $field Varien_Data_Form_Element_Abstract */
            $field = $block->getForm()->getElement('customer_info');
            if (is_object($field)) {
                $field->setConfig(Mage::getSingleton('cms/wysiwyg_config')->getConfig());
                $field->setWysiwyg(true);
                $field->setStyle('width:400px; height:300px;');
            }
        }
    }

    /**
     * @param Varien_Event_Observer $observer
     */
    public function afterLayoutPrepare($observer)
    {
        $block = $observer->getBlock();

        if ($block instanceof Mage_Adminhtml_Block_Customer_Edit) {

            /** @var $block Mage_Adminhtml_Block_Customer_Edit */
            if (Mage::getSingleton('cms/wysiwyg_config')->isEnabled()) {
                $block->getLayout()->getBlock('head')->setCanLoadTinyMce(true);
            }
        }
    }
}

Die zwei Observer setzen die im oben genannten Artikel aufgeführten Schritte zur Aktivierung des Editors um. Im oberen Observer ist explizit das Feld "customer_info" erwähnt, das angepasst werden muss, um den Editor einzusetzen.

Schritt 4: Setup

app/code/local/AvS/CustomerWysiwygField/sql/customerwysiwygfield_setup/install-0.1.0.php

<?php

/** @var $installer Mage_Customer_Model_Resource_Setup */
$installer = $this;

$installer->startSetup();

$installer->addAttribute('customer', 'customer_info', array(
    'input' => 'editor',
    'type' => 'text',
    'label' => 'Customer Info',
    'visible' => 1,
    'required' => 0,
    'user_defined' => 1,
    'data' => 'eav/attribute_data_textarea',
));

Mage::getSingleton('eav/config')
    ->getAttribute('customer', 'customer_info')
    ->setData('used_in_forms', array('adminhtml_customer'))
    ->save();

$installer->endSetup();

Hier wird das Attribut mit den benötigten Daten angelegt. Besonders wichtig sind dabei der Input-Typ "editor" und das Data-Model "eav/attribute_data_textarea". 

Anschließend wird das neu angelegte Formular noch dem entsprechenden Admin-Formular zugewiesen, damit es auch dargestellt wird. 

Kommentare

Keine Kommentare
Kommentar hinzufügen












Den Code eingeben: *


* - Pflichtfeld