Creating an alternative main.css

Hi all,

I’m using Sage 9 for a site build, I’ve completed the site and all is good but I need to create a variation of a page which will be displayed in an iframe on another website, I need to make a few minor styling changes for this purpose.

My plan is/was to just create an alternative stylesheet (main-alt.css) and in setup.php just put an if(is_page('iframe-page')) around the wp_enqueue_style to load the correct one.

I’ve duplicted main.scss and called it main-alt.scss and in config.json I have:

"main": [
      "./scripts/main.js",
      "./styles/main.scss",
      "./styles/main-alt.scss"
    ],

The problem is that when I run yarn build I’m not getting a main-alt.css file in my dist/styles - what am I missing here?

Thanks in advance
Kevin

Hi @the_lar,

Add another key to the config array like so:

"main": [
      "./scripts/main.js",
      "./styles/main.scss",
    ],
"main-alt": [
      "./styles/main-alt.scss"
],

The array key is the filename that will be added to dist, not the files that you include.

3 Likes

This topic was automatically closed after 42 days. New replies are no longer allowed.