Як додати функцію 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.