CODEWITHSUNDEEP
jquerytinymce
Chad Caldwell
Chad Caldwell

Reputation: 274

tinyMCE add class to the automatic <p> tag

In the tinyMCE editor the text that I enter automatically is wrapped with <p>, which is fine. I just want to add a class to that <p>.

Note: I do not want to add a class to ALL the p elements, just the one where the user clicks and begins typing.

Any help really appreciated.

Upvotes: 3

Views: 3478

Answers (2)

Thariama
Thariama

Reputation: 50840

You should use the tinymce javascript API for this purpose:

editor = tinymce.get('your_editor_id');
$(editor.selection.getNode()).parents('p:first').addClass('your_class');

Here is a non-jquery solution:

editor = tinymce.get('your_editor_id');
editor.selection.getNode().closest("p:first").setAttribute("class", "your_class");

Upvotes: 1

SpYk3HH
SpYk3HH

Reputation: 22580

Try this:

var tmceIframe = $(".mceIframeContainer iframe")[0].contentDocument || $(".mceIframeContainer iframe")[0].contentWindow.document;

$(tmceIframe).find("p").addClass("test")

or as one line:

$($("iframe")[0].contentDocument || $("iframe")[0].contentWindow.document).find("p").addClass("test")

in the second example i make it shorter by going straight to the iframe, however, this could be an issue if you have more than one iframe on the page, u may want to use an element id to specify, like on the wrapper

Upvotes: 0

Related Questions