Learning through imitation is a great way to build your own WordPress website – that’s the beauty of development communities, after all! However, hardly any websites come with guidance on which theme and plugins make them tick.
After finding a WordPress site you’d like to emulate, you can easily discover which theme and plugins they use. Knowing this information can help you replicate any special design elements or features you might have been struggling to produce on your own. Of course, it will be up to you to master the tools you find, but knowing where to look is the first step.
In this article, you will learn why discovering the theme and plugins a WordPress site uses is so valuable, as well three options for running a complete espionage mission. Let’s get started!
Why You Would Want to Discover Which Theme and Plugins a WordPress Site Uses
Figuring out how another WordPress site is implementing any given feature can save you time and frustration. For example, your client has sent you an example site they love, with a complex feature they want on their own site. While you’re confident it’s doable, building a similar feature from scratch will take many hours. Of course, it’s difficult to give a proper quote on work you’re not sure about. In addition, it’s not desirable to have to work from scratch.
Instead, you can learn how the example site is implementing the functionality by ‘grokking’ the theme and plugins a site uses. In short, it can save you from reinventing the wheel, and help you to lay a similar foundation on your client’s site.
In general, being able to do this kind of research will help you in your day-to-day development. It’ll also help you combat decision paralysis – as you begin delving into other sites’ setups, you’ll discover many use the same tools under the hood. It’ll help cement the old adage: “It’s not what you’ve got, it’s what you do with it.”
How to Discover Which Theme and Plugins a WordPress Site Uses (with 3 Methods)
Now you know why you might want to research the themes and plugins of other WordPress websites, it’s time to learn how! Here are three options, beginning with the simplest.
Method 1: Automatically Detect Themes and Plugins Using Online Tools
This is one of easiest ways to begin your search and doesn’t require any setup on your part.
This method automatically detects basic theme and plugin information for you, and work by checking your target site for unique files and scripts from popular plugins or themes, then reporting back with their findings. However, it’s worth noting that there are limitations. An automated tool may miss some clues that you’d easily be able to determine as a human.
However, for a cursory search to detect for major plugins, automatic solution are a good place to begin. Here are the top sites we recommend:
Each of these operates similarly, so your choice will boil down to which one you prefer to use – we’ll use What WordPress Theme Is That? for our example. To begin, firstly enter the URL of the site you’d like to inspect and click Search, Submit, or the equivalent icon…
…and that’s it! You’ll be given a list of the results, and you’re then free to delve into each theme and plugin to find out if it’s the right fit for you:
This method is okay for one-off searches, but for those who often need to figure out other sites’ functionality, there’s an even better solution.
Option 2: Install a Dedicated Browser Extension
Another way to automatically detect site plugins and themes is by using a browser extension. They’re simple and fast, but do require you to install extra software in your browser:
Browser extensions are small programs that add extra features to your browser. Theme checking extensions are particularly convenient if you’re constantly checking installation details on different sites. In other words, it enables you to collect basic information at the click of a button, while already viewing the target site.
In short, if you frequently check sites for their plugins and themes, a browser extension might be the right choice for you. Here are a few to choose from:
- WordPress Theme Detective (Chrome)
- WP Sniffer (Chrome)
- WordPress Themes and Plugins Detector (Chrome)
- Wappalyzer (Mozilla)
As with online solutions, browser extensions all work similarly once you’ve installed them. Firstly, visit the site you’d like to inspect in your browser. Next, click on the respective browser extension icon to run the inspection. After a few moments, you should see the results:
However, as you may have gathered, both online solutions and browser extensions have a certain degree of error. For the ultimate in WordPress website espionage, you’ll need to dig into the source code.
Option 3: Go Deeper Into the Site’s Source Code
Being able to review the source code yourself is often useful because automated sites and browser extensions are limited to the situations they are programmed for. Additionally, you can almost always glean extra information by taking a look yourself. This is particularly helpful when a site is using lesser-known plugins, a self-developed solution, or even using custom scripting to achieve new results with an existing plugin.
Also, we’ll be using Chrome’s DevTools as an example here, but other browsers often have similar features, such as Firefox’s Page Inspector, or Safari’s Web Inspector.
To begin, visit the target website in your browser, right-click anywhere on the page, and choose Inspect:
This will open up a tab full of source code and other information, and you’ll notice it’s very similar to the source code we saw earlier:
There are three techniques we can use to explore the page and find out about how the site was built. The first thing to understand is how WordPress structures themes and plugins. They are typically stored within a folder called wp-content, in their respective themes and plugins folders. Translated to source code, this means you’ll likely find files and scripts with the following type of structure:
For plugins, you’ll likely see /wp-content/plugins/plugin-name/path/to/script.js.
Of course, the path/to/script.js at the end will vary depending on the theme or plugin. From here, you can use the respective theme name or plugin name within those paths to find the original theme or plugin. For example, WordPress themes contain their design data in style.css, and it means you can load the /wp-content/themes/theme-name/style.css path into your browser. This will return valuable theme information for you to look up – our website runs on a custom theme powered by the Genesis Framework, for example.
To find these scripts on basic sites, you can find them collected under the Sources tab (or similar):
If the site you’re inspecting is heavily customized (or uses a CDN), you may need to use the search function within the Elements tab:
For more in-depth plugin research, you’ll begin to notice certain patterns and output from different types of plugins. If you find something that looks interesting but aren’t sure, a Google search for the script will help. You’ll want to specifically look for unique IDs and classes within the HTML, and any comments inserted within the code.
To give you a few examples, ConvertKit’s classes and IDs often begin with or include ck_, while MailChimp uses mc_. Many plugins that create their own HTML elements follow similar conventions, which makes them easy to identify.
You also have plugins that modify the whole page, such as WP Super Cache. Many of these use HTML comments as behind the scene credits, kind of like a signature that also gives you clues if something goes wrong. For example, here’s an example of what WP Super Cache inserts <!– Cached page generated by WP-Super-Cache on 2017-03-21 06:54:58 –> at the bottom of a page.
If you need to understand how a plugin actually works (rather than just know its name), being able to identify its code within the page will help you track down the right pieces to replicate its effects within your own projects.
Being able to discover which theme and plugins a WordPress site uses can save you time and trouble when working on your own projects. In other words, it can provide a jumping off point for creating the features for developing your client’s site.
In this piece, we’ve discussed three option to discover the theme and plugins a WordPress site uses:
- Automated tools that provide cursory data.
- Browser extensions, for frequent investigators.
- Manual methods that enable you to get much more valuable information.
What are your favorite tools for finding plugins and themes installed on WordPress sites? Share your insight in the comments section below!
Image credits: Drew Hays.
Join the conversation