web表单设计器Ueditor Formdesign Plugins安装使用教程

安装扩展

请先下载扩展，建议下载完整带示例包，如果你下载独立扩展包，那你还需要另外下载Ueditor

1. 下载扩展

安装

解压后，这个目录便是表单设计器扩展的全部
独立下载的用户，同样 copy 到 Ueditor 这个目录即安装完成。

./js
--|ueditor
----|formdesign        把扩展放到Ueditor下
--------|bootstrap
--------|leipi.form.design.js
--------|checkbox.html
--------|...
----|dialogs
----|ueditor.all.js
----|...
      

配置说明

FormDesign Plugins 的配置目前只有一个，toolleipi:true它可以在编辑器的toolbars显示表单设计器的图标

建议新建虚拟站点来验证，否则部分功能可能异常，正常访问地址如：http://localhost/formdesign/index.html
如果你显示的页面和官方一样并且没有脚本报错，表示安装成功。官方演示

index.html

<script id="myFormDesign" type="text/plain" style="widht:100%">
    这里是Ueditor FormDesign 内容
</script>

<script type="text/javascript" charset="utf-8" src="js/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="js/ueditor/ueditor.all.js"></script>
<script type="text/javascript" charset="utf-8" src="js/ueditor/lang/zh-cn/zh-cn.js"></script>
<!--Fromdesign扩展--->
<script type="text/javascript" charset="utf-8" src="js/ueditor/formdesign/leipi.form.design.js"></script>
//实例一个Ueditor
var leipiEditor = UE.getEditor('myFormDesign',{
        toolleipi:true,//是否在toolbars显示，表单设计器的图标 
       //toolbars:[['FullScreen', 'Source']],//这里是工具拦
       textarea: 'design_content',//编辑器的表单名称   
        //更多其他参数，请参考ueditor.config.js中的配置项
});