By default, all Sporty sites are built using a 1170px wide section. This is an industry standard for CMS websites, as it allows your site to behave responsively on tablets or mobile phones. In addition, this format proportions the columns you are using based on percentages ensuring proper sizing for different screen resolutions found on different computers. You can see if you shrink the size of your internet window, when you have a Sporty page open, it'll adjust proportionately.
Sporty also provides an option for you to tailor your website design according to your needs in two ways.
- You can change specific sections on your site to be set to full screen width (see https://support.sportsground.com/hc/en-us/articles/219333248-How-to-create-a-full-width-section).
- You can modify your Site Settings and set an alternate value for all sections displayed on your site.
To change your whole site to use an alternative design, please follow these steps.
1. Click Site Settings
2. Click Section/widget behaviour under the Heading Look and Feel.
3. A modal will open which allows you to choose between setting an explicit width in Pixels or a percentage (%) value for Section width.
Your menu will automatically resize to align with the section width you have defined. Sections that have been checked on for Full screen width will not be impacted by any changes you make to your section settings.
It is important to note that if you set a Pixel Width value, not all people viewing your website will see your website in exactly the same way. Users with higher resolutions than your own PC may see more of the site background. Users with lower resolution devices, or viewing the site on mobile devices will see the full screen, mobile optimised version of your site.
If you set a % value, your sections will encompass that percentage of the screen, irrespective of what the users screen resolution is. People viewing your site will always see that proportion of the background on a PC. People viewing the site on mobile devices will see the full screen, mobile optimised version of your site.
Examples where user has defined specific PX width
1280 x 1024
1680 x 1050
Samples where user has defined 90%
1280 x 1024
1680 x 1050