Как добавить функциональность WYSIWYG в элементы Magento Config

21

Для определенного пользовательского модуля мне нужен элемент конфигурации, чтобы иметь редактор WYSIWYG. На данный момент я использую "textarea" в моей системе xml, чтобы получить нормальную текстовую область.

Я думаю, что мне нужно добавить дополнительный "frontend_type" на основе textarea, чтобы добавить эту функцию все, но мне интересно, есть ли другие / лучшие варианты

configuration

— Рутгер
источник

23

Прежде всего, добавьте это в любой файл макета, чтобы загрузить редактор в разделе конфигурации:

<adminhtml_system_config_edit>
    <update handle="editor"/>
    <reference name="head">
        <action method="setCanLoadTinyMce"><load>1</load></action>
    </reference>
</adminhtml_system_config_edit>

Теперь создайте свой собственный рендерер поля. Это должен быть блок внутри вашего модуля:

<?php
class Namespace_Module_Block_Adminhtml_System_Config_Editor 
    extends Mage_Adminhtml_Block_System_Config_Form_Field 
    implements Varien_Data_Form_Element_Renderer_Interface {

    protected function _getElementHtml(Varien_Data_Form_Element_Abstract $element) {
        $element->setWysiwyg(true);
        $element->setConfig(Mage::getSingleton('cms/wysiwyg_config')->getConfig());
        return parent::_getElementHtml($element);
    }
}

Теперь для элемента внутри system.xml установите frontend_type 'editor' и frontend_model ваш новый блок

<fieldname translate="label">
    <label>Field label </label>
    <frontend_type>editor</frontend_type>
    <frontend_model>module/adminhtml_system_config_editor</frontend_model>
    <sort_order>150</sort_order>
    <show_in_default>1</show_in_default>
    <show_in_website>1</show_in_website>
    <show_in_store>1</show_in_store>
</fieldname>

Существуют некоторые проблемы при изменении области конфигурации на веб-сайт или представление магазина. Текстовая область не становится «отключенной». Но если вы можете игнорировать это, вы можете использовать его без каких-либо проблем.

— Marius
источник

Отличный ответ, у меня сработало.

— Рик Кейперс

Это сработало просто так! +1

— balanv

3

Я хотел добавить это как комментарий, но мне не хватает репутации. Увы, эта информация, несомненно, кому-то полезна.

Когда я реализовал решение Marius, я увидел кнопку «Показать / скрыть редактор», но когда я щелкнул по ней, я получил ошибку javascript:

Uncaught ReferenceError: tinyMceWysiwygSetup is not defined

Быстрый поиск в Google привел меня к этому другому magento stackexchange-вопросу, который предложил, чтобы вам понадобились дополнительные строки в вашем макете, чтобы загрузить весь необходимый javascript в разделе конфигурации. Объединение этого с решением Marius дало мне обновление макета, которое выглядит так:

<!-- Enable wysiwyg for config in admin -->
<adminhtml_system_config_edit>
    <update handle="editor"/>
    <reference name="head">
        <action method="setCanLoadTinyMce"><flag>1</flag></action>
        <!-- Beginning of my additions -->
        <action method="setCanLoadExtJs"><flag>1</flag></action>
        <action method="addJs"><script>mage/adminhtml/variables.js</script></action>
        <action method="addJs"><script>mage/adminhtml/wysiwyg/widget.js</script></action>
        <action method="addJs"><script>lib/flex.js</script></action>
        <action method="addJs"><script>lib/FABridge.js</script></action>
        <action method="addJs"><script>mage/adminhtml/flexuploader.js</script></action>
        <action method="addJs"><script>mage/adminhtml/browser.js</script></action>
        <action method="addJs"><script>prototype/window.js</script></action>
        <action method="addJs"><script>prototype/prototype.js</script></action>
        <action method="addItem"><type>js_css</type><name>prototype/windows/themes/default.css</name></action>
        <action method="addItem"><type>js_css</type><name>prototype/windows/themes/magento.css</name></action>
    </reference>
</adminhtml_system_config_edit>

Вот ссылка на этот другой вопрос: Uncaught ReferenceError: tinyMceWysiwygSetup не определен

— Эрик Систранд
источник

0

Ваши дополнительные дополнения здесь не нужны. Действительно, большинство ваших звонков уже находятся в дескрипторе «редактор». Вот почему мы делаем здесь<update handle="editor"/>

Просто убедитесь, что вы добавляете в дизайн> adminhtml, а не в дизайн> интерфейс

— Sony
источник