如何在自己的项目中引入tinymce富文本编辑器
2016-01-12 16:40
489 查看
1.首先需要在官方网站下载tinymce插件:
官网下载地址:https://www.tinymce.com/
2.将下载到的文件放入自己的项目中
3.在显示html页面引入jquery和tinymce js文件
然后在需要渲染富文本的页面中添加javascript语句:
这些初始化信息是可以自定义的,官方网站有demo介绍,可以跟自己的需要改动
https://www.tinymce.com/docs/demo/basic-example/
详细使用方法还是参照官方文档比较靠谱。。。。
官网下载地址:https://www.tinymce.com/
2.将下载到的文件放入自己的项目中
3.在显示html页面引入jquery和tinymce js文件
<script type="text/javascript" src="/app_3th/jquery/jquery-1.12.0.min.js"></script> <script type="text/javascript" src="/app_3th/tinymce/js/tinymce/tinymce.min.js"></script>
然后在需要渲染富文本的页面中添加javascript语句:
<script> tinymce.init({ mode: 'textareas', height: 500, theme: 'modern', plugins: [ 'advlist autolink lists link image charmap print preview hr anchor pagebreak', 'searchreplace wordcount visualblocks visualchars code fullscreen', 'insertdatetime media nonbreaking save table contextmenu directionality', 'emoticons template paste textcolor colorpicker textpattern imagetools' ], toolbar1: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image', toolbar2: 'print preview media | forecolor backcolor emoticons', image_advtab: true, templates: [ { title: 'Test template 1', content: 'Test 1' }, { title: 'Test template 2', content: 'Test 2' } ], content_css: [ '//fast.fonts.net/cssapi/e6dc9b99-64fe-4292-ad98-6974f93cd2a2.css', '//www.tinymce.com/css/codepen.min.css' ] }); </script>
这些初始化信息是可以自定义的,官方网站有demo介绍,可以跟自己的需要改动
https://www.tinymce.com/docs/demo/basic-example/
详细使用方法还是参照官方文档比较靠谱。。。。
相关文章推荐
- 鸟哥私房菜--第0章 计算机概论
- Windows7 编译 GDAL 库
- Hadoop集群安装(1 master + 2 slave)(ubuntu-14.04.3 + hadoop 2.6.3)
- jQuery Validator 修改提示文字的位置
- ubuntu64使用adt是出错(r文件没有找到)
- jQuery easyUI 用layout 自适应浏览器大小
- codeforces 149E Martian Strings
- 鼠标画上去图片旋转360度
- 【主席树】BZOJ 3207 花神的嘲讽计划Ⅰ
- Netty4版本升级血泪史之线程篇
- iOS界面跳转方式
- 使用postman做接口测试
- VMware下安装rhci-5.8-1
- NHibernate的简单例子
- TCP拥塞控制
- <iOS>XML解析
- iOS拍照后存储照片到相册中
- linux下安装awk
- javax.net.ssl.SSLHandshakeException的解决方法
- font-face跨域办法