[Ed Beck]

Hi Everyone,

My name is Ed Beck, and I work at SUNY Oneonta. I lead a cross SUNY collaboration called SUNY Create that uses Reclaim Hosting to build websites with students classes and projects.

SUNY Geneseo and SUNY Oneonta are kicking the tires on OpenLab for potential use, and we wanted to to further align our OpenLab websites to match our institution’s branding. Both sites are set up as subdomain multisites.

Our first instinct was to use the custom CSS in the customizer to change things.

Amanda at Geneseo made a lot of headway making her Openlab look great with Geneseo colors.

https://geneseocdl.amandawentworth.sunycreate.cloud/

Where this method really breaks down however is specifically the toolbar on subdomains. Because the subdomain pulls that sites custom css file, and not the main site, the changes to the toolbar disappear.

https://admin-portfolio.geneseocdl.amandawentworth.sunycreate.cloud/

Our second thought was to create a new “color” category.

So instead of having red.css, blue.css, and green.css, there would also be a geneseo.css that we could select from the customizer. We thought that doing a simple search and replace, we could copy 99% of one of the color scheme websheets, and just replace all of certain colors for our institutions branding.

We were able to create the files, but where I got stuck was, I couldn’t find where to add my new geneseo.css and toolbar-geneseo.css to the customizer menu.

Third thought was to make a child theme.

I’ve made child themes before, usually using one of the child theme generator plugins, but I have never done it on a theme as complicated as OpenLab. When I made an automatically generated child theme using two of the more popular child theme generator plugins, a couple things on the website got a little wonky, like the slider’s text.

<hr />

I think that the solution should actually be a combination of 2 and 3, but I am having a little trouble figuring out where to start. Any suggestions or words of encouragement?

 

 

[Ray]

Hi Ed,

For option 1, the customizer only takes effect for the main site, so that’s why you wouldn’t see the changes on subdomain sites.

For option 2, you’d need to write a plugin to specifically add the different color scheme. Probably doesn’t make sense to do this as this doesn’t solve the problem you want to solve.

For option 3, creating a child theme doesn’t solve the problem you want to solve as you want to apply styles from the main site to the subdomain site.

Is the only issue in styling the toolbar throughout your site? If so, I think the easiest path is to write your custom CSS in an external .css file that should apply to all your sites, then load this CSS file throughout your site via a custom plugin.

Let me know if you have any other questions.

[Ed Beck]

We are going to take a shot with this plugin.

https://wordpress.org/plugins/multisite-custom-css/

Thanks for the reply.

[Ray]

Hi Ed,

That plugin only unlocks the CSS customizer for regular site administrators. It is still limited to the current site and will not apply across all your subdomains.

[Ed Beck]

What about this?

https://wpexplorer-themes.com/total/snippets/multisite-use-main-site-settings/

[Ray]

Second snippet in that post might work. But it doesn’t perform well because it will query the main site each time to load the main site’s CSS.

I would go with what I suggested. Write an external .css file and load it manually in a plugin.

Should be really simple. Something like this in wp-content/plugins/bp-custom.php or in wp-content/mu-plugins/custom.php:

add_action( 'wp_enqueue_scripts', function() {
    wp_enqueue_style( 'global-css', 'DIRECT LINK TO YOUR CSS FILE', array() );
}, 99 );

[Author]

Posts