So this was an interesting issue that I recently ran into for a client using Divi Builder. In Divi, you can set up templates for different page types that define the header and footer and allow you to customize the body section specific to each page. I had already defined the global header and footer for the website and applied them to the WooCommerce pages – shop, archive, single product, cart, my account, checkout page and more. However, the shop and archive pages – specifically the category archive page – would not render the global footer correctly. This was odd to me because the footer was rendered correctly on the other WooCommerce pages – single product, cart, my account and the checkout page.
Divi has this neat little feature that allows administrators to enable Safe Mode which will temporarily disable features and plugins that may be causing problems. It disables all plugins (except for WooCommerce), child themes, and custom code so you can troubleshoot what might be causing the issue. The best part about the Safe Mode feature is that it only applies to your current user session so visitors to your website are not affected. I enabled the Safe Mode option and it did allow the footer to render correctly on all pages. This tells me that some code somewhere is causing the footer rendering issues.
In an effort to further deduce the troublemaker, I applied the following steps:
– Updated all plugins and themes to the latest versions
– Deactivated all plugins one-by-one
– Deactivated the child theme
– Removed and disabled all custom code including Google scripts
– Cleared the caches (website, server and browser)
– Enabled debug logs to uncover code issues
– Played with the WooCommerce general settings
– Inspected the WooCommerce template files for structure errors
– Inspected the CSS code rendered in the browser
After going through all of that, I was not able to find any code errors, structural issues or plugins that were conflicting with the footer. After spending way too much time on the issue, I decided to go through each Divi Theme Option to see if any of those settings might be causing the problem.
After enabling or disabling each option one-by-one, I clicked ‘Enabled’ on the Load Dynamic Stylesheet in-line option and lo and behold the footer rendered correctly on all pages, including the Shop and Archive products pages! It took way too long to find the issue but maybe I could save someone else some time if you happen to run into the same problem.
To enable this option:
1. Go to Divi > Theme Options
2. On the General tab, click on the Performance sub-tab
3. Enable the Load Dynamic Stylesheet In-line
4. Clear the website cache and refresh the problem page(s)
I hope this helps. If you are still having issues and need help diagnosing the problem, we would be happy to assist you. Please contact us below to get started.
