自定义tinymce 4.0.5 styleselect工具栏菜单

2023-11-24

我正在尝试自定义默认值styleselect工具栏菜单,这样我就可以向其中添加自定义菜单元素。这个想法是将字体大小设置为styleselect子菜单:

我初始化了一个TinyMCE 4.0.5通过以下方式:

tinymce.init(
{
    language_url : '/webobbywebapp/js/tiny_mce/language/es.js',
    selector:'textarea',
    plugins: "image, link, print",
    toolbar: "styleselect | undo redo | removeformat | bold italic underline |  aligncenter alignjustify  | bullist numlist outdent indent | link | print | fontselect fontsizeselect",
    menubar: false,
    statusbar: true,
    resize: true
});

由于我无法找到如何自定义默认样式选择菜单,因此我还尝试创建一个完整的新菜单,在其中可以添加字体大小控制。但我不想显示任何工具栏,我想要一个菜单​​栏。

编辑:现在我正在尝试使用以下代码修改 styleselect 菜单,但 fontselect 和 fontsizeselect 显示为禁用



,style_formats:
[{
    title: "Headers_",
    items: [{title: "Header 1",format: "h1"}, {title: "Header 2",format: "h2"}, {title: "Header 3",format: "h3"}, {title: "Header 4",format: "h4"}, {title: "Header 5",format: "h5"}, {title: "Header 6",format: "h6"}]
}, 
            {title: "_Inline",items: [{title: "Bold",icon: "bold",format: "bold"}, {title: "Italic",icon: "italic",format: "italic"}, 
            {title: "_Underline",icon: "underline",format: "underline"}, {title: "Strikethrough",icon: "strikethrough",format: "strikethrough"}, {title: "Superscript",icon: "superscript",format: "superscript"}, {title: "Subscript",icon: "subscript",format: "subscript"}, {title: "Code",icon: "code",format: "code"}]}, 
            {title: "_Blocks",items: [{title: "Paragraph",format: "p"}, {title: "Blockquote",format: "blockquote"}, {title: "Div",format: "div"}, {title: "Pre",format: "pre"}]}, 
            {title: "_Alignment",items: [{title: "Left",icon: "alignleft",format: "alignleft"}, {title: "Center",icon: "aligncenter",format: "aligncenter"}, {title: "Right",icon: "alignright",format: "alignright"}, {title: "Justify",icon: "alignjustify",format: "alignjustify"}]}, 
            {title: "Classes", items: 'fontsizeselect'},
    {title: "dddClasses", items: 'fontselect'
}]
  

从版本 4.0.13 开始,您可以在 init 期间使用一个新属性,称为样式格式合并。将此属性设置为 true,它将把您的样式连接到默认集。

