# 富文本编辑器 - [富文本编辑器](#_1) - [通过组件函数](#_2) > 使用前请务必 load()->func('tpl'); 加载模板组件函数，并加载了系统的头部模板文件 #### 富文本编辑器 系统中的富文本编辑器基于百度编辑器（UEditor），微擎扩展其上传图片组件及上传视频组件，还修复了若干bug。下面简单的说一下调用富文本编辑器的几种方法。 ##### 通过组件函数 > tpl\_ueditor($id, $value = '', $options = array()) - $id 生成富文本编辑器的名称，最终提交POST/GET也是通过此名称来取 - $value 默认的文本内容 - $options 参数配置数组，键值说明如下： - height 正整数，结尾不加px。编辑器的高度 ``` {php echo tpl_ueditor('content');} ``` //php 端取值 $\_GPC\['content'\] ``` ##### 通过JS来调用 某些情况您可能不希望直接生成出来富文本编辑器，需要自己定义一些事件或是通过某些条件生成出来编辑器，您可以选择这样的方式来调用，以下给出实例： ``` //在Html页面上还需要调用一个组件函数，只不过是第一个参数传入空值，用于引用各种富文本编辑器的JS文件 {php echo tpl\_ueditor('')} ``` // ueditoroption 这个变量是微擎定义好的百度编辑器的初始化参数，直接使用即可 var editor = UE.getEditor('content', ueditoroption); editor.addListener('contentChange', function() { //此处增加了侦听编辑器内容变化的事件 //do something }); editor.addListener('ready', function(){ //此处增加了侦听编辑器初始化的事件 //do something }); ``` //--> ``` ```