Following to THIS WordPress QUESTION we tried some tweaks and got some nice solutions, hope we can public them after some good active codes-snippets.
According to our procedures, we correctly enqueued the necessary “conversion-js” into the admin area and can load our js into the post title and on keyboard action or mouse action we convert the texts into the same field.
According to our Inspect Element in Chrome:
With Inspect Element we can see, in default blank view WordPress editor is loading it’s content area with an <iframe>. And inside the <iframe> there is a blank <p>. We are targeting our js to that <p> tag. So we need a class or an Id to pass to that <p> tag.
HERE is the jQuery we are trying to get into the <iframe> to load a class to the <p> tag. We took assistance from THIS StackOverflow QA.
So the question-in-brief can be:
- How to load a class into a
<p>tag enclosed with<iframe>?
You can’t, not the way you are trying. You can’t start meddling in the iframes internals, it has its own DOM etc that needs to be respected etc
This question is already veering into offtopicness as it is more of a TinyMCE question than a WordPress question
Instead create a tinyMCE plugin, include jQuery in that plugin, and then use standard jQuery to add the classes you need. The tinyMCE plugin js will be inserted inside the editor dom head tags inside the iframe.
At this point it becomes a standard JS jQuery problem, and moves beyond the scope of this website.
Here’s a tutorial on how to create TinyMCE plugins ( just be sure to indent the code correctly:
http://ctx2002.wordpress.com/2008/07/28/how-to-write-a-tinymce-plugin-for-wordpress/