How to see files in directories in “Edit Themes” screen

The question:

I like to have folders in my theme folder for scripts and styles, but I can’t access these folders in the “Edit Themes” interface. This is problematic for clients that don’t give me FTP access. Is there a way to see these folders and the files in them from the WordPress admin section?

The Solutions:

Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.

Method 1

There is not a way to do this without modifying the core.

You should see .php files that are in subdirectories, but you won’t see anything above the root theme directory for .css files, and you won’t see any JavaScript files.

If you take a look at wp-admin/theme-editor.php, the relevant lines are…

<?php
$allowed_files = $theme->get_files( 'php', 1 );
$has_templates = ! empty( $allowed_files );
$style_files = $theme->get_files( 'css' );
$allowed_files['style.css'] = $style_files['style.css'];
$allowed_files += $style_files;

$theme is is a WP_Theme object representing the current theme. It’s create a few lines above.

The get_files method searches a directory by matching the the file extension (first argument) and using the depth (second argument). The first call to get_files fetches all PHP files in the theme directory as well as the any subdirectories one level above the theme directory.

The second fetches all css files in the theme directory but it doesn’t recursively go into subdirectories (notice the lack of the $depth argument).

There’s not much you can do about this; there is a conspicuous lack of any calls to apply_filters and do_action in theme-editor.php and the get_files method lacks them as well. You’re pretty limited.

And when PHP doesn’t work, time to try the ugly JavaScript hacks!

Unfortunately, that’s no good either. I tried exploring adding files to the list via JavaScript and ajax, but clicking on a JS added file results in an error message due to function called validate_file_to_edit which checks the current file to edit against the list of $allowed_files (see the above code that fetches that).

Method 2

The Advanced Code Editor plugin provides this functionality.

From the plugin description:

Enables syntax highlighting in the integrated themes and plugins source code editors. Supports PHP, HTML, CSS and JS.
Effectively edit your themes or plugins when you only have access to a browser, by enabling syntax highlighting in WordPress integrated source code editors. Supports PHP, HTML, CSS and JavaScript


Edit:
The plugin mentioned above doesn’t seem to have the directory tree for themes; only plugins. There is, however, another plugin that does provide this functionallity: WPide

From the plugin description:

File tree allowing you to access and edit any file in your wp-content folder (plugins, themes, uploads etc)

There has also been a trac ticket on this topic; hopefully this will be fixed in a future version of WordPress.

Method 3

I do the same thing as you and organize things in folders. I never use that editor but I just took a look at one of my sites and I can see the files but not the directories. That is, the files are listed as present and are editable, but they are not displayed by directory. You can’t tell what folder they are in unless you read the URL for the links.

If you are talking about a child theme, I am having trouble seeing some of the files and I don’t know why. The owner, group, and permissions match on the parent theme, whose files I can see, and the child theme, some of whose files I can’t see. I’d never noticed the issue until this question came up.

Method 4

This is not a problem for all users.

Therefore, update to WordPress 3.4.x if you haven’t already.

Remember that css/style.css will alphabetically appear under ‘c’, but separated out under Styles at the bottom.

If this doesn’t work, try the same theme on a localhost install – if it works there it could be that their server doesn’t allow recursive listing.

Method 5

I face the same problem almost every day with our WordPress customers.

I use a plugin that allows you to edit all files of WordPress. But it is not safe for accounts on shared hosting (sometimes plugin allow edit any files on whole server).

This plugin has been removed from wordpress.org (I think for security reasons) and the author’s domain now expired. I’ve found small review here:
http://www.themepremium.com/access-ftp-from-wordpress-dashboard-using-myftp-wordpress-plugin/

Below I’ll post a link to a copy of the plugin.

NOTE: I haven’t any relations to the author of this plugin and have not modified it. I will not be held responsible for how you use the plugin.

“myftp” plugin

Method 6

If you do not have FTP access but you can use a little hack in the theme editor…

Simply add the following code to an existing template:

<?php
@file_put_contents(get_template_directory() .'/template-custom-page.php', 'temp content');
?>

Visit a URL that is using the template where you added the code to create the file and it should create the file for you (assuming the web werver user has permission to create files in the theme folder).

Remove the added code from the 1st template (after the file is create) otherwise the code will always erase the file content when executed.

Method 7

For those looking for more recent information, AceIDE (forked from the now unmaintained WPide) works pretty well for quick and dirty edits.

Keep in mind that theme and plugin edits will be overwritten by updates, so editing this way is bad practice.

Method 8

If a client won’t or can’t give you FTP access then you shouldn’t be working for them. You could take the time it would take to hack the core and just find better clients.


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Comment