Theme Conflict Troubleshooting
If you have gone through the steps of Testing for a Theme/Plugin Conflict and only see an issue with your theme, here is a list of common issues we have seen with themes.
This guide is primarily for bespoke themes that are not from places such as WordPress.org, Code Canyon, or other theme shops.
If you are using a paid theme and the conflict is with the theme, we recommend reaching out directly to the author of the theme.
Improper Asset Including
One of the most common problems we see with themes is scripts that are loaded by using an explicit <script> tag in the theme’s markup.
This is especially problematic if jQuery happens to be one of those scripts. Many WordPress plugins including Gravity Forms utilize jQuery. By manually loading jQuery in your theme using a <script>, it will cause jQuery to get loaded multiple times. This is not only bad for performance, it is bound to cause conflicts.
Tip
You can quickly check for jQuery being loaded more than one time by opening up the page source for a given URL and searching for /jquery.
Instead of using <script>, wp_enqueue_script should be utilized. This function provided by WordPress will ensure that the asset only gets loaded once and at the correct time.
For more details, see Including Assets in the WordPress Theme Handbook.
Examples
Bad
<script src="https://code.jquery.com/jquery-latest.min.js"></script>Good
add_action( 'wp_enqueue_scripts', function() {
wp_enqueue_script( 'jquery' );
} );Lack of Plugin API Hooks
It is a theme’s responsibility to ensure that functions such as wp_head() and wp_footer() are called.
These are critical for the output of scripts, styles, meta, and more.
For more details, see Plugin API Hooks in the WordPress Theme Handbook.
Styles
In some situations, styles added by a theme can cause cosmetic and/or functional issues with Gravity Forms and Gravity Perks.
If you are seeing issues such as the following, it’s likely an issue with your theme’s styles.
- Cosmetic
- Colors, sizing, spacing, etc. of elements in a form.
- Functional
- Hidden fields showing when they shouldn’t
- Conditional logic not hiding fields
- Elements covering forms
- Nested Forms not showing in the correct location or being covered
To address these issues, look over your theme’s styles for any elements that may be targeting form elements using !important. Utilizing your browser’s DevTools is a great way to identify what styles are affecting elements.