Tumblr 帖子允许使用哪些 HTML 属性? (小小)

发布于 2024-12-19 05:26:10 字数 396 浏览 2 评论 0 原文

创建 Tumblr 帖子并使用 HTML 编辑器选项时,当我向元素添加特定的 HTML 属性时,TinyMCE 富文本编辑器几乎会删除所有内容。

即:

<span class="something" data-random="foobar">

变成这样:

<span class="something">

并且这不受影响:

<span class="something" title="foobar">

那么我可以1)禁用此清理(这很荒谬,至少它目前是如何实现的)或2)获取所有有效属性的列表,以便我可以选择最佳语义选择?

When creating a Tumblr post, and using the HTML editor option, when I add specific HTML attributes to elements, the TinyMCE rich text editor strips nearly everything off.

i.e. this:

<span class="something" data-random="foobar">

becomes this:

<span class="something">

and this is unaffected:

<span class="something" title="foobar">

So can I either 1) disable this scrubbing (which is ridiculous, at least how it's currently implemented) or 2) get a list of all valid attributes so I can choose the best semantic choice?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

别想她 2024-12-26 05:26:10

这也害死了我。在谷歌上搜索任何比“如何编辑文本颜色”更复杂的 tumblr 开发帮助,哎呀。我不希望任何人都这样。

Tumblr 用户对运行控制面板的 html 或 js 没有任何控制权,因此无法添加任何改变 TinyMCE 配置的文件。但你可以把它关掉。在 Tumblr 设置仪表板标签中,您会发现文本编辑器部分。选择纯 html 或 Markdown 将停用 TinyMCE,并允许您随心所欲地发布表单、数据属性和任何非白名单 html。

This was killing me too. And searching google for any tumblr dev help more complicated than "how do I edit text color", oy vey. I wouldn't wish it on anyone.

Tumblr users don't have any control of the html or js that runs the control panel, and so can't add any files that alter TinyMCE configuration. But you can just turn it off. In the Dashboard tab of your Tumblr settings, you'll find a Text Editor section. Selecting plain html or Markdown will deactivate TinyMCE and allow you to post forms, data attributes, and any non-whitelist html to your heart's content.

辞取 2024-12-26 05:26:10

1) 可以使用以下 tinymce 初始化参数 cleanup:false, 关闭剥离元素

2) 有效 html 元素的默认定义可以在此处找到:
http://www.tinymce.com/wiki.php/Configuration:valid_elements

为了将data-random保留为span的属性,您需要设置valid_children初始化参数如下

valid_children: "body[p|ol|ul|hr]" +
",span[a|b|i|u|sup|sub|img|data-random|#text]" +
",a[span|b|i|u|sup|sub|img|#text]", //...

1) Stripping elements can be turned off using the following tinymce init parameter cleanup:false,

2) The default definition of valid html elmements can be found here:
http://www.tinymce.com/wiki.php/Configuration:valid_elements

In order to keep data-random as an attribute of span you will need to set the valid_children init parameter as follows

valid_children: "body[p|ol|ul|hr]" +
",span[a|b|i|u|sup|sub|img|data-random|#text]" +
",a[span|b|i|u|sup|sub|img|#text]", //...
渔村楼浪 2024-12-26 05:26:10

使用 Markdown 听起来是一个不错的选择,但我在某处读到它在嵌入 iframe 方面存在问题。如果它对你有用,那就太蓬松了。我还没有测试过。

但是,如果您不想放弃 TinyMCE,您可以执行以下操作。

tinymce.activeEditor.schema.setValidElements('*[*]')

这告诉活动编辑器现在所有元素都有效。

不幸的是,一旦你关闭并重新打开编辑窗口,新启动的编辑器就会再次删除它们,所以我写了一些Greasemonkey 脚本,在编辑器初始化时自动设置 valid_elements。

// ==UserScript==
// @name        Lift TinyMCE tag restrictions
// @namespace   http://claviger.net
// @include     *.tumblr.com/*
// @version     1
// @grant       none
// ==/UserScript==

if (typeof tinyMCE !== 'undefined') {
    tinyMCE.onAddEditor.add(function(mgr, ed) {
        ed.settings.valid_elements = '*[*]';
    });
}

它对我来说效果很好,但我认为在极少数情况下,Greasemonkey 脚本和 TinyMCE 的实际初始化之间会出现竞争条件。我认为后者有时必须在第一个之前运行并阻止我的小黑客。不过,在我重新加载页面的最近二十次左右,这种情况没有发生,如果发生,只需重新加载而不保存。 (也许有人知道如何避免这种情况?)

顺便说一句, class 属性似乎没有被删除,因此作为另一种选择,您可以定义类似 .alignleft< /code> 在您的博客主题中并将其用于图像。那么它在 TinyMCE 中看起来就不太像了,但访问者或博客会看到漂亮的版本。

Using Markdown sounds like a good alternative, but I’ve read somewhere that it has problems with embedded iframes. If it works for you, then that’s fluffy. I haven’t tested it yet.

However, what you can do if you don’t want to forgo TinyMCE is the following.

tinymce.activeEditor.schema.setValidElements('*[*]')

This tells the active editor that now all elements are valid.

Unfortunately, as soon as you close and reopen the edit window, the freshly started editor will strip them again, so I wrote a little Greasemonkey script that sets the valid_elements automatically at the initialization of the editor.

// ==UserScript==
// @name        Lift TinyMCE tag restrictions
// @namespace   http://claviger.net
// @include     *.tumblr.com/*
// @version     1
// @grant       none
// ==/UserScript==

if (typeof tinyMCE !== 'undefined') {
    tinyMCE.onAddEditor.add(function(mgr, ed) {
        ed.settings.valid_elements = '*[*]';
    });
}

It works pretty well for me, but I think in rare cases there’s a race condition going on between the Greasemonkey script and the actual initialization of TinyMCE. I assume the latter must sometimes run before the first and thwart my little hack. It hasn’t happened the last twenty or so times I reloaded the page, though, and if it happens, just reload without saving. (Maybe someone has an idea how to avoid this?)

By the way, the class attribute doesn’t seem to get stripped, so as another alternative, you could define something like .alignleft in your blog’s theme and use it for the images. Then it wouldn’t look like much in TinyMCE, but the visitor or the blog would see the pretty version.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文