Understanding WordPress Folder and File Structure and Where does a theme live?

WordPress themes live under wordpress-project-folder -> wp-content->themes

For Windows WAMP users, it is, C Drive -> wamp -> www -> dosth -> wp-content -> themes 

For MacOS MAMP users, it is, Applications -> MAMP -> htdocs -> dosth -> wp-content -> themes

For Windows MAMP users, it is, C Drive -> MAMP -> htdocs -> dosth -> wp-content -> themes

Now that you know where does a WordPress theme resides, it is also essential to have a good understanding of the folder and file structure of a WordPress project to get more out of the theme development. 

WordPress Project Folder & File Structure

Files inside a WordPress project can be divided into four sections. Let’s go through them one by one.

The wp-content Folder

This is our playground. This is where we keep our themes, plugins and this is where WordPress keeps entire site backups and uploads you made using WordPress admin dashboard.  

The wp-content folder is the only folder that you should consider backing up because it contains all your website content except text content. Text content is stored in the database. If this folder is gone, you are gone with it.

Along with the themes and plugins that you have developed, you will also find themes and plugins developed by others. Please do not edit the plugins or themes developed by others. 

The plugins are just like WordPress core files. If the plugin developer releases a better version of the plugin by fixing bugs or security loopholes, you must update the plugin for good and when you do that, whatever changes you made before updating the plugin are gone.  

The same applies to the themes as well. There are two types of themes in WordPress. Parent Theme and Child Theme. 

If you are purchasing a theme from marketplaces like StudioPress or Theme Forest, chances are you’ll be installing both the parent theme and child theme and they’d suggest making edits to the child theme. 

Just Like plugins, a theme developer from the above-mentioned marketplaces could release multiple versions of the parent theme by fixing bugs or layout issues. I have also created another in-depth course on creating child themes. This course is all about creating a Parent theme.

Now, let’s take a peek inside the wp-content folder.

The wp-content folder holds an index.php, plugins folder and themes folder.

The purpose of the index.php file in the wp-content folder, plugins folder and themes folder

For starters, Let’s go ahead and visit the wp-content folder from the browser.

WAMP users go to http://localhost/dosth/wp-content

MAMP users go to http://localhost:8888/dosth/wp-content

What did you see? A blank web page with no content. 

“Hey! Wait. I am a novice PHP developer. Why a Blank Page?”

This is the default behavior of any PHP running web server. When we visit the wp-content folder from the browser, here is what happens:

  1. the browser sends a request to the server.
  2. The server receives the request, processes it by taking a look at the URL and finds out that there is no file mentioned at the end of the URL. So, it looks for index.php file automatically.
  3. If the index.php file is found, it returns the contents of the index.php file to the browser. If the index.php file is not found, it reveals the contents of the wp-content folder.
  4. Since our wp-content folder has an index.php, the server starts processing the index.php.
  5. The index.php file has only a single PHP comment saying “Silence is golden” and nothing else, so, the server ignores that PHP comment and sends back a response to the browser with no content. 
  6. Browser processes the response and finds out there is nothing to render. Hence renders you an empty webpage.

Now let’s go ahead delete the index.php file temporarily from the wp-content folder. 

Did you see what just happened? We exposed our project folders and files to potential hackers and this is bad.

Now put back index.php from your trash folder or whatever and refresh the browser. You’ll see an empty page again.

So, long story short, the purpose of and an empty index.php is to hide the inner folder and file structure of whatever that is inside. In our case, theme and plugin folders.

The purpose of the plugins folder

A plugin is nothing but a bunch of PHP files extending the functionality of the WordPress. Whenever we download a plugin from the WordPress admin dashboard, WordPress puts the downloaded plugin inside the Plugins folder. 

If you would develop a plugin, it goes into this folder as well.

A plugin can be a single index.php or it can be a bunch of files inside a separate plugin folder.

You’ll also find an index.php file protecting the folder contents.

The purpose of the themes folder

As I mentioned at the beginning of this lesson, themes developed by you and other programmers go inside this folder. Again, be careful when you edit themes that are not yours.

Every WordPress installation comes with some default themes. I started my WordPress journey by playing with them.

Because a WordPress theme is nothing but a bunch of PHP, CSS and javascript files, unlike plugins, a theme cannot be a single file. It must be a folder with at least three files.

You’ll also find an index.php file protecting the folder contents.

The Configuration Files

.htaccess and wp-config.php are known as configuration files.

The .htaccess file

The .htaccess help us configure the web page redirects and search engine friendly URLs. It is generated when we are installing WordPress.

It also allows us to put restrictions on what files can and cannot be accessed inside our WordPress installation. So, it also deals with the security of our wordpress website up to a certain level. 

The .htaccess file is capable of doing much more; you’ll learn more about this file in the near future.

Important Note: This file is only useful if you are using an Apache server. There is an alternative server to Apache called Nginx and Nginx use nginx.conf instead of .htaccess. 

Another Important note for MAMP users: MAMP allows you to change from Apache to Nginx whenever you want. So if you have decided to switch between Nginx and Apache, make sure you use the correct configuration file to save your wordpress installation from breaking.

The wp-config file

The wp-config file is more like a combination of settings and a preferences file. It holds the database connection information like username, password. It lets you turn on or off your PHP debugging.

There is more to this file than database settings. So, in the future lessons, we will be visiting this file from time to time.

The Core Files

The core files contain the actual wordpress functionality. And right now, there are thousands of developers who are working hard to make WordPress better by adding new features and fixing bugs and security holes. This is the reason why we receive at least one WordPress software every month. 

Every time you update your WordPress installation, modified or not, the core files will get replaced with a complete set of new files. So, do not ever edit these core files for any reason. You’ll not only lose your changes, but you might also break your website functionality.

If you want to modify or extend the functionality of the WordPress, WordPress allows you to do that using Actions and Filters. Without Actions and Filters, none of the plugins on WordPress.org would exist. That’s how powerful they are.

That is all.  Now that you have enough knowledge about the surroundings of a WordPress theme, you are good to start your theme development journey. So, in the next lesson, you’ll start developing your first theme ๐Ÿ˜‰