How to get CSS changes applied to Sage theme

  • Resolved bigdaddyswag

    (@bigdaddyswag)


    6 years, 1 month ago

    Hello. I have taken over a WP site with a custom Sage theme. I am getting familiar, while I haven’t used Sage before. There are many .scss files in the /resources/assets/styles/ directories, but when I make any changes to these files, they do not show on the website. In searching online, it seems that I need to recompile the CSS using “yarn build”. I’ve tried this and many other things that I’ve come across, but my CSS changes seem to be refusing to get pulled in. What is the piece I could be missing here?

    Running the latest WordPress build.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    I suggest starting with the Sage documentation.

    https://roots.io/sage/
    https://roots.io/documentation/

    Thread Starter bigdaddyswag

    (@bigdaddyswag)

    Yes, of course. I’ve already went through many pages of Sage documentation and various other Google results. Like I said, I’ve tried everything that I’ve found as the possible answer to what I need, but am not getting the needed results. I figured someone else has been in this spot and could possibly help.

    Thread Starter bigdaddyswag

    (@bigdaddyswag)

    Additional details…

    From my understanding, I need to SSH to the theme directory and run “yarn build” to re-compile the SCSS files. It runs, but my site doesn’t pull the updates. I also ran “yarn run lint:styles” which pointed out a few issues in the files. I corrected those and now that is fine. I still haven’t gotten further than that.

    I’m running all of this from /wp-content/themes/my-theme-name

    Moderator bcworkz

    (@bcworkz)

    If you are making major changes to the theme CSS, then it may make sense to work with SCSS. But if you have a just a few tweaks that you need to override the theme files, you can simply add such rules to the Additional CSS panel of the customizer. These become inline styles which always override the equivalent external file rules.

    Be sure your caches are cleared, both client and server side. Old CSS versions tend to be very sticky in caches if not explicitly cleared.

    Moderator Jan Dembowski

    (@jdembowski)

    Forum Moderator and Brute Squad

    Moved to Fixing WordPress, this is not a Developing with WordPress topic.

    Thread Starter bigdaddyswag

    (@bigdaddyswag)

    Thanks @bcworkz! After wasting a bunch of my time and my host’s time (Kinsta), I finally went your suggested route and just used the customizer. There are some issues at play apparently preventing the SCSS re-compiling. I’ll side table that and just address it later if I absolutely have to. ??

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘How to get CSS changes applied to Sage theme’ is closed to new replies.

Tags