Support Center Visit Demo License manager Buy @ envato

Best Way to remove unused CSS Styles

dasserdasser
in Files & images

Hi


Once a site has been built, What is the best method of removing unused CSS styling, I notice from the browser inspector that there are many default CSS styles most of which I have not used. I am using very few elements and sections. This extra CSS causes excess bloat on browser load times

I would like to remove these styles, for example, all woo commerce styling, unused elements etc.

I realise this will cause issues should I wish to add in sections /elements that I haven't used later on. but I don't wish to change or add extra bits. should I wish to restore full function and styles later I can have them in a separate file to add in when needed. I was wondering if there is a quick and easy way to disable unused styles, other than physically removing them.

Idea for future dev roadmap, It would be great if you had the option to select the sections, and elements you wish to use and therefore could only include these and the corresponding CSS styles.

Thanks

Darren

Comments

  • PhilPhil

    Hi,

    Currently, there is no option to remove unused CSS. We are currently working on feature that would allow that, but I cannot tell when it will be out.

    Also, please leave your suggestions on the topic created for that:

    https://forum.muffingroup.com/betheme/discussion/113/your-suggestions-for-future-updates#latest

    Thanks to that, we will not miss your message among other forum discussions.


    Thanks

    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • dasserdasser


    Hi


    Thanks for your reply, yes this feature is very much required as this excess bloat makes using the theme questionable in terms of performance and unnecessary additions. I look forward to it when released.


    In the meantime, I have a connected issue that needs to be resolved.

    I am using a shape divider on a wrap on the site, which works fine. however, on loading the site and changing pages it quickly flashes up with the default shape and styling before applying the selected shape and style , i.e large arc and black. I'm assuming this is because the initial CSS loaded and then overwritten later by the selected styled CSS applied by the builder.

    I assume these duplicate default styling elements require removing rather than subsequently declaring further down the CSS file, what's the best way of doing this and which file or db entry will it be defined/stored in? or is it a cache that needs updating?


    This is an example of the way betheme potentially makes inefficient use of styling, it's method of styling appears to use overwrites and duplicate CSS declares.


    Please advise the best way to resolve this issue,

    thanks


    The site is not yet quite finished therefore not reachable via the domain, so unable to show you without local host file edit.

  • PhilPhil

    I need to take a look at your website to know what is happening and what might be the reason.

    Please send how I should edit the host file privately thru the contact form, which is on the right side at http://themeforest.net/user/muffingroup#contact, and we will check what might be the reason.

    Notice!

    Please attach a link to this forum discussion.

    Thanks

    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • PhilPhil

    Please go to Betheme -> Theme options -> Performance, and select Builder local styles: Inline in the header.

    image.png

    Thanks

    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • dasserdasser

    Hi

    Thank you for the reply I have sent the details for the host file over via the link provided.

    I look forward to your response

    Thanks

  • PhilPhil

    Did you check my last message?

    https://forum.muffingroup.com/betheme/discussion/comment/233414#Comment_233414

    Did it help you?


    Best regards

    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • dasserdasser

    Hi


    Thanks for the update, I changed the settings as advised but it is still doing it.

  • PhilPhil

    Please send us WordPress dashboard access privately thru the contact form, as you did previously with link to website http://themeforest.net/user/muffingroup#contact.

    Please attach a link to this forum discussion.

    Sending incorrect or incomplete data will result in a longer response time.

    Therefore, please ensure that the data you are sending is complete and correct.

    Thanks

    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • dasserdasser
    edited April 2023

    hI

    I have found the cause, it seems I was including a global section where I styled the shape divide, but when I stopped using this and applied it o each page wrap instead it stopped flashing the initial design style.



    Thanks

  • PhilPhil

    So did you handle it?

    Is there anything else I can help you with?


    Best regards

    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • dasserdasser

    Hi

    yes thanks

    For now, it seems to be working as expected. ideally, it would be better in a global section but it seems that introduces the flashing black original styling before it loads.


    I will try again once live and let you know if still having further issues

    thanks

Sign In or Register to comment.