Where is the best spot to place extra files on a WordPress install?

3 comments

1. You can keep all your javascript in a folder in your theme’s directory, that is wp-content/themename/.

   Concerning Ajax, it’s implementation is different in WordPress. You must add a data variable called action in your ajax request and then hook it to a function in your functions.php file. Your ajax url should be wp-admin/admin-ajax.php available through admin_url( 'admin-ajax.php' ) in PHP.

   Read AJAX in Plugins for examples.

   Log in to Reply

2. If it is presentation related I believe you should place it in the corresponding theme folder. If it is a functionality you might want consider wrapping it inside a plugin and placing it in a plugin folder.

   If you dont care about abstracting this change and making available to other themes, then I would just simply add it inside the theme folder. You have WP helper functions to get the web path to the current theme folder, or to include js from that folder.

   Log in to Reply

3. The proper place in WordPress ecosystem is the folder wp-content, as this is the one that you preserve while doing WP upgrades, restorations or migrations.

   In that folder, it could be part of a theme (/themes), a plugin (/plugins), an uploaded file (/uploads) or, if the situation requires, a custom folder (/my-custom-content).

   /wp-content/themes/your-theme

   Here, all presentation related code. It’s a common mistake to place general functionality code in the theme’s functions.php. The first question to be asked before placing custom functions in this file is:
   If I change my theme, will I need this function?

   See: Where to put my code: plugin or functions.php?

   /wp-content/plugins/your-plugin

   Let’s say you need to enqueue some CSS or Javascript files, and this should happen whatever theme is being used.
   The following sample plugin will load SWFObject (bundled with WP) in the page Map and the front page, as both contain a SWF Flash embed. And, in the rest of the site, it will load the WebFont Loader from Google CDN and a CSS file from within the plugin folder.

   <?php
   /** Plugin Name: My Enqueue Plugin */
   
   add_action( 'wp_enqueue_scripts', 'enqueue_so_16354990' );
   
   function enqueue_so_16354990() {
       global $post;
       if( $post->post_name == 'map' || is_front_page() ) {
           // Enqueue bundled script
           wp_enqueue_script( 'swfobject' );
       }
       else {
           // Enqueue from external location
           wp_enqueue_script( 
               'my-web-font', 
               '//ajax.googleapis.com/ajax/libs/webfont/1.4.2/webfont.js', 
               array( 'jquery' ), // Dependencies
               time(), // Version, use time to prevent caching
               true // Enqueue on footer
           );  
   
           // Enqueue from within plugin directory 
           wp_enqueue_style( 'my-css', plugins_url( 'css/my-plugin.css', __FILE__) );      
       }   
   }
   

   /wp-content/uploads

   Here, your theme or plugin should place all user uploaded content, so it can be managed through WP Media Library screen. And the content should survive any theme swap or plugin de-activation.

   /wp-content/custom-folder

   Many image gallery plugins use this approach to store their custom media library.

   Another use is for Mobile themes, where custom user themes are placed in this folder, so not to lose it on plugin update (as everything in the plugin or theme folders is replaced on upgrades).

   Log in to Reply