Minifying is Messing Up My Design

Hi,

To address the issue you’re experiencing with CSS and JavaScript minification causing problems on your site, you can try the following steps:

For CSS Minification Issues:

1. Disable CSS Minification for Specific Files:
   • Go to WP Admin Panel > WP-Optimize > Minify.
   • Navigate to the CSS tab.
   • In the “CSS files to be excluded from minification” section, add the paths of the problematic CSS files.
   • Save the changes and clear the cache.
2. Adjust CSS Settings:
   • Ensure “Enable Merging” is unchecked if it causes issues with your header.
   • Clear the cache again and check the affected pages.

For JavaScript Minification Issues:

1. Disable JavaScript Minification for Specific Files:
   • Go to WP Admin Panel > WP-Optimize > Minify.
   • Navigate to the JavaScript tab.
   • In the “JavaScript files to be excluded from minification” section, add the paths of the problematic JavaScript files.
   • Save the changes and clear the cache.
2. Defer JavaScript Loading:
   • In the same JavaScript settings tab, enable the option to defer JavaScript loading.
   • Save the changes and clear the cache.

Tips:

• Clear Cache:
  • After making changes, ensure you clear both your site’s cache and your browser cache to see the effects.
• Test Changes:
  • Make these changes one at a time and check your site after each change to identify which setting resolves the issue.

By following these steps, you should be able to resolve the issues with minification. If you encounter specific errors or need further assistance, please provide more details.

Thanks!

• This reply was modified 9 months, 2 weeks ago by wpmansour.

Thank you for the response. I am trying to figure out how i would find these specific files. I am not incredibly experienced in CSS and Javascript. I use Elementor to design my site.

I understand that finding specific CSS and JavaScript files can be challenging, especially if you’re not very experienced in web development. Here’s a step-by-step DIY process you can follow:

1. Use Browser Developer Tools:
   • Open your website in Google Chrome.
   • Right-click on the page and select “Inspect” to open Developer Tools.
   • Go to the “Console” tab to see if there are any error messages related to CSS or JavaScript files.
   • Note down the file names and paths mentioned in the errors.
2. Check Elementor Settings:
   • Since you use Elementor, check the settings within Elementor for custom CSS or JS that might be causing issues.
   • Go to Elementor > Tools and check for any minification settings that might conflict with WP-Optimize.

If the DIY process seems too complex, you might consider hiring a developer to assist you. They can quickly identify and exclude the problematic files for you.

Alternatively, our premium customers enjoy premium technical ticket support (https://getwpo.com/premium-support/), where our developers can fix these issues on your behalf. If you’re interested in upgrading to premium for this added benefit, please checkout https://getwpo.com/buy/

Hope this helps. Let me know if you need any further assistance; I’m happy to help you. ??

Best regards,