TinyMCE的使用-安装

TinyMCE安装非常简单,它可以被初始化为<form>标签中的<textarea>,当提交表单时,TinyMCE编辑器的内容将作为<form>表单的一部分被提交。

步骤1:下载TinyMCE并将其放在网站服务器目录

  • 下载TinyMCE
  • 将得到的zip包加压,复制"tinymce/js/tinymce"目录到服务器根目录,如(/var/www/html)

步骤2:将TinyMCE添加到html页面

将下面这段脚本放在html页面的<head>标签中

<script type="text/javascript" src="<your installation path>/tinymce/tinymce.min.js"></script>

步骤3:初始化TinyMCE为web表单的一部分

包含以上脚本后,就可以将TinyMCE插入网页的任何元素中。

TinyMCE可以通过CSS3选择器识别元素,只需将一个包含选择器的对象传递给tinymce.init()即可。

如以下这个例子:

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="<your installation path>/tinymce/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
            selector: "#mytextarea"
        });
    </script>
</head>
<body>
    <h1>TinyMCE Getting Started Guide</h1>
    <form method="post">
        <textarea id="mytextarea"></textarea>
    </form>
</body>
</html>

步骤4:使用<form>的POST方法保存内容

当提交表单时,TinyMCE编辑器模仿正常HTML<textarea>标签的行为,不需要其他额外的配置。

时间: 2024-10-06 21:12:29

TinyMCE的使用-安装的相关文章

django 富文本编辑器

创建工程,数据中数据格式设置为 models.TextField() 此时编辑器是普通的文本框. 使用 tinymce 1.安装 django-tinymce pip install django-tinymce 1 2.INSTALLED_APPS 中添加 'tinymce', 3.模型文件中导入包 from tinymce.models import HTMLField 1 4.设置模型成员类型: scontend = HTMLField() 1 5.更改编辑器样式: setting.py文

Vue项目增加TinyMec富文本编辑器组件

TinyMec富文本编辑器开源,而且开发人员对他的支持比较好,所以选用了它 https://liubing.me/vue-tinymce-5.html 基于Vue CLI 3脚手架搭建的项目整合tinymce 5富文本编辑器,vue cli 2版本及tinymce 4版本参考:https://blog.csdn.net/liub37/article/details/83310879做了些小修改,详情见github Github:https://github.com/liub1934/vue-us

drupal7编辑器TinyMCE安装,整合IMCE

Drupal7安装TinyMCE 1. 安装模块WysiWYG:下载地址:https://www.drupal.org/project/wysiwyg. 2. 启用模块WysiWYG:admin/modules. 3. 登录admin/config/content/wysiwyg:根据提示地址下载TinyMCE的library 下载地址:http://www.tinymce.com/ 解压TinyMCE的zip到sites\all\libraries\tinymce, 回到drupal的admi

TinyMCE:下载、安装、配置

第一步:下载 官网下载:https://www.tiny.cloud/download/ TinyMCE从4.0开始,不再支持直接下载,而是直接使用提供免费的CDN,让用户免除安装过程,可以在网站中使用TinyMCE,但是这样会导致无法DIY程序,所以大叔还是提供了下载版本 百度网盘:https://pan.baidu.com/s/1FxqpYHNLayF0dZs9GqxZUg访问密码:pasm 第二步:安装 解压程序包,找到目录:xxx -> js -> tinymce 此文件夹为程序运行核

angular的编辑器tinymce

效果图 通过nodejs的 npm 的bower安装依赖安装, 命令行下执行 bower install angular-ui-tinymce ; 注意(bower和git要是本地的全局变量) 等待bower自动下载完毕以后,在DEMO的页面引用几个JS文件; 1 2 3 <script type="text/javascript" src="app/bower_components/tinymce/tinymce.js"></script>

Django Tinymce 加入 syntaxhl(语法高亮插件)

首先看这篇文章安装Tinymce:http://blog.csdn.net/dreamzml/article/details/8842409 接下来似乎网上有一两种方法 ,我只说我成功的一种 1 下载syntaxhighlighter 3.0.83,解压复制到Django的静态目录(我的是static/) 2 下载syntaxhl,复制到tinymce的plugin目录下(我在静态目录下和tinymce app的目录下都放了,肯定是多放了一个) 3 以下字段加进主settings.py 1 #T

TinyMCE的使用-语言配置

从TinyMCE 4.x开始,使用Transifex服务处理翻译问题. TinyMCE默认使用英语,如果需要使用其他语言,可从这里下载相应的语言文件. 安装语言包 下载所需语言(汉语zh_CN.js) 将zh_CN.js放到tinymce/langs目录中 修改tinymce.init({...})中的配置,增加语言选项,对于汉语: language: "zh_CN" 到此就万事具备了 备注:这里并不需要将zh_CN.js文件引入html页面中,应该是属于自动加载的.

部署基于Centos7的Zimbra邮件系统-之二系统准备及安装

继续上一章进行系统准备和Zimbra系统的安装. Allow iptables to by-pass all zimbra ports. Disable other services and firewall Configure iptables to allow email server traffic [[email protected] ~]#vi /etc/sysconfig/iptables Add the following -A INPUT -m state –state NEW

TinyMce 使用初探

参考:http://www.tinymce.com/    官网 http://www.tinymce.com/wiki.php    wiki 尤其第二项Configuration尤为有用 http://blog.csdn.net/chenloveyue/article/details/7039913     相关配置文件中文注释 版本: TinyMce 4.X 1. 安装     下载解压缩即可 2. Demo      1 <!DOCTYPE HTML> 2 <html lang=