Hummingbird minification problem

Hi, I installed Hummingbird yesterday, went through all of the settings and improved performance significantly.
However I also activated minification and when I looked at my pages today all of the font styles for H1, h2, h3, h4 and body were nor working properly. These are set in the CSS customisation section of my Divi theme.
So I unset minification and they all started working again.
Just so you know, I did not change any of the default settings that minification creates when you activate it, so it was not something that I did wrong. (i.e. I did not move anything from header to footer or include or exclude anything)
Could you please explain why this problem might have occurred and whether there is any more detailed tutorials of the use of minification, as there is scant information in the settings part of the plugin.

  • Adam Czajczyk
    • Support Gorilla

    Hello Paul,

    I hope you're well today and thank you for your question!

    The "minification" feature can bring some significant improvement in site performance but unfortunately it's not always compatible with all configurations (themes especially). That applies to all "minification" tools/plugins around, not only our Hummingbird.

    The issue most likely happens because Divi is a complex theme that implements a lot of custom solutions. What I'd suggest first would be to:

    - make sure that all the plugins on your site and Divi theme are up to date
    - updating Hummingbird to recent 1.1.2 version
    - clearing all caches on site and disabling cache (if you're using any caching plugin)
    - clearing server-side cache if there's any

    and then clearing your browser's cache and giving it another try just to see if it started working.

    Let me know please how it went and I'll investigate the issue further.

    Best regards,

  • Paul Yates
    • Site Builder, Child of Zeus

    Hi Adam,
    Thanks for your response. I did everything that you suggested (The 1.1.2 update arrived yesterday after I has posted the initial problem).
    - All plugins and themes are up to date
    - updated to Hummingbird 1.1.2
    - Cleared all cache (I dont use a plugin - caching is done by my Siteground host)
    - cleared brwoser cache
    Then reset the mimication button to check all files.
    Then viewed my pages
    The result was the exactly the same
    It is clear that the minification process is making my customisation css to be ignored.
    The problem that I have, and why I asked you last time, is that I cant find anywhere where WPMU explain about minification, for example, what exclude and include means (does it, for example, mean exclude from mininfication, or from something else - there is just no information) and I dont want to start moving things from header to footer without any direction or tutorial.
    So I have disabled minification again, and everything is OK again.
    What do you suggest next ?

  • Predrag Dubajic
    • Support

    Hi Paul,

    As Adam mentioned above, minification can only do so much and it mostly depends on the theme/plugin and how its files are written.

    It's possible that some of the files for Divi theme can't be minified so it might be best to simply exclude those troubling files.

    There's unfortunately no quick solution to this so you would need to go through Hummingbird Minification panel and exclude theme files one by one to see which one is causing the issues.

    Best regards,

  • Paul Yates
    • Site Builder, Child of Zeus

    Thank you both for your responses. I could not find any tutorial on Hummingbird on the WPMU website, so was not sure what exclude and include meant. From your response it is evident that it means to include or exclude from minification, so I will play about with that and see what I find.
    Is there any tutorial or help documentation on Hummingbird?

  • Adam Czajczyk
    • Support Gorilla

    Hello Paul!

    The documentation (usage guide) for Hummingbird can be found here:

    As for minification issue.

    Minification essentially removes anything the browser can’t use, like whitespace, inline comments, and unneeded special characters. This creates smaller files, and smaller files mean faster load times. A simple example (code is not relevant, it just an example taken from random Twenty Sixteen theme library):

    Not minified code:

    var style = $( '#twentysixteen-color-scheme-css' ),
    		api = wp.customize;
    	if ( ! style.length ) {
    		style = $( 'head' ).append( '<style type="text/css" id="twentysixteen-color-scheme-css" />' )
    		                    .find( '#twentysixteen-color-scheme-css' );

    Minified code:

    var style=$('#twentysixteen-color-scheme-css'),api=wp.customize;if(!style.length) {style=$('head').append('<style type="text/css" id="twentysixteen-color-scheme-css" />').find('#twentysixteen-color-scheme-css');}

    This is done mostly to reduce file size, therefore speed up its download by the browser which results in decreasing site loading time.

    Hummingbird's "Minification" tool can additionaly combine JavaScript and CSS scripts. This means that instead e.g. of three separate JavaScript files and five separate CSS files browser would load e.g. just one JS and one CSS file.

    That's what "Minify" and "Combine" toggles are for. You can decide whether the particular file detecte by Hummingbird should be minified, combined to with other files or both. You can also toggle "Include" switch off to so the file wouldn't be loaded at all.

    That said, default Hummingbirds settings usually work fine however in case of some themes issues (like in this case) may occur. The simplest way is to disable minification but you may then want to experiment a bit with different settings by toggling on/off "minify" and "combine" switches for listed files - each time checking if the site works fine or breaks. This way you should be able to find out the best setting that will provide some performance increase at the same time keeping your site up and running in top shape.

    However, the only way to find such settings would be to take some time to experiment, unfortunately.

    I hope that helps!
    Best regards,

  • Mike Wiesman
    • WP Jockey

    On this topic, I really with that Humming bird had a way to toggle all on/off for each of the three options; Include, Combine and Minify.

    This would sure save time and would sure make it easier to start from scratch turning on each one as you go.

    I had to go through at turn each one off for each option.......that in itself took about 15mins of just clicking.........

    Sure hope that there will be a Combine/Uncobime All, Minify/Unminify All, Include/uninclude All option soon!

  • Adam Czajczyk
    • Support Gorilla

    Hello Mike!

    I'm glad you were able to handle this. I realize that this may some times be quite a "boring" and time consuming task but this is due to the nature of the minification process itself. Yet, your suggestion on "all" switches sounds as a really handy feature so I'm forwarding it to the developer as a feedback to inspire him.

    Thanks for suggesting it!
    Have a nice day,

    • Mike Wiesman
      • WP Jockey

      A Toggle-All option would be nice, that's fur sure.

      I have since turned off Hummingbird Magnification it's causing way to many issues currently.
      Is there a way to have it active, but not do anything? Like starting from scratch? Reset to Defaults?

      I've deleted all cache files, uninstalled the pulgin, reinstalled, but it seems to always find the settings from before even though I went through and turned all 100+ toggles to off, it's still breaking with my site layout and styles even though everything is un-included, un-minified and un-combined. Ideas???

  • Adam Czajczyk
    • Support Gorilla

    Hello Mike!

    Is there a way to have it active, but not do anything? Like starting from scratch? Reset to Defaults?

    Please try following way:

    1. Go to "Hummingbird -> Minification" page
    2. Toggle the very first switch (on the left of "re-check files" button) off (see screenshot)

    This should "reset" these minification settings and after clicking on "re-check files" it should bring back default/suggested configuration.

    I've deleted all cache files, uninstalled the pulgin, reinstalled, but it seems to always find the settings from before even though I went through and turned all 100+ toggles to off, it's still breaking with my site layout and styles even though everything is un-included, un-minified and un-combined. Ideas???

    I understood from your previous post that playing with these settings helped. It seems I was wrong so I'm sorry if I caused any confusion here. Currently however there's no other way than trying/testing/resetting... I wish it would be easier. As much as I'd love to say otherwise, I must admit that this may be one of extremely rare cases where minification will just not work properly. I would however encourage you to give it another chance as with such an amount of files there's always a chance of missing some specific settings.

    If you need any further assistance, let me know please.

    Best regards,A

    • Mike Wiesman
      • WP Jockey

      Thanks for the reply Adam, I haven't given up on it yet - don't worry! haha.

      I did just updated to the newest version 1.2 and see that there are a few new features that I'm liking already! I like the bulk change!

      I see that there was Divi Integration included in it as well, so I'm excited to start over from scratch and give it another go.

  • Milan
    • WordPress Wizard

    Hello Mike Wiesman ,

    Hope you are well today and wont' mind me chiming here. :slight_smile:

    Yes please do start over, conduct as many test as you want, get satisfied and if you have any query related to latest update, please raise new thread if its off context or ping us back if it looks similar to this one. :slight_smile:

    Enjoy WPMU DEV.

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.