Editor Setup

categoryHow To edit_calendar04 Apr 2026

Guidelines for Using the Editor Class

The Editor class in GeniXCMS is a centralized registry for WYSIWYG editor engines. It enables modularity by allowing developers to register custom text editors through module initialization. This system decouples the specific editor implementation from the theme templates, ensuring cleaner code and improved resource management.

1. Registering an Editor

To register a new editor engine, use the Editor::register() method. This informs the system about the editor’s availability and provides a callback for asset injection.

Syntax

Editor::register(string $id, string $name, callable $callback);

Example: Registering from a Module

public static function init()
{
    // Register the editor with its setup callback
    Editor::register('my_pro_editor', 'Professional Suite Editor', [self::class, 'setupEditor']);
}

/**
 * The callback is only executed if 'my_pro_editor' is selected in System Settings.
 */
public static function setupEditor()
{
    // 1. Register assets with dependencies and context
    Asset::register('my-editor-css', 'css', Site::$url . '/inc/mod/my-mod/css/editor.css');
    Asset::register('my-editor-js', 'js', Site::$url . '/inc/mod/my-mod/js/editor.js', 'footer', ['jquery']);

    // 2. Enqueue the assets
    Asset::enqueue(['my-editor-css', 'my-editor-js']);

    // 3. Inject initialization scripts as a raw asset
    Asset::load('my-editor-init', 'raw', '<script>/* activation logic */</script>');
}

2. Managing Editor Assets

The setup callback should exclusively use the Asset Class for registration and enqueuing. Modern GeniXCMS 2.0.0 engines utilize this to prevent direct echo operations, which can disrupt the HTML rendering sequence.

Key Considerations:

Dependency Chains: Ensure your editor JS depends on core frameworks like jquery or bootstrap.
Positioning: Load lightweight CSS in the header and heavy initialization scripts in the footer.
Deduplication: The Asset class will automatically prevent the same script from being rendered twice if it's used by multiple components.

3. Using the Editor in Themes

Themes trigger the initialization of the active editor engine by calling Theme::editor(). This method prepares the environment and tells the system that the current view contains textareas with the .editor class.

Theme Template (Latte)

{Theme::editor('full', '400')|noescape}

<div class="mb-3">
    <label>Content</label>
    <textarea name="content" class="form-control editor">
        {$post->content|noescape}
    </textarea>
</div>

When Theme::editor() is executed, the GeniXCMS core will automatically look up the active editor engine and fire its registration callback, ensuring that only the relevant assets for your selected editor (e.g., GxEditor, Summernote) are loaded.

4. Supporting Legacy Hooks

For backward compatibility, the Editor system still supports the editor_type_options filter. If used, the system will attempt to detect the active engine based on the filtered options. However, it's highly recommended to use the Editor::register() method for new modules to take full advantage of the automated callback execution.

Hooks::filter('editor_type_options', function($options) {
    if (!isset($options['my_legacy_editor'])) {
        $options['my_legacy_editor'] = 'Legacy Support Editor';
    }
    return $options;
});