-
Posts
-
I usually love the enhancements you make to the Enfold theme, but I’m kind of surprised by the addition of the minified css file, avia-merged-styles. Unfortunately, it is the last css file to be loaded and thus loads after my child theme’s style.css file, overwriting a few of my custom changes. Your solution requires adding a function to functions.php as per this post https://kriesi.at/support/topic/disable-new-minify-merging-for-css-and-js-avia-merged-styles/#post-921266. I’m comfortable doing that, except I will have to make this change for every one of my client sites. This doesn’t feel like a considered addition to the theme. It’s broken my styles and that shouldn’t be something that I need to be on the lookout for.
I would urge you to reconsider the addition/position of avia-merged-styles so that we don’t have to add code workarounds.
That said, I still love your work and the theme, and I always appreciate your advice.
Cheers
DianaHey Diana,
Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?
Best regards,
VictoriaHey Victoria
I sure can give you access to a staging site that is up-to-date. Links and administrator credentials are provided below. Thanks for taking a look.Warm regards
DianaHi Diana,
Thank you.
I see that you’re not using Enfold minification now, if you would like us to look into the issue of the order of loading styles you will need to enable it, so that we can investigate it.Best regards,
VictoriaHi Victoria
Sorry I incorrectly mentioned minified in my original description. No, I’m not minifying anything (my mistake for mentioning that) and if you ignore that word and read the rest of my issue, the problem remains. My problem stems from avia-merged-styles loading after my child theme’s style.css (as in the title of this thread). I haven’t seen avia-merged-styles before and it looks like a new stylesheet with the latest Enfold version. I’m wondering why it is also the last stylesheet to load?
avia-merged-styles appears in Enfold’s new asset-manager.class.php in
function try_minifying_scripts() around line 65.The live version of the website at crhlaw.com.au which uses Enfold version 4.2.3 has no such css file.
The staging version of the website as per the credentials I supplied, using Enfold version 4.2.6 now has the newly-defined Enfold avia-merged-styles stylesheet. If you search for it in the source, you’ll see it is listed as the very last stylesheet and hence whatever it contains overwrites the custom button styles I’ve specified in my child theme.I’m not sure how else to make clear that this is a new Enfold class, with a new function, that loads a css file after all others have loaded and so causes problems with styles defined in a child theme. I’d like my child theme to load after any Enfold stylesheets without having to code a workaround in my functions.php, as I’m going to have to replicate this on all my client websites.
If you debug the source you’ll see what I mean ;)). Hope you can help.
Cheers
DianaHi Diana,
Enfold introduced this functionality if version 4.2.6 and the order of the loaded styles is supposed to remain the same.
Best regards,
VictoriaThanks for reminding me about header.php. I’ve removed that from the child theme, so yes, the fresh version of header.php would have been included when I updated the theme to version 4.2.6. I’m not sure I get the rest of your answer, as it leaves my high and dry with the same issue.
Yep, I appreciate that Kriesi introduced this functionality in version 4.2.4 but to say the “loaded styles is supposed to remain the same” doesn’t help me much and I hope you can hang in there and give me some more techy help :)). The functionality introduced negates the button style that I introduced in the child theme and so it leaves me uncertain as to how much I can depend on the styles that I specify in my child theme. As a developer, I’m not keen on uncertainty.
For example, compare the CONTACT US button on the Home page on the staging site crhlaw.staging.wpengine.com
compared to the live site at crhlaw.com.au. Button is near the bottom of the page. The staging site is using the newest Enfold version. On the live site I specified a 30px border-radius for any ‘body div .avia-button’ elements. All works fine and I placed that CSS in the style.css of the child theme. If you compare it to the staging site, that 30px border-radius is then overwritten by the 3px in the avia-merged-styles stylesheet. Okay, I know I can slap !important at the end of my style but that’s messy. I know I can fiddle around and get my stylesheet to load after avia-merged-style but that too is messy. Plus that may be an okay fix for one website, but imagine if I’d rolled out that style out to a hundred sites?Am I totally missing the point of a child theme? Isn’t it the place where I can define how I would like my website to look, and then be able to rely on it looking that way in future? Happy to rethink how I do this if you can offer some advice.
Hope you can consider the impact of avia-merged-styles and come back with more information.
Many thanks for your time.
DianaHi Diana,
You can disable the styles merging by adding this to your functions.php
add_filter('avf_merge_assets', function() { return array('css' => 'none', 'js' => 'none'); });If you need further assistance please let us know.
Best regards,
VictoriaYou will need to try to manually load your styles after the merged styles. The solution of disabling the merging is not a real solution, if all you are trying to do is change the load order.
This line is the culprit within the
aviaAssetManagerclass (just search the parent theme fortry_minifying_scripts)add_action('wp_enqueue_scripts', array(&$this, 'try_minifying_scripts') , 999999 );You need to play around with getting your styles to load at a higher priority than 999999. This is a pretty lame decision in my opinion, but it is what it is.
This solution seems more logical if you want to keep the minify functionality. It does not work for me, though? Any clues?
Hi,
@Antonia: Do you have version 4.3.2? You can disable the css and js compression inside the Enfold > Performance panel.
Best regards,
IsmaelHi glozemedia
I hadn’t noticed your reply. Yep, I agree it is lame, and a really large priority number is how I’ve gotten around the issue too. It doesn’t feel right to do it that way, and I know it means I’ll have to hope that the priority for avia-merged-styles doesn’t change to something higher than mine, otherwise I’ll be back to square one.@Antonia, I would turn off any minification and make sure you’re getting things to work they way you want them too first – maybe you’ve already done that. By viewing your website’s source code (in the browser) you can check whether your stylesheet is loading after avia-merged-styles, then try with minification back on.
@Victoria Apologies for the very late reply. Yes, I was manually altering the load order of my child theme’s stylesheet so that it would be the last to load. It worked really well that way for over a year, until avia-merged-styles came along and used the exact same priority I had settled on. I loaded mine manually that way to make sure plugins weren’t coming in later than my stylesheet, so that I could style plugin buttons etc to match my theme. Looks like Enfold and I both had the same idea to use the number 999999 and I kind of assumed no one would go that high. Anyway, all is good now, and I’ve learned my lesson.Thank you all for your help.
Diana
- The topic ‘Problem with new avia-merged-styles loading after style.css’ is closed to new replies.