tinymce.init({
    style_formats_merge: true,
    style_formats: [
        {
            title: 'Line Height',
            items: [
                { title: 'Normal Line Height', inline: 'span', styles: { "line-height": '100%' } },
                { title: 'Line Height + 10%', inline: 'span', styles: { "line-height": '110%' } },
                { title: 'Line Height + 50%', inline: 'span', styles: { "line-height": '150%' } },
                { title: 'Line Height + 100%', inline: 'span', styles: { "line-height": '200%' } }
            ]
        }
    ]
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

自定义tinymce 4.0.5 styleselect工具栏菜单 的相关文章

  • Tinymce 无法在 angularjs mdDialog 中工作

    我正在尝试在 angularjs mdDialog 中使用 TinyMCE 编辑器 工作拔毛工 http embed plnkr co s3NsemdcDAtG7AoQRvLh http embed plnkr co s3NsemdcDAt
  • Tinymce - 插入 html 代码

    如果有人可以帮助我解决这个问题 我将不胜感激 我已经尝试解决了几天 但没有成功 我制作了将图像插入代码的自定义按钮 这是文本版本 a href Insert Image a 问题是我不允许使用引号 所以我必须使用 alt Some valu
  • 使用tinyMCE 获取内容?

    我有一个tinyMCE textarea frmbody并且正在使用它的jquery实例
  • 将 S3 上传/浏览与 django-tinymce 集成

    我一直在寻找有关如何将 Amazon S3 与 TinyMCE 集成的资源 到目前为止我想到的最好的链接是 http forums aurigma com yaf postst4033 Amazon S3 File Manager for
  • 使用 TinyMCE 突出显示文本

    目前我有一个使用 TinyMCE 的文本区域 http fiddle tinymce com D2gaab http fiddle tinymce com D2gaab 我想突出显示左大括号 右大括号之间的文本 有人知道这是否可能 以及我该
  • 向 TinyMCE 文本区域添加边框半径

    是否可以为 TinyMCE 的文本区域添加边框半径 我的输入字段等上有圆角 但我无法让它在我的文本区域上工作 这有点杀了我 可能是因为 TinyMCE 将它变成了 IFRAME 有没有办法解决 多谢 一种解决方案是使用editor css设
  • 如何删除tinymce中自动添加的p标签

    我使用的是tinymce 4 0 1 当您开始输入或按回车键时 它会自动添加 p 标签 如何动态删除这些 p 标签 然后将内容重新插入编辑器 您需要将以下行添加到 init 语句中 forced root block 所以 你的完整代码将是
  • 在tinymce中禁用自动moxieplayer换行

    我构建了一个功能 可以上传 转换视频 然后将视频嵌入到tinymce 中 Tinymce 使用他们的 moxieplayer swf 不断用一些 html 封装我的视频嵌入 我想对这些视频使用自定义视频播放器 但当 tinymce 的行为如
  • 动态获取 TinyMCE 设置(将它们应用到另一个 init)

    我如何获得 TinyMCEsettings https www tinymce com docs api class tinymce init 我想从第一个编辑器中获取它们并存储在变量中 第一个或最后一个并不重要 只要相关脚本不依赖 id
  • TINYMCE 设定焦点...只是行不通

    我试过了 tinyMCE execInstanceCommand content mceFocus 我试过了 tinyMCE execCommand mceFocus false content 它们似乎都不起作用 好吧 我陷入了同样的问题
  • TinyMCE客户端验证问题

    我在使用 TinyMCE 编辑器时遇到问题 我的表单带有很少的文本字段和文本区域 tinymce 并启用了客户端验证 当我单击 保存 按钮时 所有文本字段都会进行验证 但需要单击两次才能验证tinymce内容 此外 验证仅在字段为空或条件不
  • 在当前位置插入文本 TINYMCE IE9

    如何将文本插入到tinyMce编辑器的当前位置 它在 Chrome FF Safari 中完美运行 但在 IE 中它始终从文本区域的顶部开始 我目前执行以下操作 tinyMCE execCommand mceInsertContent fa
  • 如何在 TinyMCE 中允许自闭合标签?

    我的视频元素内的源标签需要自动关闭 这样 iPad 才不会开始抱怨 我输入
  • 如何防止诸如tailwind css和bootstrap之类的css库影响所见即所得编辑器html内容(如Tinymce、Ckeditor)?

    拥有 TinyMCE 编辑器 它为我提供了正确的 html 标签输出 例如 h1 h2 b ul ol li 像这样 然而 当我想在我自己的前端 由 TailWindCSS 或 Bootstrap 组成 中准确渲染 TinyMCE 的输出时
  • textarea、tinyMCE 并在 textarea 中插入图像

    我想用 jquery 在文本区域中插入图像 我知道 img 标签无法插入到文本区域中 我正在使用tinymce img src image jpg class po
  • TinyMCE 4 禁用清理 html

    如何在 TinyMCE 4 x 中禁用 HTML 代码的自动清理 当我从 WORD 复制文本时 TinyMCE 会删除样式 tinyMCE init cleanup false verify html false
  • 获取 TinyMCE 4 Font Sizes 下拉菜单以将字体大小设置为 px 而不是 pt

    有没有人找到一种方法可以使 TinyMCE 4 字体大小下拉菜单提供以 px 而不是 pt 为单位的字体大小 Thanks 您需要使用fontsize formats option http www tinymce com wiki php
  • TinyMCE有效元素:只允许特定的CSS规则

    小MCE的valid elements属性允许您定义有效 HTML 元素及其属性的白名单 您可以仅允许段落和链接 tinyMCE init valid elements p a href 但是 那style属性有点问题 它对于某些事情 例如
  • ASP.Net 4.0 与 TinyMCE 和 XML 编码在回发时重新编码内容

    我有一个基于 ASP NET 4 0 的 CMS 我在其中通过 jQuery 使用 TinyMCE 3 4 来编辑一个文本框 除此之外 我还有其他几个文本框 页面上还有另一个下拉列表 用于控制内容类型 该控件启用了自动回发并设置有关所选项目
  • jQuery.post 改变 HTML 中的一些特殊字符

    TinyMCE 中的示例数据 和 以上HTML代码 p 10003 and 9786 9999 9986 p 之前 工作正常 在保存的文档中获得相同的字符 function save and submit var tinyGenData t

随机推荐

  • 如何让docker-compose在M1芯片上工作?

    我是 m1 macbook 的新手 在运行 docker compose 时遇到问题 如下所示 version 3 7 services search platform linux x86 64 build context dockerfi
  • 在 PyTorch 中用向量替换对角线元素

    我一直在到处寻找与 PyTorch 等效的东西 但我找不到任何东西 L 1 np tril np random normal scale 1 size D D k 0 L 1 np diag indices from L 1 np exp
  • 如何在 Discord.js 中检查消息是否为私信?

    目前我使用的是最新版本Discord js v13 1 0 我希望能够检测某条消息是否是 DM 我尝试制作一个messageCreate事件并执行 if 语句来检查通道是否为 DM client on messageCreate messa
  • “以不同用户身份运行”Visual Studio,无法清除缓存的 TFS 凭据

    Update我设法通过向用户授予使用凭据集 2 远程连接到桌面的权限来解决此问题 从而能够从凭据管理器中删除存储的凭据 I log onto my server with one set of credentials and open Vi
  • Spring安全过滤器身份验证成功但发回403响应

    我有一个带有以下网络安全配置的 Spring Boot 应用程序 Override protected void configure HttpSecurity http throws Exception http sessionManage
  • 使用 TypeScript 和 React-Redux 时推断映射的 props

    我找到了一种在使用时获得类型安全的方法mapStateToProps from react redux as 有记录的您可以定义一个接口并参数化React Component
  • std::async 不能异步工作

    我有以下非常简单的代码 void TestSleep std cout lt lt TestSleep lt lt std endl sleep 10 std cout lt lt TestSleep Ok lt lt std endl v
  • 使用 tc 模拟特定端口上的网络延迟

    我正在尝试使用 ubuntu 上的 tc 命令模拟来自源端口 7000 的 tcp 数据包的固定时间延迟 我使用的命令是 sudo tc qdisc add dev eth1 root handle 1 prio sudo tc qdisc
  • 将 Curl 客户端 ssl 移至 Guzzle

    我正在使用 Guzzle v3 9 2 以及 php 5 3 和 php 5 5 我有以下使用 ssl 客户端证书的工作卷曲代码 url https example com cert file path to certificate pem
  • SPARQL 查询传递

    我是 SPARQL 的初学者 想知道是否有一个查询可以帮助我返回传递关系 例如下面的 n3 文件 我想要一个返回 a 与 c 相同 或类似内容的查询 谢谢 prefix
  • 我们如何或可以通过 npm 与 Meteor 使用节点模块?

    我们如何或者我们可以通过 npm 使用节点模块Meteor 或者这取决于包装API 或者有推荐的规定方法吗 流星1 3于 2016 年 3 月 28 日发布 为应用程序提供完整的 ES6 ES2015 模块支持和开箱即用的 NPM 支持 应
  • ASP.Net Core:使用共享项目在多个项目之间共享静态资源(css / js)

    从这里汲取灵感 http rion io 2017 03 22 sharing is caring using shared projects in asp net 我尝试使用共享项目在多个 ASP Net Core 项目之间共享静态资产
  • 正则表达式匹配最后一个空格字符

    我需要一些帮助 我正在寻找一个与字符串中最后一个空格字符匹配的正则表达式 我正在使用 JavaScript 和经典 ASP 我有一长串文本 我将其修剪为 100 个字符 我想删除最后一个字符 以避免由于 100 个字符的限制而修剪单词时出现
  • 强制 EditText 在按下后退时失去焦点

    当用户按下后退按钮隐藏键盘时 我试图强制 EditText 控件失去焦点 已经有很多类似的问题了 但是几个小时后 我还没有能够让它发挥作用 首先 简单介绍一下背景 我有一个带有自定义项目的 ListView 每一项都有多个 TextView
  • 在领域对象服务器上的不同用户之间共享领域?

    目前有没有办法允许多个用户访问同一个 Realm 现在我能找到的唯一方法是使用 应用程序帐户 而不是用户帐户 如建议的那样另一个问题 thanks 通常 您可以连接到虚拟路径中的 Realm 文件 它们必须始终是绝对的 因此以斜杠开头 并且
  • 角度形式数据不会附加

    我正在尝试使用 Angular 6 上传文件 但是 我似乎无法附加我的 formData 一点帮助 谢谢 home component ts export class HomeComponent implements OnInit sele
  • PHP中如何获取字符数?

    mb strlen只给出字节数 这不是我想要的 它应该适用于多字节字符 mb strlen text UTF 8
  • 您的应用程序正在使用包含 SQL 注入漏洞的内容提供商

    我有 2 个应用程序 第二个应用程序通过内容提供程序与第一个应用程序交互以获取一些凭据 今天在 Playstore 上上传我的 apk 时出现错误 SQL 注入 您的应用程序正在使用包含 SQL 注入漏洞的内容提供程序 要解决此问题 请按照
  • Java 异常错误 - Sqlite preparedStatement.setBlob

    我将图像放入数据库中 它可以是 MYSQL 数据库 服务器 或 SQLITE 数据库 路上使用的平板电脑 Java 应用程序每天与服务器同步 上传新数据并下载任何新数据 那部分运作良好 然而 要求它也能够处理图像 我们选择在数据库中使用 b
  • 自定义tinymce 4.0.5 styleselect工具栏菜单

    我正在尝试自定义默认值styleselect工具栏菜单 这样我就可以向其中添加自定义菜单元素 这个想法是将字体大小设置为styleselect子菜单 我初始化了一个TinyMCE 4 0 5通过以下方式 tinymce init langu