Skip to content

Commit ebac0ef

Browse files
DOC-3229: Add missing iframe_attrs option. (#3804)
* DOC-3229: Add missing iframe_attrs option. * Update modules/ROOT/partials/configuration/iframe_attrs.adoc Co-authored-by: tiny-ben-tran <ben.tran@tiny.cloud> * Update modules/ROOT/partials/configuration/iframe_attrs.adoc Co-authored-by: tiny-ben-tran <ben.tran@tiny.cloud> * Update modules/ROOT/partials/configuration/iframe_attrs.adoc * Update modules/ROOT/partials/configuration/iframe_attrs.adoc --------- Co-authored-by: tiny-ben-tran <ben.tran@tiny.cloud>
1 parent ed5a8b7 commit ebac0ef

File tree

2 files changed

+45
-5
lines changed

2 files changed

+45
-5
lines changed

modules/ROOT/pages/editor-important-options.adoc

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,10 @@ include::partial$configuration/target.adoc[leveloffset=+1]
1313

1414
include::partial$configuration/placeholder.adoc[leveloffset=+1]
1515

16+
== Configuring the editor iframe
17+
18+
include::partial$configuration/iframe_attrs.adoc[leveloffset=+1]
19+
1620
== Focusing on the editor
1721

1822
include::partial$configuration/taborder.adoc[leveloffset=+1]
@@ -56,8 +60,3 @@ include::partial$configuration/content_security_policy.adoc[leveloffset=+1]
5660
include::partial$configuration/referrer_policy.adoc[leveloffset=+1]
5761

5862
include::partial$configuration/suffix.adoc[leveloffset=+1]
59-
60-
////
61-
Not documented, but probably belongs in a new section here somewhere.
62-
include::partial$configuration/iframe_attrs.adoc[]
63-
////
Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
[[iframe_attrs]]
2+
== `+iframe_attrs+`
3+
4+
This option allows adding custom attributes to the editor's content iframe element when running in classic mode. The attributes are applied during the iframe creation.
5+
6+
NOTE: This option only affects the main editor content iframe, not other iframes such as preview frames, dialog iframes, or iframe elements created within the editor content.
7+
8+
9+
*Type:* `+Object+`
10+
11+
.Example: using `+iframe_attrs+` for accessibility
12+
[source,js]
13+
----
14+
tinymce.init({
15+
selector: 'textarea', // change this value according to your HTML
16+
iframe_attrs: {
17+
'aria-required': 'true',
18+
'aria-describedby': 'editor-description'
19+
}
20+
});
21+
----
22+
23+
.Example: using `+iframe_attrs+` for custom styling
24+
[source,js]
25+
----
26+
tinymce.init({
27+
selector: 'textarea', // change this value according to your HTML
28+
iframe_attrs: {
29+
'style': 'background-color:rgb(64, 167, 99); border: 2px solid #ddd;',
30+
'class': 'custom-editor-frame'
31+
}
32+
});
33+
----
34+
35+
.Example: verifying `+iframe_attrs+` configuration
36+
[source,js]
37+
----
38+
// After the editor is initialized, you can verify the configuration:
39+
console.log(tinymce.activeEditor.options.get('iframe_attrs'));
40+
// Output: {style: 'background-color:rgb(64, 167, 99); border: 2px solid #ddd;', class: 'custom-editor-frame'}
41+
----

0 commit comments

Comments
 (0)