dev source
Sponsored

Have you ever been browsing a website or blog and thought to yourself, “that’s a cool feature, I wonder how they are doing it”? Well, if the site is running WordPress, there is a decent chance that we can: (1) identify the plugin; and (2) install it ourselves. How? Read on…

Is the Website Running on WordPress?

This is the first thing we need to work out. If the site is running on WordPress then we can try to identify the plugin they are using. If not, then there’s no point continuing, because they are either running something custom (i.e. Facebook) or another CMS (like Drupal, for example).

To discover if a site is running WordPress or not all you need to do is check out the source code and then look for the standard WordPress code that is always included. For me, this involves looking to see if the stylesheets (.css) files are called out of a sub-folder of the /wp-content/themes/ folder. Just note that you need to do this on desktop as it’s not possible on mobile (well, it is, but’s is VERY complicated).

dev source

It may sound complicated, but all you need to do is go “View” –> “Developer” –> “View Source” in your Google Chrome browser (or whatever you use). Do that, and you’ll be presented with a screen with a whole lot of code, something like that below.






	
	
	

	
	
	Optimal WordPress Setup with WordOps & Caching - CodeCoffee
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	

Now hit CTRL+F to search the text of the page, and look for ‘wp-content’ without the quotes. If you find some matching text, then the site is running on WordPress and we can proceed to the next step!

Inspect Element

So, we know the website is running WordPress, how do we identify the plugin they are using? For this, we will use a tool called “Inspect Element” that let’s you see the source code (similar to that above) for the specific element we are clicking on… in this case, it will be the plugin/feature we want to know more about!

Example #1

Take this post about setting up WordOps and WordPress. If you like the table of contents feature that is displayed and wanted to know if you could set something similar up for your site, just right click in the table of contents itself and click ‘Inspect’. You’ll get a screen pop up like that below.

2 inspect source

You can see that some code has been highlighted. We are most interested in the parts that say either “id” or “class” and what the words that follow them are, in quotation marks. We are also looking for any similar patterns of repeating text, or ones that sound like the name of the plugin or are related to the function that it is performing.

To take the example above, we can see that “ez-toc-title” seems to be repeated a lot. It’s shown in at least four places. “ez” could be short for “Easy” and “toc” is an abbreviation for “table of contents”… sounds promising! So let’s take that text and run a search with Google. Do that, and you’d get the result below. The results tell you that the table of contents plugin I am using is Easy Table of Contents.

3 google ez

Example #2

Let’s do another example from that same post. A bit further down the page you will see some code highlighted. What if you wanted that same effect for your site? Let’s run through the same process. Right click –> Inspect –> look for repeating/interesting words.

4 inspect plugin

This one is a bit harder since there is not any immediately obvious repeating words that stand out. However scroll up a bit and you see “syntaxhighlighter bash”. That could be related to the plugin name, could it not? So let’s type that into Google…

5 google code

“syntaxhighlighter bash” didn’t throw up anything useful, but as you can see above, “syntaxhighlighter” does. The second result is indeed the plugin I am using to highlight code like that – SyntaxHighlighter Evolved. We could have also thrown a “wordpress” onto the end of the query and it probably would have been the #1 result.

Conclusion

Once you’ve identified the plugin as above, all that’s left to do is install and configure the plugin, and get it up and running on your website. Sometimes the plugin will be freely available on wordpress.org, other times it might be paid-for. Free ones are easier to find using this method, but you still might be able to identify some paid ones and purchase them if you want to.

The post How to Identify & Find Which WordPress Plugin a Website is Using appeared first on CodeCoffee.

Go to Source

Sponsored