Mobile Website Setup

When accessing your district's site on smartphone or tablet browsers, users will find:

Upcoming Events

Announcements

Breakfast/Lunch Menu

Staff Directory

District Contact Information

Quick Links

Additionally, if users want to view the desktop version of the website, they can click on "View Desktop Version" to switch to see the full site as is seen on a desktop web browser. Any sections that don't contain information (ie. no Breakfast/Lunch Menu entries in the Lunch Menu Admin), the section will not be visible.

You can use the new "ThemeRoller" application on the Settings screen within the CMS4Schools Admin to customize the colors of your mobile website. Note: ThemeRoller is not supported in Internet Explorer. Finally, you can upload your district logo to the "Mobile Site" category within the Banner Graphic Library to have it replace the district name at the top of the mobile site.

Note: If you have a responsive site, you will not need to use the mobile site option as your website will scale based on the device size.

Be sure you are using a compatible browser, Chrome, Firefox or Safari when you create your custom mobile site. Click the Launch Custom ThemeRoller link.

Custom ThemeRoller

The Custom ThemeRoller gives you a work palette.

Start by reading the concise overview by clicking on the Help Center Link.

Turn on the Inspector. This will expand the appropriate area on the left to show the details of the changes you make.

Use the slide on the Lightness and Saturation bars to vary the palette. Drag a color down to an area of the "mobile phone" template. Repeat until you are satisfied with your theme.

Click the Save and Update button. Click on "Yes", then "OK" and then close the ThemeRoller window when it is done refreshing.

Sample ThemeRoller with Color Changes

Note the expanded area on the left because the Inspector was on when colors were dragged to the mobile phone template.

Mobile Website Screen Shot from an iPhone

Since this is a testing site used to create this document there were no current Upcoming Events, Announcements or Menus available so those modules are not displaying even though they were checked in the setup. If current events, announcements or menus were added to the site they would display on the mobile version of the website.

Note that there is a View Desktop Version button should the viewer prefer to see your whole site.

Adding a Banner to the Mobile Website

To add a banner to your mobile website:

In your main website admin click on the left side link Banner Library, then click on the Add Banner link.

Key in a title for the banner.

Select Mobile Site from the page category drop-down.

Upload the banner file. The on screen directions give you the size and file format limitations. If the format is .swf be sure to add the height and width.