Bilder in Magento widgets

Gibt es ein paar Grund, warum Sie nicht speichern/hochladen des Bildes:

• Form enctype werden muss "multipart/form-data" für einen Datei-upload zu arbeiten
• Auch wenn Sie die form ändern enctype " multipart/form-data " Sie werden feststellen, wenn Sie überwachen die Anforderungen, die es bekommt POST wird als "application/x-www-form-urlencoded" das ist, weil es geschieht durch ajax und ajax selbst nicht Bearbeiten eine Datei hochladen, müssen Sie Sie separat.

Habe ich erfolgreich eine "Bild Einfügen" - Schaltfläche beginnt die Media Library Dialog, wo können Sie durchsuchen Sie Ihre server für Bilder und/oder Bilder hochladen.

Sobald der Benutzer auf "Datei Einfügen" fügt er das vollständige Bild-url in einem Textfeld in der widget-es ist also vorwärts wie ein normales Feld, um Ihre Vorlage.

Dies ist, wie ich es erreicht:

In Ihrem widget.xml geben Sie einen neuen Knoten:

<image translate="label">
    <label>Image</label>
    <visible>1</visible>
    <required>1</required>
    <type>label</type>
    <helper_block>
        <type>widgets/cms_wysiwyg_images_chooser</type>
        <data>
            <button translate="open">
                <open>Insert Image...</open>
            </button>
        </data>
    </helper_block>
</image>

Den Helfer-block Typ <type>widgets/cms_wysiwyg_images_chooser</type> ist eine benutzerdefinierte Klasse, so können Sie es ändern, um alles, was Sie wollen, solange Sie erstellen die Klasse/Dateien korrekt.

<?php
class Stackoverflow_Widgets_Block_Cms_Wysiwyg_Images_Chooser extends Mage_Adminhtml_Block_Template
{
public function prepareElementHtml(Varien_Data_Form_Element_Abstract $element)
{
    $config = $this->getConfig();
    $chooseButton = $this->getLayout()->createBlock('adminhtml/widget_button')
        ->setType('button')
        ->setClass('scalable btn-chooser')
        ->setLabel($config['button']['open'])
        ->setOnclick('MediabrowserUtility.openDialog(\''.$this->getUrl('*/cms_wysiwyg_images/index', array('target_element_id' => $element->getName())).'\')')
        ->setDisabled($element->getReadonly());
    $text = new Varien_Data_Form_Element_Text();
    $text->setForm($element->getForm())
        ->setId($element->getName())
        ->setName($element->getName())
        ->setClass('widget-option input-text');
    if ($element->getRequired()) {
        $text->addClass('required-entry');
    }
    if ($element->getValue()) {
        $text->setValue($element->getValue());
    }
    $element->setData('after_element_html', $text->getElementHtml().$chooseButton->toHtml());
    return $element;
}
}
?>

Und das ist es! Sie sollten nun ein neues Feld in den widget-Optionen namens "Image" mit einem Textfeld und eine Schaltfläche, in die Sie einfügen können die url zu einem Bild auf deinem server und zeigt Sie von Ihrer Vorlage.

Einer kurzen Erläuterung, wie es funktioniert:

Einer Schaltfläche erstellt, die eine onclick - Funktion, die ruft die Media Library Dialog durch aufrufen MediabrowserUtility.openDialog() die zusammen übergeben wird, werden die parameter target_element_id sagt, media library, was element, um den Wert, sobald Sie Benutzer klickt auf "Insert File" also, wir übergeben Sie einfach den id unserer textbox in der widget für Sie, um erhalten die url von dem Bild, das der Benutzer ausgewählt.

Hoffe, dies hilft jemand, da ich nicht finden konnte, keine Ressourcen gibt, die erklärt, wie es zu tun, so verbrachte ich eine ganze Weile Graben durch Magento zu arbeiten Sie alle aus 🙂

Was ich gerne tun würde in der Zukunft ist, so zeigt es das Bild, nachdem Sie es ausgewählt haben, in der widget, und es speichert die url in einem hidden-Feld, aber mit einem onchange binden wird nicht ausgelöst, wenn der Wert eingestellt ist, um das element aus js/mage/adminhtml/browser.js im insert - Funktion, so dass ohne änderung der core-Dateien, die es viel schwerer zu tun. Ich dachte über das spielen, um mit, wenn das Formular den Fokus erhält, auch nach der Media Library schließt oder ein timer (ziemlich dodgey aber funktionieren würde), aber ich habe andere Dinge zu verschieben und zurück kommen können, um es später!

UPDATE:

URL ' s, die Media Library generiert werden, etwa so:

