TinyMCE Editor(https://www.tinymce.com/features/) is an online text editor,

it is used to write posts on blog, email, or something else. It is quite convenient

to build application we want. Just add the tinymce js to the website and configure

it. In TinyMCE official website, many features are shown, we can add what we want.

<!DOCTYPE html>

<html>

<head>

    <script src="./js/tinymce/tinymce.min.js"></script>

    <script>

      tinymce.init({

        selector: 'textarea',

        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 codesample toc'

        ],

        toolbar1: 'undo redo | insert | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',

        toolbar2: 'print preview media | forecolor backcolor emoticons | codesample',

        image_advtab: true,

        templates: [

          { title: 'Test template 1', content: 'Test 1' },

          { title: 'Test template 2', content: 'Test 2' }

        ],

        content_css: [

          // '//www.fonts.com/css?family=Lato:300,300i,400,400i',

          './css/codepen.min.css'

        ]

      });

    </script>

</head>

<body>

  <textarea>Easy (and free!) You should check out our premium features.</textarea>

</body>

</html>

　　

TinyMCE Editor的更多相关文章

  1. TinyMCE（富文本编辑器）

    [转]TinyMCE(富文本编辑器)在Asp.Net中的使用方法 官网演示以及示例代码:https://www.tinymce.com/docs/demo/image-tools/ 转自:http:/ ...

  2. TinyMce 使用初探

    https://www.cnblogs.com/nkxyf/p/3883586.html 参考:http://www.tinymce.com/    官网 http://www.tinymce.com ...

  3. Vue CLI 3+tinymce 5富文本编辑器整合

    基于Vue CLI 3脚手架搭建的项目整合tinymce 5富文本编辑器,vue cli 2版本及tinymce 4版本参考:https://blog.csdn.net/liub37/article/ ...

  4. 【转】TinyMCE（富文本编辑器）

    效果预览:http://www.tinymce.com/tryit/full.php [转]TinyMCE(富文本编辑器)在Asp.Net中的使用方法 转自:http://www.cnblogs.co ...

  5. NopCommerce 3.80框架研究（三）替换tinymce 为KindEditor

    NopCommerce 自带的编辑器tinymce 功能不是很全.所以尝试将其替换为功能更强大的 KindEditor 并替实现文件上传和在线浏览功能 首先下载 并解压到如下位置 请注意这里是部署在N ...

  6. MVC.Net5：添加Tinymce的图片上传功能

    Tinymce是目前几个主流的Web文本编辑器之一,不过它的图片上传功能是要收费的,而其它几个免费的上传图片的插件支持的都是PHP.那么就只能自己动手写一个了(源代码下载). 准备工作如下:1.   ...

  7. 富文本编辑器 tinymce 的安装与使用

    百度的富文本编辑器大家都熟悉,那么下面给大家介绍一款富文本编辑器tinymce ,个人感觉比百度的界面好看,调用方便,就不知道各位大神怎么看咯! tinymce中文文档 以下是vue中使用示例,献上最 ...

  8. 15、Vue CLI 3+tinymce 5富文本编辑器整合

    富文本编辑器里大佬们都说tinymce NB! 插件安装 inymce官方提供了一个vue的组件tinymce-vue 如果有注册或购买过服务的话,直接通过组件配置api-key直接使用,懒的注册或者 ...

  9. tinymce + vue 富文本编辑

    用texterea最多支持换行,如果文本信息想要更加丰富一些,比如增加格式样式,比如增加图片,textarea就爱莫能助了 在网上搜寻了一番,发现tinymce是比较方便好用的一款富文本编辑 http ...

随机推荐

  1. stark组件开发之URL分发和默认Handler

    为register 函数添加一个,prev参数,默认None ,用于可以让用户自己指定前缀. def register(self, model_class, handler_class=None, p ...

  2. C语言常用关键字及运算符操作

    1.关键字 (1)数据类型 char                          1字节,8bit==256 int long,short unsgined  ,signed      无符号为 ...

  3. jquery的validate表单验证

    html: <form id="reg" action="123.html"> <p class="myerror"> ...

  4. 9.28 h5日记

    9.28 1.transparent 透明的 颜色 2.placeholder 提示语 在input中使用 跟velue不同 3.写页面需要注意的 (1)页面一定要有层次,分清层次 (2)保证元素模块 ...

  5. PAT 1039 到底买不买（20）（20 分）

    1039 到底买不买(20)(20 分) 小红想买些珠子做一串自己喜欢的珠串.卖珠子的摊主有很多串五颜六色的珠串,但是不肯把任何一串拆散了卖.于是小红要你帮忙判断一下,某串珠子里是否包含了全部自己想要 ...

  6. hdu 5475(2015上海网赛) An easy problem

    题目;http://acm.hdu.edu.cn/showproblem.php?pid=5475 题意就是给X赋初值1,然后给Q个操作,每个操作对应一个整数M:如果操作是1则将X乘以对应的M,如果是 ...

  7. 关于ip包长度

    http://blog.csdn.net/naturebe/article/details/6712153 这篇文章总结的不错,转自:http://hi.baidu.com/to_wait/blog/ ...

  8. BZOJ1178或洛谷3626 [APIO2009]会议中心

    BZOJ原题链接 洛谷原题链接 第一个问题是经典的最多不相交区间问题,用贪心即可解决. 主要问题是第二个,求最小字典序的方案. 我们可以尝试从\(1\to n\)扫一遍所有区间,按顺序对每一个不会使答 ...

  9. Luogu 1415-拆分数列-动态规划

    Solution 首先要找到使得最后一个数最小, 只需定义一个数组$pre[i]$ 从区间$[pre[i], i]$表示的数, 是最小的能使前面的数递增的方案. $[ pre[n], n]$即为最小的 ...

  10. VS2010配置OpenGL开发环境

    OpenGL(Open Graphics Library)是一个跨编程语言.跨平台的专业图形程序接口.OpenGL是SGI公司开发的一套计算机图形处理系统,是图形硬件的软件接口,任何一个OpenGL应 ...