Im using Drupal with the WYSIWYG module.
I want the CSS in my editor to be the same as my page, so the colors and fonts, etc all look how they will when the page is saved. I have different CSS for different node types, and on certain pages. How can I import these CSS rules into the editor?
Using normal CSS selectors doesn’t work if the html is outside of the iframe used by Wysiwyg. Using ‘.cke_show_borders’ as a selector works, but then I cant load different styles on different node edit pages.
Ive posted this question on the modules page and it doesn’t seem there is an inbuilt solution, but has anyone found a work around to this problem? Would there be some javascript way of bringing styles into the iframe from the page outside it?
Thanks
I’m afraid that the basic answer is, “Unfortunately, not for Drupal at the moment.” In order to truly see the CSS that is varying from page to page, the WYSIWYG system would need to be very, very “smart” and tightly integrated with other parts of the system – such as production of the headers that produce the CSS file links.
I’ve actually worked on a module to try to achieve some of the functionality you describe here – allowing pages to choose different groups of CSS styles on different prepared stylesheets, where these stylesheets were then re-parsed out for specific use in the WYSIWYG editor. It was a lot of work, and unfortunately it’s not at a point of development where it would be good to share. The next likely step for Drupal would be to include this type of functionality, instead of auto-magically knowing whatever css you are throwing in your template – simply because the freedom Drupal gives you with templates means that that the “core” has no idea at all really of what you’re doing with CSS. If Drupal were to try to integrate template and editor css in the manner you describe, templating would either be majorly restricted, or a lot more complicated than it is now.
If you use WYSIWYG API, you can designate your own stylesheet for the editor there – unfortunately, it’s not dynamic, so you can’t calculate the path of the stylesheet based on PHP code.