http://www.yourwebsite.com/index.php/admin/cms_wysiwyg/directive/___directive/e3ttZWRpYSB1cmw9Ind5c2l3eWcvd2lkZ2V0cy9iYW5uZXIvaG9tZXBhZ2UvZm9yZWdyb3VuZC9maXNoLXRhbmsucG5nIn19/key/e8167e3884e40b97d8985e7b84e7cbc7875f134e5f7e5946c9c2a482d0279762/

Die zwischengespeicherte Bilder und funktionieren nur, wenn der Benutzer ist ein admin. Dumm? Ja. Wenn Sie das gleiche Bild in einer CMS-Seite, wenn der html-Code wird generiert für die Ausgabe wandelt es um die original-url auf dem server zugänglich über /media/wysiwyg/path/to/file/photo.jpg. Wir benötigen die original-url zu zeigen, um die Anwender, also das, was wir tun können, ist der hook in der Funktion generiert die html-widget (wenn Sie auf "Widget Einfügen") und suchen für /admin/cms_wysiwyg/directive/___directive/ und ersetzen Sie es mit der original-URL auf das Bild als die CMS-Seite tut.

In Ihrem config.xml für Ihre benutzerdefinierte widgets:

<global>
    <models>
        <widget>
            <rewrite>
                <widget>Stackoverflow_Widgets_Model_Widget</widget>
            </rewrite>
        </widget>
    </models>
</global>

Dann das Modell erstellen Widget code\local\Stackoverflow\Widgets\Model\Widget.php:

<?php
class Stackoverflow_Widgets_Model_Widget extends Mage_Widget_Model_Widget
{
    public function getWidgetDeclaration($type, $params = array(), $asIs = true)
    {
        foreach($params as $k => $v){
            if(strpos($v,'/admin/cms_wysiwyg/directive/___directive/') !== false){
                $parts = explode('/',parse_url($v, PHP_URL_PATH));
                $key = array_search('___directive', $parts);
                if($key !== false){
                    $directive = $parts[$key+1];
                    $src = Mage::getModel('core/email_template_filter')->filter(Mage::helper('core')->urlDecode($directive));
                    if(!empty($src)){
                        $params[$k] = parse_url($src, PHP_URL_PATH);
                    }
                }
            }
        }
        return parent::getWidgetDeclaration($type, $params, $asIs);
    }
}

Überschrieben getWidgetDeclaration Funktion, die jedesmal aufgerufen, wenn ein widget-Ausgabe erzeugt eine textarea/wysiwyg und sieht durch alle Parameter, und wenn es findet ein Bild, das verbunden ist, um die admin-cache-findet, die aus dem ursprünglichen image und überschreibt die variable im array und die ursprüngliche Funktion aufrufen mit den Parametern.

Wenn das gecachte Bild nicht gefunden wird die Funktion normal arbeiten.

AKTUALISIERUNG: 13/09/2012

Als Jonathan Day wies darauf hin, Sie zu überschreiben Mage_Widget_Model_Widget_Instance auch, wenn Sie wollen, dass es funktioniert in einer Widget-Instanz.

Hatte ich noch nicht das Bedürfnis ein Bild hinzufügen, um ein widget durch ein Widget-Instanz, bis jetzt und war verwirrt, warum meine Funktion nicht funktioniert, bis ich untersucht und realisiert die "popup" - widget-Instanzen verwenden Mage_Widget_Model_Widget und die widget-Instanzen, die verwendet werden auf eine Widget-Optionen-tab (kein popup) Mage_Widget_Model_Widget_Instance und erstrecken sich nicht Mage_Widget_Model_Widget so tun, Erben nicht die Funktionalität.

Hinzufügen, um die Funktionalität zu Mage_Widget_Model_Widget_Instance fügen Sie einfach die Zeile <widget_instance>Petbarn_Widgets_Model_Widget_Instance</widget_instance> zu Ihrem config.xml so wird es Aussehen:

<global>
    <models>
        <widget>
            <rewrite>
                <widget>Stackoverflow_Widgets_Model_Widget</widget>
                <widget_instance>Stackoverflow_Widgets_Model_Widget_Instance</widget_instance>
            </rewrite>
        </widget>
    </models>
</global>

Dann erstellen die model-Instanz code\local\Stackoverflow\Widgets\Model\Widget\Instance.php:

<?php
class Petbarn_Widgets_Model_Widget_Instance extends Mage_Widget_Model_Widget_Instance
{
    protected function _beforeSave()
    {
        if (is_array($this->getData('widget_parameters'))) {
            $params = $this->getData('widget_parameters');
            foreach($params as $k => $v){
                if(strpos($v,'/cms_wysiwyg/directive/___directive/') !== false){
                    $parts = explode('/',parse_url($v, PHP_URL_PATH));
                    $key = array_search('___directive', $parts);
                    if($key !== false){
                        $directive = $parts[$key+1];
                        $src = Mage::getModel('core/email_template_filter')->filter(Mage::helper('core')->urlDecode($directive));
                        if(!empty($src)){
                            $params[$k] = parse_url($src, PHP_URL_PATH);
                        }
                    }
                }
            }
            $this->setData('widget_parameters', $params);
        }
        return parent::_beforeSave();
    }
}

