Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

Do I need to implement an editor-specific stylesheet for the WordPress WYSIWYG? In doing so will this eliminate style conflicts that I am currently experiencing?I am have not implemented an editor stylesheet so I am noticing that it is becoming very difficult to separate surrounding website styles and editor styles. What's the best way to implement this?

share|improve this question

2 Answers 2

up vote 0 down vote accepted

The WordPress editor shouldn't be pulling in the themes CSS files unless you have a file that is named editor-style.css. You can either use the editor-style.css and simply place it in your themes root directory, add certain styles to the stylesheet (not all the theme div and id tags will apply to the WordPress Editor).

Another way to do it is to use wp_enqueue_script to enqueue a CSS file with whatever name you wish, or in a different file location other than the themes root directory. Some authors use this method to minimize the amount of files that live in the theme root directory.

If your theme is incorrectly registering or enqueueing a script it can cause the files to be loaded into the WordPress admin area. Let me know what your theme is using for the editor stylesheet if this doesn't help so I can give you better assistance.

share|improve this answer
    
so basically the editor-style.css is a stylesheet dedicated and specific to the WordPress WYSIWYG? This stylesheet allows me to target styles just for the dynamic content output of the WordPress editor? –  Matt Jul 9 '12 at 20:42
    
Yes, the editor-style is meant specifically for styling the WordPress Page/Post editor so it looks closer to what it does on the site. It's useful for clients and others that use the visual editor vs. HTML view. –  Jeremy Jared Jul 9 '12 at 20:53

Adding a callback for custom TinyMCE editor stylesheet in your theme is a good (standard) way to implement an editor-specific stylesheet in WordPress. This is how it's done:

add_editor_style('custom-editor-style.css');

This function is ONLY for in-theme stylesheets, in the sense:

  • The code should be added in your theme's functions.php

  • The stylesheet file should reside right inside the theme directory i.e. for instance .../wp-content/themes/MY-THEME/custom-editor-style.css

READ: Function Reference / add_editor_style (WordPress Codex) and WordPress Editor Style (Article)

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.