PHPackages moxuandi/yii2-editormd - 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. [Parsing & Serialization](/categories/parsing) 4. / 5. moxuandi/yii2-editormd ActiveYii2-extension[Parsing & Serialization](/categories/parsing) moxuandi/yii2-editormd ====================== 开源在线 Markdown 编辑器 v2.2.0.1(6y ago)095MITPHP Since Nov 15Pushed 6y ago1 watchersCompare [ Source](https://github.com/moxuandi/yii2-editormd)[ Packagist](https://packagist.org/packages/moxuandi/yii2-editormd)[ RSS](/packages/moxuandi-yii2-editormd/feed)WikiDiscussions master Synced today READMEChangelog (2)Dependencies (1)Versions (3)Used By (0) [开源在线 Markdown 编辑器 Editor.md for Yii2](http://editor.md.ipandao.com/) ===================================================================== [](#开源在线-markdown-编辑器-editormd-for-yii2) ### 主要特性 [](#主要特性) - 支持“标准”Markdown / CommonMark和Github风格的语法，也可变身为代码编辑器； - 支持实时预览、图片（跨域）上传、预格式文本/代码/表格插入、代码折叠、搜索替换、只读模式、自定义样式主题和多语言语法高亮等功能； - 支持ToC（Table of Contents）、Emoji表情、Task lists、@链接等Markdown扩展语法； - 支持TeX科学公式（基于KaTeX）、流程图 Flowchart 和 时序图 Sequence Diagram; - 支持识别和解析HTML标签，并且支持自定义过滤标签解析，具有可靠的安全性和几乎无限的扩展性； - 支持 AMD / CMD 模块化加载（支持 Require.js & Sea.js），并且支持自定义扩展插件； - 兼容主流的浏览器（IE8+）和Zepto.js，且支持iPad等平板设备； - 支持自定义主题样式； 安装: --- [](#安装) 使用 [composer](http://getcomposer.org/download/) 下载: ``` # 2.2.x(yii >= 2.0.24): composer require moxuandi/yii2-editormd:"~2.2.0" # 开发版: composer require moxuandi/yii2-editormd:"dev-master" ``` 使用: --- [](#使用) 在`View`中添加: ``` 1. 简单调用: $form->field($model, 'content')->widget('moxuandi\editormd\Editormd'); 2. 带参数调用: $form->field($model, 'content')->widget('moxuandi\editormd\Editormd', [ 'editorOptions' => [ 'width' => '100%', 'height' => 640, 'imageUpload' => true, // 启用图片上传 'watch' => false, // 关闭实时预览 ], ]); 3. 不带 $model 调用: \moxuandi\editormd\Editormd::widget([ 'name' => 'content', 'value' => '初始值', 'editorOptions' => [ 'width' => '100%', 'height' => 640, ] ]); 4. 注册js函数和对象: $form->field($model, 'content')->widget('moxuandi\editormd\Editormd', [ 'editorOptions' => [ 'width' => '100%', 'height' => 640, 'toolbarIcons' => new \yii\web\JsExpression('function() { return ["save", "undo", "redo", "bold", "italic", "del", "quote", "hr", "image", "link", "list-ul", "list-ol", "code", "code-block", "table"] }'), 'toolbarCustomIcons' => new \yii\web\JsExpression('{ save: "" }'), ], ]); ``` 在`Controller`中添加(如果不需要图片上传功能, 可以不添加): ``` public function actions() { return [ 'EditormdUpload' => [ 'class' => 'moxuandi\editormd\UploaderAction', 'config' => [ 'imageAllowFiles' => ['.jpg', '.jpeg', '.gif', '.png', '.bmp', '.webp'], // 允许上传的文件类型 'imagePathFormat' => '/uploads/image/{yyyy}{mm}{dd}/{hh}{ii}{ss}_{rand:6}', // 文件保存路径 'modelClass' => 'common\model\Upload', // 文件信息是否保存入库 'process' => [ // 二维数组, 将按照子数组的顺序对图片进行处理 'match' => ['image', 'process'], // 图片处理后保存路径的替换规则, 必须是两个元素的数组 'thumb' => [ // 缩略图配置 'width' => 300, // 缩略图宽度 'height' => 200, // 缩略图高度 'mode' => 'outbound', // 生成缩略图的模式, 可用值: 'inset'(补白), 'outbound'(裁剪, 默认值) ], 'crop' => [ // 裁剪图配置 'width' => 300, // 裁剪图的宽度 'height' => 200, // 裁剪图的高度 'top' => 200, // 裁剪图顶部的偏移, y轴起点, 默认为`0` 'left' => 200, // 裁剪图左侧的偏移, x轴起点, 默认为`0` ], 'frame' => [ // 添加边框的配置 'margin' => 20, // 边框的宽度, 默认为`20` 'color' => '666', // 边框的颜色, 十六进制颜色编码, 可以不带`#`, 默认为`666` 'alpha' => 100, // 边框的透明度, 可能仅`png`图片生效, 默认为`100` ], 'watermark' => [ // 添加图片水印的配置 'watermarkImage' => '/uploads/watermark.png', // 水印图片的绝对路径 'top' => 100, // 水印图片的顶部距离原图顶部的偏移, y轴起点, 默认为`0` 'left' => 200, // 水印图片的左侧距离原图左侧的偏移, x轴起点, 默认为`0` ], 'text' => [ // 添加文字水印的配置 'text' => 'TONGMENGCMS', // 水印文字的内容 'fontFile' => '@yii/captcha/SpicyRice.ttf', // 字体文件, 可以是绝对路径或别名 'top' => 100, // 水印文字距离原图顶部的偏移, y轴起点, 默认为`0` 'left' => 200, // 水印文字距离原图左侧的偏移, x轴起点, 默认为`0` 'fontOptions' => [ // 字体属性 'size' => 12, // 字体的大小, 单位像素(`px`), 默认为`12` 'color' => 'fff', // 字体的颜色, 十六进制颜色编码, 可以不带`#`, 默认为`fff` 'angle' => 0, // 写入文本的角度, 默认为`0` ], ], 'resize' => [ // 调整图片大小的配置 'width' => 300, // 图片调整后的宽度 'height' => 200, // 图片调整后的高度 'keepAspectRatio' => true, // 是否保持图片纵横比, 默认为`true` 'allowUpscaling' => false, // 如果原图很小, 图片是否放大, 默认为`false` ], ], // 如果`uploads`目录与当前应用的入口文件不在同一个目录, 必须做如下配置: 'rootPath' => dirname(dirname(Yii::$app->request->scriptFile)), 'rootUrl' => 'http://image.advanced.ccc', ], ], ]; } ``` 编辑器相关配置，请在视图`view`中配置，参数为`editorOptions`，比如定制菜单，编辑器大小等等，[可用配置项](https://github.com/pandao/editor.md/blob/master/editormd.js#L91)如下: 配置项类型默认值配置说明modestring"gfm"namestring""valuestring""themestring""主题editorThemestring"default"previewThemestring""markdownstring""appendMarkdownstring""widthstring"100%"heightstring"100%"pathstring"./lib/"pluginPathstring""delayint300延迟解析标记为HTML, 单位:msautoLoadModulesbooltrue自动加载相关模块文件watchbooltrue是否开启实时预览placeholderstring"Enjoy Markdown! coding now..."gotoLinebooltruecodeFoldboolfalseautoHeightboolfalseautoFocusbooltrue是否启用自动对焦编辑器左侧输入区域autoCloseTagsbooltruesearchReplacebooltrue是否启用搜索和替换功能syncScrollingbooltrue同步滚动, "single"表示单向同步readOnlyboolfalsetabSizeint4indentUnitint4lineNumbersbooltruelineWrappingbooltrueautoCloseBracketsbooltrueshowTrailingSpacebooltruematchBracketsbooltrueindentWithTabsbooltruestyleSelectedTextbooltruematchWordHighlightbooltruestyleActiveLinebooltruedialogLockScreenbooltruedialogShowMaskbooltruedialogDraggablebooltruedialogMaskBgColorstring"#fff"dialogMaskOpacityfloat0.1fontSizestring"13px"saveHTMLToTextareaboolfalsedisabledKeyMapsarray\[\]onloadfunctionfunction() {}onresizefunctionfunction() {}onchangefunctionfunction() {}onwatchfunctionnullonunwatchfunctionnullonpreviewingfunctionfunction() {}onpreviewedfunctionfunction() {}onfullscreenfunctionfunction() {}onfullscreenExitfunctionfunction() {}onscrollfunctionfunction() {}onpreviewscrollfunctionfunction() {}imageUploadboolfalse是否启用图片上传imageFormatsarray\["jpg", "jpeg", "gif", "png", "bmp", "webp"\]允许上传的图片格式imageUploadURLstring""后端接收图片上传的URLcrossDomainUploadboolfalse是否启用跨域上传uploadCallbackURLstring""跨域上传的回调URLtocbooltruetocmboolfalsetocTitlestring""tocDropdownboolfalsetocContainerstring""tocStartLevelint1htmlDecodeboolfalsepageBreakbooltrueatLinkbooltrueemailLinkbooltruetaskListboolfalseemojiboolfalsetexboolfalseflowChartboolfalsesequenceDiagramboolfalsepreviewCodeHighlightbooltruetoolbarbooltruetoolbarAutoFixedbooltruetoolbarIconsstring"full"toolbarTitlesobject{}toolbarHandlersobjecttoolbarCustomIconsobjecttoolbarIconsClassobject{}toolbarIconTextsobject{}langobject ### Health Score 26 — LowBetter than 43% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity9 Limited adoption so far Community7 Small or concentrated contributor base Maturity58 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 ~55 days Total 2 Last Release 2314d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/38183123fe75b8fbe91f8cde1a806d5fd9d0913edbbc53a1ae7d89c7907bbb9a?d=identicon)[moxuandi](/maintainers/moxuandi) --- Top Contributors [![moxuandi](https://avatars.githubusercontent.com/u/22020977?v=4)](https://github.com/moxuandi "moxuandi (11 commits)") --- Tags htmlmarkdownyii2extensioneditor.md ### Embed Badge ![Health badge](/badges/moxuandi-yii2-editormd/health.svg) ``` [![Health](https://phpackages.com/badges/moxuandi-yii2-editormd/health.svg)](https://phpackages.com/packages/moxuandi-yii2-editormd) ``` ### Alternatives [kartik-v/yii2-markdown Advanced Markdown editing and conversion utilities for Yii Framework 2.0 88265.8k6](/packages/kartik-v-yii2-markdown)[pixel418/markdownify The HTML to Markdown converter for PHP 196800.8k8](/packages/pixel418-markdownify)[interaction-design-foundation/nova-html-card A Laravel Nova card to display arbitrary HTML content 67731.2k3](/packages/interaction-design-foundation-nova-html-card) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)