Dieser Zeit verändern wir die widget_parameters Daten bei Beginn der _beforeSave() - Funktion, so dass es behebt die url, bevor es spart.

Haben Sie auch, um sicherzustellen, die /js/mage/adminhtml/browser.js javascript-Datei enthalten ist (in meinem Fall war es nicht), um die MediabrowserUtility Funktionalität.

Um sicherzustellen, dass es enthalten ist, der einfachste Weg ist es auch für alle von admin (nicht verbringen viel Zeit habe targeting es besser).

Erstellen Sie eine local.xml für adminhtml layouts (wenn Sie nicht bereits eine haben): app\design\adminhtml\default\default\layout\local.xml

<?xml version="1.0"?>
<layout version="0.1.0">
    <default>
        <reference name="head">
            <action method="addJs"><script>mage/adminhtml/browser.js</script></action>
        </reference>
    </default>
</layout>

Damit wird Magento gehören js/mage/adminhtml/browser.js auf jeder Seite der admin so MediabrowserUtility wird immer verfügbar sein.

HINWEIS: ich bin mit Magento Enterprise 1.11.2.0 also ich bin mir nicht sicher, wie verhält es sich auf andere Versionen.

InformationsquelleAutor Kus

Thx krus für Sie beantworten! Ich habe festgestellt, ein schöner Weg, um das problem zu lösen mit den zwischengespeicherten Bild-URLs. Ich selbst musste dies tun, weil Ihre Lösung überschreiben Sie die Widget-Modell hat nicht die Arbeit mit Magento 1.7.0.2.

Also, was ich gemacht habe, ist das hinzufügen eines neuen GET-parameter use_file_url zu der URL für die Auswahl Block:

$url    = $this->getUrl(
    '*/cms_wysiwyg_images/index',
    array(
        'target_element_id' => $element->getName(),
        'use_file_url' => 1
    )
);

Dieser gibt die GET-parameter, um den Medien-browser. Der nächste Schritt ist, übergeben Sie diesen parameter, um die onInsertAction des Mage_Adminhtml_Cms_Wysiwyg_ImagesController. Tun Sie dies tun, müssen Sie das überschreiben der getOnInsertUrl() Funktion der Mage_Adminhtml_Block_Cms_Wysiwyg_Images_Content Block:

public function getOnInsertUrl()
{
    $useFileUrl = (int)$this->getRequest()->getParam('use_file_url', 0);
    return $this->getUrl('*/*/onInsert', array('use_file_url' => $useFileUrl));
}

Dann müssen Sie behandeln die neuen parameter in den Mage_Adminhtml_Cms_Wysiwyg_ImagesController controller:

public function onInsertAction()
{
    $useFileUrl = (int)$this->getRequest()->getParam('use_file_url', 0) == 1 ? true : false;
    $helper     = Mage::helper('cms/wysiwyg_images');
    $storeId    = $this->getRequest()->getParam('store');
    $filename   = $this->getRequest()->getParam('filename');
    $filename   = $helper->idDecode($filename);
    $asIs       = $this->getRequest()->getParam('as_is');

    Mage::helper('catalog')->setStoreId($storeId);
    $helper->setStoreId($storeId);

    if ($useFileUrl == false) {
        $image = $helper->getImageHtmlDeclaration($filename, $asIs);
    } else {
        $image = $helper->getImageMediaUrl($filename);
    }

    $this->getResponse()->setBody($image);
}

Der Letzte Schritt ist das überschreiben der Mage_Cms_Helper_Wysiwyg_Images Helfer und fügen Sie den getImageMediaUrl() Funktion:

public function getImageMediaUrl($filename)
{
    return $this->getCurrentUrl() . $filename;
}

Ich denke, das ist eine ganz hübsche-Ansatz, obwohl Sie zu ovverride 4 Klassen. Aber die übergabe eines GET-parameter zu sein scheint, mehr Zukunft sicher als Analyse der zwischengespeicherten URL.

InformationsquelleAutor Thomas

Es ist keine Datei-uploads für widgets. Um dieses problem zu lösen Sie können magento media-browser und wählen Sie ein Bild, wie für die wysiwyg-editor, aber es gibt andere Problem, den media-browser nicht wieder eine eindeutige url des Bildes.

InformationsquelleAutor Andrey Korolyov