-
Posts
-
Hello, I just updated my site to the latest version and noticed a major layout issue that is caused by Enfold adding a long-string class declarations to my elements, and defining them in a separate file in the uploads folder (avia_posts_css), and the style definitions are not set ANYWHERE within the Enfold element, yet it redefined my padding to ZERO ( see screenshot in private link).
This greatly concerns me for many reasons:- It’s not working properly because as mentioned, 0 (zero) padding is not defined anywhere in the element yet the post css file declared it, breaking my site
- There’s nowhere I can go to remove the file. I had to create a new layout element and rebuild the content for the problem to go away. Not good! I can’t edit hundreds of pages to fix this…
- There doesn’t appear to be a way I can disable this “feature”
- Enfold’s HTML is already bloated (SEMRush reports indicate that several pages have a very low text to HTML ratio), so additional long-string class declarations on every element is only exacerbating that.
I’m assuming this is to help cut back on inline styles, but frankly, between the random long-string class declarations which can exacerbate the already low text/HTML ratio issue that Enfold has (don’t get me wrong, I’m a huge fan of this theme), and the additional server calls needed for each of these CSS files to load, this isn’t a good trade-off for me. I don’t want or need this “feature” as-is. Please provide instructions on how I can disable it.
Thanks!
AndyHey betaphase,
Thank you for using Enfold.
Can you please update to 4.8.6 – there had been added fixes that might solve some problems – and we work hard to eliminate those we did not catch in testing in the oncoming releases.
We had many requests to extend styling options and animation possibilites for ALB elements. As e.g. hover effects or sonar effects are not supported by inline style we decided to move all custom stylings to CSS rules and a css file (as other template builder like Elementor also do).
This makes it easier to extend elements and maintain the readability of code and keep it stable.
As these changes need a complete change in code we started with some elements providing new styling possibilites like buttons (see changelog 4.8.4) and others which were only changed to support this. We will update all elements step by step in future versions.
We try to keep our selectors as weak as possible (mostly .container.element-id, a few need #top ) so it should be possible to use custom css selectors with #top or #top #wrap_all to override ours. Adding a custom id to an element will also allows it.
Some more insight:
As shortcodes can also be used in sidebars or can be called with do_shortcode() there is a “fallback” for these cases to add the CSS rules in a
<style>...</style>tag right before the element.
So there would be a possibility to supress the css file generation and only have this “fallback”. But this is currently not implemented. We can add a “add_theme_support” option for special use cases – if this helps you.
Best regards,
GünterThanks for the detailed response Günter. The patch does appear to have fixed many of the display issues I was encountering (I haven’t been able to check everything yet though). I still would like to see the ability to disable this as an option, at least while this is still getting fleshed out. It sounds like this new ‘feature’ is in an evolving state, so it would be nice to be able to op-out until a time when it’s least likely to break the display. Thank God for staging areas ;-) Thanks again.
Hi,
The only way to “opt out” would be to copy the shortcodes from 4.8.3 found in enfold\config-templatebuilder\avia-shortcodes\ to your child theme folder enfold-child/shortcodes/. Then theme shortcodes are not loaded. Then you can decide which shortcodes you want to use from theme by deleting them from child theme.
Best regards,
GünterWe are having the same issue. We have updated to 5.1.1 and the the css files contained in uploads/avia_posts_css/ are overriding our padding on the .flex_cell and making the mobile experience a really long narrow column of text. I am not able to overwrite it in Quick CSS. Any suggestions?
- You must be logged in to reply to this topic.