How to Locate the PHP File Containing a Tag in WordPress

WordPress may be simple to use and maintain, but under the hood it’s actually quite complex. Years ago, making modifications to the layout of a page involved directly going into the corresponding PHP page and changing the source code. Then as people started wizening up, they realized that creating a child theme was a better idea. After a while, they started leaving themes alone and made changes via the functions.php file, or a dedicated child theme.

The internal structure of WordPress has changed as well. These days, major frameworks like Genesis and Thesis don’t use a simplistic architecture of a single file for a single page. If you visit the classed “single.php” template file, you probably won’t find the HTML tags you expect to see in a “single” page. The default WordPress themes have also adopted a more sophisticated approach, choosing to go for “template parts” and other such modifications.

Now of course, all this hasn’t been done for fun. These changes reflect a desire to create more maintainable and reusable code. But from a user’s point of view, it can be very frustrating and difficult to customize the parts of the theme. Or even if you just want to know how a certain output is being generated and want to see the code, finding the actual file that is responsible for rendering that particular tag can be very difficult.

In this tutorial, I’ll show you how to do this, regardless of theme architecture. But first, here is a method that doesn’t work.

Finding the Templage Page – Not Good Enough

Let’s say I have a typical TwentySixteen theme page on my WordPress. I identify a component in the metadata that I want to change, and find the tag using the Chrome developer tools: