Hummingbird Font style missing

Once Asset Optimization is enabled, the font style seems to change when compared to un-minified site. Seems like the child themes style.css is getting overriding with the parent theme CSS.

Looking to fix the behavior via Hummingbird. Please check the chat transcript for more info.

  • Majid
    • Syntax Hero

    Hello chathura
    I hope you are doing great :slight_smile:

    I could notice the issue after enabling Assets optimization, and as my colleague Nithin mentioned yesterday during the Live Chat, is looks like the parent theme is loading after the child somehow when assets optimization is active.

    For now the solution that might help here is using the keyword !important to all the headers types. so for example you have the parent theme css

    h2 {
        font-size: 26px;
    }

    And in the child theme, instead of having just

    h2 {
        font-size: 42px;
        margin-top: 0;
    }

    You would want to use this instead

    h2 {
        font-size: 42px !important;
        margin-top: 0;
    }

    In this case, even if the parent theme css is loaded after the child theme, the later css would be still used instead.

    Let me know what do you think about this solution :slight_smile:

    Cheers,
    Majid

  • Nithin
    • Support Wizard

    Hello chathura,

    As part of our chat conversation, since using !important for all the CSS instance doesn't help much, I'm bringing this into the developers attention, so that we could see whether there is any way to make this work via the Hummingbird plugins side.

    Either myself, or the developer will keep you updated via the ticket asap.

    Have a great day ahead. :slight_smile:

    Best Regards,
    Nithin

  • Dimitris
    • Support Star

    Hello chathura

    I just downloaded your child theme and I was able to replicate the same issue in a testing site of mine, using latest Divi parent theme and HummingBird.
    In order to resolve that, I should push child theme's style.css to footer, so it's getting loaded after parent theme styles. In order to do so, please enable next setting:

    After doing do, visit homepage again, so HummingBird will trigger its processes and also click on the "Clear Cache" button in HummingBird -> Asset Optimization.

    Finally, clear any other caches that you might use, like from W3TC plugin that I see you're also using. Also keep in mind that you have also enabled W3TC Minify which may conflict with HummingBird's Asset Optimization, so I'd advise to deactivate it (especially in case above issue still remains).
    https://yourdomain.com/wp-admin/network/admin.php?page=w3tc_minify

    Thank you,
    Dimitris

  • Dimitris
    • Support Star

    Hey there!

    I just made above change in HummingBird and deactivated Minify from W3TC (apart from HTML).
    It seems that the /wp-content/themes/Divi%20Resume/style.css is still being loaded in the header though.

    I cleared caches from HummingBird and W3TC, but this didn't do the trick.
    Can we temporarily disable W3TC altogether, until we resolve this, please?

    I also noticed some errors in browser's console log whilst in Asset Optimimazation, about missing JS files of remove-add-to-cart-woocommerce plugin.
    As this may break HummingBird's procedures, would you be able to deactivate it, so we can test again?
    As this is a live site, I understand that deactivating plugins may be an easy decision. In this case, please do create a staging environment, meaning a complete and exact copy of this site into another location/folder in the same server, using a separate database, so we can carry on troubleshooting safely. :slight_smile:
    https://premium.wpmudev.org/blog/set-up-staging-site-cheap-shared-hosting/
    https://premium.wpmudev.org/blog/benefits-of-staging-environments-in-wordpress-development/

    Thank you,
    Dimitris

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.