PHPackages hryvinskyi/magento2-configuration-fields - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. hryvinskyi/magento2-configuration-fields ActiveMagento2-module[Utility & Helpers](/categories/utility) hryvinskyi/magento2-configuration-fields ======================================== N/A 1.0.10(3mo ago)330712MITPHP Since May 19Pushed 3mo ago1 watchersCompare [ Source](https://github.com/hryvinskyi/magento2-configuration-fields)[ Packagist](https://packagist.org/packages/hryvinskyi/magento2-configuration-fields)[ RSS](/packages/hryvinskyi-magento2-configuration-fields/feed)WikiDiscussions master Synced 1mo ago READMEChangelog (8)Dependencies (4)Versions (12)Used By (2) Magento 2 Stores Configuration Elements Fields ============================================== [](#magento-2-stores-configuration-elements-fields) A Magento 2 module that provides enhanced UI elements for the Stores > Configuration section, including a user-friendly cron expression editor field. Features -------- [](#features) - **Cron Expression Editor**: Interactive, validated, and human-readable cron field for system configuration. - **Catalog Category Selector**: A custom field type for selecting categories in the system configuration. - **Tag List Input**: Tag-style input for managing lists of values (postcodes, SKUs, keywords, etc.). - **CodeMirror Editor**: Syntax-highlighted code editor supporting multiple languages (CSS, JavaScript, HTML, PHP, SQL, YAML, etc.). - Modern UI/UX with real-time validation and summary. Installation ------------ [](#installation) ### Via Composer [](#via-composer) ``` composer require hryvinskyi/magento2-configuration-fields bin/magento module:enable Hryvinskyi_ConfigurationFields bin/magento setup:upgrade ``` ### Manual Installation [](#manual-installation) 1. Copy the module to `app/code/Hryvinskyi/ConfigurationFields`. 2. Run the following Magento CLI commands: ``` bin/magento setup:upgrade bin/magento setup:di:compile bin/magento cache:flush ``` How It Works ------------ [](#how-it-works) - The module adds a new system configuration field type that renders a cron editor UI. - The editor provides validation, error highlighting, and a summary of the cron schedule. - The value is stored as a standard cron expression string. Example system.xml Usage ------------------------ [](#example-systemxml-usage) ``` Cron Expression Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CronEditor Categories Multiselect Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\UiSelect Categories Select Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\UiSelect Tag list Type a value and press Enter to add. Use % as wildcard. Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\TagList Custom CSS Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CodeMirror\CssEditor Custom JavaScript Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CodeMirror\JavascriptEditor ``` ### Tag List Configuration via DI [](#tag-list-configuration-via-di) For custom TagList configuration, create virtual types in your module's `di.xml`: **Step 1: Create virtual types in di.xml** ``` Enter value and press Enter... ^[A-Za-z0-9%]+$ true \n \n ``` **Step 2: Reference in system.xml** ``` My Tags MyModule\Block\Adminhtml\MyTagList MyModule\Model\Config\Backend\MyTagList ``` ### Configuration Options [](#configuration-options) OptionTypeDefaultDescription`placeholder`string"Type value and press Enter..."Input placeholder text`validation`string`^[A-Za-z0-9]+$`Regex pattern for validation`uppercase`booleantrueAuto-uppercase input values`separator`string`\n`Separator for values (`\n`, `\t`, `,`, etc.)`save_type`stringseparatorStorage format: `json`, `serialized`, or `separator`### Storage Formats [](#storage-formats) Save TypeDescriptionStorage Example`separator`Values separated by a character (default)`VALUE1\nVALUE2\nVALUE3``json`JSON array format`["VALUE1","VALUE2","VALUE3"]``serialized`PHP serialized format`a:3:{i:0;s:6:"VALUE1";...}`### Complete Example [](#complete-example) **di.xml:** ``` Enter pattern... ^[A-Za-z0-9%]+$ true \n separator \n separator ``` **system.xml:** ``` Tag List Tag list comment MyModule\Block\Adminhtml\TagList MyModule\Model\Config\Backend\TagList ``` ### CodeMirror Editor Classes [](#codemirror-editor-classes) The module provides pre-built CodeMirror editor classes for common languages in the `CodeMirror` namespace. Use them directly in your `system.xml`: **Namespace:** `Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CodeMirror\` **Available Editor Classes:** ClassLanguageMode`CssEditor`CSS`css``LessEditor`LESS`text/x-less``ScssEditor`SCSS`text/x-scss``JavascriptEditor`JavaScript`javascript``JsonEditor`JSON`application/json``HtmlEditor`HTML (mixed)`htmlmixed``XmlEditor`XML`xml``PhpEditor`PHP`php``SqlEditor`SQL`sql``YamlEditor`YAML`yaml``MarkdownEditor`Markdown`markdown``ShellEditor`Shell/Bash`shell`**Usage in system.xml:** ``` Custom CSS Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CodeMirror\CssEditor Custom JavaScript Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CodeMirror\JavascriptEditor JSON Configuration Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CodeMirror\JsonEditor Custom HTML Hryvinskyi\ConfigurationFields\Block\Adminhtml\System\Config\Form\Field\CodeMirror\HtmlEditor ``` ### Custom CodeMirror Configuration via DI [](#custom-codemirror-configuration-via-di) For custom configuration (theme, options), create virtual types in your module's `di.xml`: ``` monokai true false ``` **Configuration Options:** OptionTypeDefaultDescription`mode`string(per class)Syntax highlighting mode`theme`string`default`Editor color theme`line_numbers`boolean`true`Show line numbers`line_wrapping`boolean`true`Wrap long lines**Available Themes:** - `default` - Light theme (default) - `monokai` - Dark theme with vibrant colors - `material` - Material Design inspired - `dracula` - Dark purple theme ### CodeMirror UI Component Usage [](#codemirror-ui-component-usage) For UI component forms (admin forms, not system configuration), use the CodeMirror form element. **In your UI component XML:** ``` Hryvinskyi_ConfigurationFields/js/form/element/codemirror ui/form/field css default true true Custom Code text ``` Screenshots ----------- [](#screenshots) [![Cron Editor Example](docs/images/cron-editor-example.gif)](docs/images/cron-editor-example.gif) [![Catalog Categories Example](docs/images/catalog-category-example.png)](docs/images/catalog-category-example.png) [![tag_list.jpg](docs/images/tag_list.jpg)](docs/images/tag_list.jpg) Support ------- [](#support) For issues, questions or contributions, please contact the author or create an issue in the GitHub repository. Author ------ [](#author) - **Volodymyr Hryvinskyi** - Email: - GitHub: License ------- [](#license) This project is licensed under the MIT License. ### Health Score 41 — FairBetter than 89% of packages Maintenance82 Actively maintained with recent releases Popularity20 Limited adoption so far Community13 Small or concentrated contributor base Maturity43 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~26 days Recently: every ~37 days Total 11 Last Release 96d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/e254b6c28f67e639b2beb3f21a80f2b4ff9efc5ee782943d497b73523f630c1d?d=identicon)[hryvinskyi](/maintainers/hryvinskyi) --- Top Contributors [![hryvinskyi](https://avatars.githubusercontent.com/u/9294098?v=4)](https://github.com/hryvinskyi "hryvinskyi (20 commits)") ### Embed Badge ![Health badge](/badges/hryvinskyi-magento2-configuration-fields/health.svg) ``` [![Health](https://phpackages.com/badges/hryvinskyi-magento2-configuration-fields/health.svg)](https://phpackages.com/packages/hryvinskyi-magento2-configuration-fields) ``` ### Alternatives [mollie/magento2 Mollie Payment Module for Magento 2 1121.6M10](/packages/mollie-magento2)[baldwin/magento2-module-url-data-integrity-checker Magento 2 module which can find potential url related problems in your catalog data 281773.3k](/packages/baldwin-magento2-module-url-data-integrity-checker)[yireo/magento2-webp2 Magento 2 module to add WebP support to the Magento frontend 2091.2M7](/packages/yireo-magento2-webp2)[dotdigital/dotdigital-magento2-extension Dotdigital for Magento 2 50374.2k18](/packages/dotdigital-dotdigital-magento2-extension)[lizardmedia/module-varnish-warmer Varnish Cache Warmer Magento2 module by Lizard Media 6276.8k](/packages/lizardmedia-module-varnish-warmer)[fredden/magento2-module-javascript-error-reporting A Magento 2 module which captures JavaScript errors for later review by website administrators 3138.1k](/packages/fredden-magento2-module-javascript-error-reporting) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)