I want to add special button/function to TinyMCE. A button which adds custom tabs and content within those tabs to the post. The tabs I wanted to use are shown here: http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm
If I could get those tabs to show up in TinyMCE/Wysiwyg window of the editor, I could add some content in them. When I add the tabs as a code
<h3>Demo #1- Basic implementation</h3> <ul id="countrytabs" class="shadetabs"> <li><a class="selected" rel="country1" href="#">Tab 1</a></li> <li><a rel="country2" href="#">Tab 2</a></li> <li><a rel="country3" href="#">Tab 3</a></li> <li><a rel="country4" href="#">Tab 4</a></li> <li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li> </ul>
from CODE view of editor, they show up as a plain list. The editor window doesn't read the theme CSS.
So the problem is that I just can't figure out how to get those tabs show up in TinyMCE/Wysiwyg editor because it seems like the editor window doesn't apply any CSS at all.
I have added the needed CSS propably to all the CSS files I've found from the core of WordPress. All theme CSS files, all TinyMCE CSS files, all admin side CSS files - and nothing works. Of course there may be slip ups so I may have missed the right CSS file since there seems to be a lot of CSS files which control the look of the admin side.
When I look at the source code of editor page I can find only these CSS files from there:
Any of those files doesn't make any difference to the content of the Wysiwyg-editor.
Even if I "hardcode" the CSS to the admin-header.php the CSS doesn't make any difference. On the other side (in the actual post), the CSS works and those tabs look ok. But I can't add any content in them because I cannot see them in admin side.
I'm making this function to my client who doesn't know how to code so coding the content in those tabs isn't an option.
Anyone knows where is the css file which actually is connected to the editor window? Or doesn someone have any other ideas how to make this thing work?