how to make stylesheet appear in theme editor?

0 Views

I have a stylesheet in my theme in the css subdir of the theme dir (css/style.css). The question is how to make this .css file appear in the theme editor of the WordPress admin. (I know using the web editor is a bad idea and I never use it, but the client specifically asked for this).

Note: the only css file that shows up by default in my theme editor is ‘style.css’ of the root theme dir, but this is not what I need.

Post Views: 0

Related posts

Leave a Reply

2 comments

  1. I’d say it’s impossible…

    For one, there’s no hook inside the file /wp-admin/theme-editor.php.

    And last but not least, if you try one of this, it dumps an error:

    • /wp-admin/theme-editor.php?file=css%2Fstyle.css&theme=twentyeleven
    • /wp-admin/theme-editor.php?file=css/style.css&theme=twentyeleven

    Case you find a workaround, this code injects a link to the desired file:

    /**
 * Adjust the if('Twenty Eleven' == sel) to your theme name
 */
add_action('admin_head-theme-editor.php', 'wpse_55949_script_enqueuer');

function wpse_55949_script_enqueuer(){
    echo <<<HTML
    <script type="text/javascript">
    jQuery(document).ready( function($) {
        var sel = $("#theme option:selected").text();
        if('Twenty Eleven' == sel) 
        {
            $('<li><a href="theme-editor.php?file=css/style.css&amp;theme=twentyeleven">Subfolder Stylesheet<br><span class="nonessential">(css/style.css)</span></a></li>').appendTo('#templateside ul:last');
        }
    });     
    </script>
HTML;
}

    [update]

    An alternate approach would be to create an options page where the client can write/manipulate the CSS.

  2. It’s as simple as you might think.

    All the selectors that you wanted to give to a client, place in an extra stylesheet, client-styles.css

    Save this stylesheet not inside the css folder, but in the theme root. So with the probably already existing style.css and editor-style.css.

    Add @import "client-styles.css"; to the style.css file (there’s probably other import at-rules there already).

    Correct link in the header from /css/client-styles.css to /client-styles.css

    Remind the client that they can trash the site if they’re not careful (as you said, they wanted this!).