Cách thêm chức năng WYSIWYG vào các mục Cấu hình Magento

Đối với một mô-đun tùy chỉnh nhất định, tôi cần một mục cấu hình để có trình soạn thảo WYSIWYG. Tại thời điểm này, tôi đang sử dụng "textarea" trong hệ thống xml của mình để có được một textarea bình thường.

Tôi đoán là tôi phải thêm một "frontend_type" dựa trên textarea để thêm chức năng này, nhưng tôi tự hỏi liệu có những lựa chọn khác / tốt hơn không

Trước hết hãy thêm phần này vào bất kỳ tệp bố cục nào, để tải trình chỉnh sửa trong phần cấu hình:

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

Bây giờ tạo trình kết xuất trường của riêng bạn. Nó phải là một khối bên trong mô-đun của bạn:

<?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);
    }
}

Bây giờ, đối với phần tử bên trong tệp system.xml, đặt 'trình soạn thảo' frontend_type và frontend_model khối mới của bạn

<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>

Có một số vấn đề khi thay đổi phạm vi cấu hình thành trang web hoặc chế độ xem cửa hàng. Các vùng văn bản không trở thành "khuyết tật". Nhưng nếu bạn có thể bỏ qua điều này, bạn có thể sử dụng nó mà không có bất kỳ vấn đề.

Tôi muốn thêm điều này như một bình luận, nhưng tôi không có đủ danh tiếng. Than ôi, thông tin này chắc chắn hữu ích cho một ai đó.

Khi tôi triển khai giải pháp của Marius, tôi thấy nút Hiển thị / Ẩn Trình chỉnh sửa, nhưng khi tôi nhấp vào nó, tôi đã gặp lỗi javascript:

Uncaught ReferenceError: tinyMceWysiwygSetup is not defined

Một tìm kiếm nhanh trên google đã đưa tôi đến câu hỏi magento stackexchange khác này gợi ý rằng bạn cần các dòng bổ sung trong bố cục của mình để tải tất cả các javascript cần thiết trong phần cấu hình. Kết hợp điều này với giải pháp của Marius đã cho tôi một bản cập nhật bố cục giống như thế này:

<!-- 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>

Đây là liên kết đến câu hỏi khác: Uncaught ReferenceError: tinyMceWysiwygsetup không được xác định

AddJs bổ sung của bạn không cần thiết ở đây. Thật vậy, hầu hết các cuộc gọi của bạn đã có trong "trình soạn thảo". Đó là lý do tại sao chúng tôi làm ở đây<update handle="editor"/>

Chỉ cần đảm bảo rằng phần bổ sung của bạn nằm trong thiết kế> adminhtml chứ không phải trong thiết kế> frontend