TinyMCE编辑器

转自:http://outofmemory.cn/code-snippet/3763/tinymce-language

tinymce4发布了,比以前的更简洁更漂亮了,下载下来简单的折腾了一下,发现默认的langs目录下没有文件,可以到这里来下载需要的语言包

下载语言包之后需要放在<your tinymce path>/js/tinymce/js/langs/目录下面。

然后再配置tinymce时指定language属性即可,例如下面的例子

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <title>tinymce 4 editor</title>
 5 </head>
 6 <body>
 7
 8 <script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
 9 <script type="text/javascript" src="./js/tinymce/tinymce.min.js"></script>
10 <script type="text/javascript" src="./js/tinymce/jquery.tinymce.min.js"></script>
11 <script type="text/javascript">
12     tinymce.init({
13         selector: "textarea",
14         plugins: [
15             "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker",
16             "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
17             "table contextmenu directionality emoticons template textcolor paste fullpage textcolor"
18         ],
19
20         toolbar1: "undo redo | cut copy paste | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect formatselect fontselect fontsizeselect",
21         toolbar2: " searchreplace | bullist numlist | outdent indent blockquote | link unlink anchor image media code | inserttime preview | forecolor backcolor",
22         toolbar3: "table | hr removeformat | subscript superscript | charmap emoticons | print fullscreen | ltr rtl | spellchecker | visualchars visualblocks nonbreaking template pagebreak restoredraft",
23
24         menubar: false,
25         toolbar_items_size: ‘small‘,
26
27         style_formats: [
28             {title: ‘Bold text‘, inline: ‘b‘},
29             {title: ‘Red text‘, inline: ‘span‘, styles: {color: ‘#ff0000‘}},
30             {title: ‘Red header‘, block: ‘h1‘, styles: {color: ‘#ff0000‘}},
31             {title: ‘Example 1‘, inline: ‘span‘, classes: ‘example1‘},
32             {title: ‘Example 2‘, inline: ‘span‘, classes: ‘example2‘},
33             {title: ‘Table styles‘},
34             {title: ‘Table row 1‘, selector: ‘tr‘, classes: ‘tablerow1‘}
35         ],
36
37         templates: [
38             {title: ‘Test template 1‘, content: ‘Test 1‘},
39             {title: ‘Test template 2‘, content: ‘Test 2‘}
40         ],
41         language:‘zh_CN‘
42     });</script>
43
44 <form method="post" action="somepage">
45     <textarea name="content" style="width:100%"></textarea>
46 </form>
47
48 </body>
49 </html>

TinyMCE编辑器

时间: 2025-01-06 23:42:03

TinyMCE编辑器的相关文章

如何在相同的页面设置多个tinymce编辑器

如何在相同的页面设置多个tinymce编辑器 This example shows how to setup multiple editors on the same page and with different configs. 用于多功能文本框,之前同页面只能用一个tinymce编辑器,百度谷歌没结果,所以整理下代码,以供参考: <script type="text/javascript" src="./tiny_mce/tiny_mce.js">

如何使tinymce编辑器的高度随内容自变化(转载)

如何使tinymce编辑器的高度随内容自变化 最简单的方法就是在配置时添加Autoresize插件: tinymce.init({ selector: "textarea", // change this value according to your HTML plugins: "autoresize"}); 该插件有5个选项,可以设置最大高度.最小高度.距离底部的距离等: tinymce.init({ ... plugins: "autoresize&

Tinymce 编辑器添加自定义图片管理插件

在使用Tinymce的过程中需要用到图片上传功能,而提供的上传插件在上传文件后是给了一个连接地址,就想用户需要什么图片,不能用最直观的方式表现出来么! 虽然官网上也有一个文件管理的插件moxiemanager,可奈何他是收费的!https://www.tiny.cloud/docs/plugins/moxiemanager/ 然后就打算自己弄一个,其实实现效果起来很简单,就只是做了一个类型相册管理的功能,然后在点击图片的时候,将图片的地址信息插入到编辑器里就行了,由于后台用的是layui 的框架

博客园修改TinyMCE编辑器为Markdown编辑器的方法

博客园修改TinyMCE编辑器为Markdown编辑器的方法 登录后点击"我的博客"然后点击"管理"进入管理后台 注意,鉴于个人之间博客的皮肤或布局有所不同,该选项可能并不位于此或表述上有出入 之后再进入"选项"页面并在②处选择Markdown,然后在③处点击保存 Q.E.D. 原文地址:https://www.cnblogs.com/oberon-zjt0806/p/10656581.html

博客园TinyMCE编辑器点击链接直接跳转网站

方法如下,首先打开TinyMCE编辑器,然后再点击编译器下面的html按钮,进入网站代码html编辑界面. 然后将我们需要的网址改成: <a href="我们所需要的网址(前面需要加上相应的http/https协议)">我们所需要的网址(前面需要加上相应的http/https协议)</a> 这里主要用到了html当中锚点的知识,当然你也可以尝试在新的浏览器窗口里进行打开,修改为: <a href="我们所需要的网址(前面需要加上相应的http/h

小板邓:wordpress如何扩展TinyMCE编辑器,添加自定义按钮及功能

文章出处:http://www.cnblogs.com/huangcong/ 在functions.php文件里面添加: add_action( 'admin_init', 'my_tinymce_button' ); function my_tinymce_button() { if ( current_user_can( 'edit_posts' ) && current_user_can( 'edit_pages' ) ) { add_filter( 'mce_buttons', '

黄聪:wordpress如何扩展TinyMCE编辑器,添加自定义按钮及功能

在functions.php文件里面添加: add_action( 'admin_init', 'my_tinymce_button' ); function my_tinymce_button() { if ( current_user_can( 'edit_posts' ) && current_user_can( 'edit_pages' ) ) { add_filter( 'mce_buttons', 'my_register_tinymce_button' ); add_filt

公式for TinyMCE 编辑器@ cnblogs.com

编辑器截图: 行内公式:\(  \[f(x,y,z) = 3y^2 z \left( 3 + \frac{7x+5}{1 + y^2} \right)  \) 行间公式:\\(  \[f(x,y,z) = 3y^2 z \left( 3 + \frac{7x+5}{1 + y^2} \right)  \\) 行内公式: $ \[f(x,y,z) = 3y^2 z \left( 3 + \frac{7x+5}{1 + y^2} \right) $ 行间公式:$$ \[f(x,y,z) = 3y^2

angularjs环境中为Tinymce编辑器取值或赋值

Tinymce版本,5.2.1 html: 取值或赋值, 方法1: 方法2: 原文地址:https://www.cnblogs.com/insus/p/12677535.html