Locating Plugin and Theme Conflicts
Conflicts that occur between a plugin and a theme are common, especially where a theme takes on some of the functionality usually performed by a plugin. Locating these conflicts can be difficult and requires some understanding of PHP and how themes work in WordPress.
A theme is a collection of templates and CSS files that control the look of your WordPress site. However, themes can perform complex actions, such as SEO and image display. This functionality can conflict with plugins that perform the same tasks.
When identifying a conflict between your theme and your plugin, look for an error message, which can point to a specific line in a file. If no error message displays in either the WordPress Dashboard or on the front end of your site, you need to identify the specific element that is broken. To do this, duplicate your live site on the test site that you set up in Book VII, Chapter 3 and follow these steps (after you have things working correctly on your test site, you can apply the changes to your live site — this way, you're doing all your testing first in an environment that does not affect the live site):
- Deactivate all plugins except the one causing the conflict with your theme.
- Remove all widgets from widget areas.
These can be common causes of conflicts.
- Test your site in several browsers to see whether the problem affects only a particular browser.
- Comment out any changes you may have made to the theme or plugin files, including changes to CSS stylesheets.
- Check for any errors appearing in the browser's Error Console.
Figure 4-3 shows the error console in Firefox.
Figure 4-3: The error console in Mozilla Firefox.
- Use an error-checking tool, such as the Web Developer add-on for Mozilla Firefox.
- Disable JavaScript in your browser and see whether the problem is still present.
Using browser-based Web developer tools, such as Firebug or the Web Developer add-on, can be extremely useful in troubleshooting problems on the front end. These tools are free and come with good documentation. Figure 4-4 shows both tools installed in Mozilla Firefox.
After you identify the cause of the problem, report it by using the WordPress.org Forums page or the plugin developer's own support forum. Seek help from the WordPress community before trying to resolve the problem yourself. Finally, always report any bugs and fixes you find to the plugin developer because this can help others with the same issue.
Figure 4-4: The Firebug and Web Developer add-ons in Mozilla Firefox.
