Jump to content

Global CSS


Recommended Posts

Is there a way to load my own custom css that will affect the site globally? 


I've tried using the single page head code and cascading head code, but those both insert the styling inline when the page loads. I'd prefer to load once and affect all pages if possible. Thanks



Link to comment
Share on other sites

You can use the @import css function to upload external stylesheets that will process pages globally, on load.  


You can do this through the head code - or inject your CSS for the external style sheet call within your Admin Control Panel > Website Setting > Theme Settings > Logo > Title 


That title has a limit to the number of characters (255 maybe?) so it should be used in a restricted manner for an import like this.


DISCLAIMER: the sportsengine support team doesn't support css issues/troubleshooting.  So, be careful and test on a sample page before you apply your import 'globally'.  

Link to comment
Share on other sites

  • 1 month later...

Just a clarification here.


In page options:


Single Page <HEAD> Code:


This modifies the CSS and style ONLY ON THE SINGLE PAGE YOU SET IT


Cascading <HEAD> Code:


This modifies the CSS and style on THIS PAGE AND ALL PAGES THAT FALL BELOW IT.


You have to set the Cascading <HEAD> Code on ALL THE TOP LEVEL PAGES (by copying your style from a page that is styled the way you want) to the other TOP LEVEL pages and then all pages on the site will be styled the same.

  • Like 1
Link to comment
Share on other sites

  • 8 months later...

Can anyone give some more guidance on the usage here?   I want to widen my site, there's so little room width wise that it all looks cramped.  


I get what you're saying, but since the site is hosted on sportsengines servers, where am I supposed to put the css file I want to use?  Then do I simply call it like I would on a normal website?


<head><link href="//cdn.websitetoolbox.com/css/forum_global.css" rel="stylesheet" type="text/css"></head> ?



Link to comment
Share on other sites

There are basically 3 ways to include css in SportsEngine


1. Add the CSS to the single page head code

2. Add the CSS to the cascading page head code

3. Add a link to your external css file to the head code.


The first two are found in the page options when you go to edit mode.


The difference between the 2 section is

-The single page head code will only apply to that page.

-The cascading page head code will apply to that page and all pages that are under it in the menu


So if you have several top level pages (i.e. about us, schedule, games, rosters) you have to put your head code on each of the top pages in the cascading head code section.


Finally - if you want to use an external css file, I have had luck with uploading the css file to an admin page so the SE creates a link.  Then you can add the link to the head code (using the above instructions) using the link to the css file on the admin page.


Thats my story and I'm sticking to it.







Link to comment
Share on other sites

Occasionally, the option is not turned on by SE for whatever reason.  Just email your sales rep and they can turn it on. Takes a couple of minutes.


So you do not see edit <head> code under page options? If not then just email your rep.


Screen Shot 2019-05-23 at 10.49.39 AM.png 


Link to comment
Share on other sites

  • 9 months later...
  • 8 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Create New...