Як додати функцію WYSIWYG до елементів Magento Config


21

Для певного спеціального модуля мені потрібен елемент конфігурації, щоб мати редактор WYSIWYG. На даний момент я використовую "textarea" у своїй системі xml для отримання нормальної textarea.

Я здогадуюсь, що я повинен додати додатковий "frontend_type" на основі textarea, щоб додати цю функціональність, але мені цікаво, чи є інші / кращі варіанти

Відповіді:


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>

Існують деякі проблеми при зміні конфігурації конфігурації на веб-сайті або в представленні магазину. Текстова область не стає "інвалідом". Але якщо ви можете проігнорувати це, ви можете використовувати це без проблем.


Відмінна відповідь, працював на мене.
— Рік Куйперс

Це працювало просто так .. !! +1
— balanv

3

Я хотів додати це як коментар, але мені не вистачає репутації. На жаль, ця інформація, безперечно, корисна для когось.

Коли я реалізував рішення Marius, я побачив кнопку Show / Hide Editor, але, натиснувши на нього, з’явилася помилка javascript:

Uncaught ReferenceError: tinyMceWysiwygSetup is not defined

Швидкий пошук google привів мене до цього іншого питання про magento stackexchange, який підказав, що вам потрібні додаткові рядки у вашій компоновці, щоб завантажити всі необхідні JavaScript у розділі конфігурації. Включення цього рішення з рішенням Маріуса дало мені оновлення макета, яке виглядає приблизно так:

<!-- 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, а не у дизайні> frontend

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.