Support

Account

Register Login

Home › Forums › Backend Issues (wp-admin) › Suggestions for creating dynamic stylesheets with ACF values › Reply To: Suggestions for creating dynamic stylesheets with ACF values

  • I took a quick look at the article you linked and I don’t see anything in the basic idea that would not still apply. If I was going to do this that’s likely the way I would go.

    What follows is just my thinking on the subject and you can disregard it if you want. It’s just an opinion and you know what they say about opinions.

    I, personally, have given up on my arguments that were the same as yours because I was determined at one point in my life to keep complete separation between content and design. Mostly now I use inline styles when I need to. I either put the style right in the element or I generate inline <style> blocks when I need to do something complicated (like add a client uploaded image as a background using responsive background image CSS.) Why, because it takes less time to load a page with inline styles than it does to load that extra dynamic stylesheet, even if that extra dynamic stylesheet id pre-generated.

    In your case you’re probably talking about 2 pre-generated style sheets, one using global options and another for page specific options, further increasing the number of http requests. Everything is about page load time now and even knocking off a few milliseconds off can be important. Gone are the days when you disregard these milliseconds in favor of “Best Practices”

    I am also usually under time constraints. Pre-generation of separate style sheets would take more time to build a site, extra time that most of my clients would rather not pay for. In addition to this, in 6 months I’ll need to figure out WTF I was doing. It means changes in multiple files where using inline styles lets me see everything at once.

    I still use stylesheets for everything that will not change, but inline styles for those things that I want to be configurable.

    My change of opinion happened when it became possible to add a ‘<style>’ block anywhere in a page and was no longer confined to needing to be in the `<head>’

    so:

    1. Decreased Page Load Time
    2. Decreased Site Dev Time
    3. Decreased Future Dev Time

    now outweigh my need to separate all CSS into stylesheets and all JavaScript into their own files, etc.

    Let’s look at it another way. I am building a site that uses bootstrap. I am using flexible content fields. I am giving the client the ability to adjust the bootstrap columns. What is the difference if I dynamically include a class like “align-self-bottom” or I add a style like “color: #000” to an element? Not much.