Your CMS4Schools mobile app has two different home page display options: Icon Grid and News Summary.ย
For multi-site app customers, the home page display is unique to each site. For example, you can have the District site open for users right on the news summary, and your elementary school site on the icon grid display.ย
Icon Grid How to Video
See step by step guide narrative below.
Icon Grid Step by Step
CMS4Schools Mobile App: Menu Builder - Icon Grid Home Page Display
Learn how to customize your app menu including footer tray icon links, expanded menu sections and home page layout options.
1. Login to your CMS4Schools Studio Admin User Interface. We recommend that you open up your app in a new browser tab or window so that you can easily see the changes you make happening live in your mobile app.
Scroll down to the app and messaging, and then click marketing resources.
2. In the web version links on your App Marketing screen, click open.
Tip: Tip! Use a browser based device emulator to help visualize what the app looks like for your end users. We recommend Viewport Resizer for Chrome.
3. Let's take a look at what our menu looks like currently by clicking the menu button.
The initial or current menu setup can be edited. Once you know what changes you would like to make, go back to Studio.
โ ๏ธ Important! You are making changes LIVE in your app that will directly update for all your users.
4. Back in Studio, navigate to the menu builder under apps and messages.
5. In Menu Builder, if you have a multi-site app, you'll need to select which site you want to make changes on. If you have a single site, you'll be able to get started right away.
6. That you have. If you have a multi app, you can choose which type of home page display you would want to use for each of your app sites. The display will show if the app site currently uses News Summary or Icon Grid.
Click on the blue Change button to swap between the two home page display options.
7. Clicking the swap button will open a confirmation window. Click Update.
8. If you swap to the Icon Grid display, you need to manage, or setup, your icon links and the order they appear on the menu screen.
Click Manage Icon Grid Contents.
๐ Remember this is per app site, if you have a multi-site setup.
9. In the Icon Grid Items section, you can now add a new icon link, change the order, and edit any existing icon items.
10. To build a new icon menu item, type a label. The label is the menu item label that shows on the menu for your users.
๐ก We recommend keeping the label short, and try to use a single word. Shorter labels work better on all device sizes.
11. Continue building your item by choosing visibility status (defaults at visible), and then add the Feature from the drop down menu.
All icons require a connected functionality, or feature. If you are creating a direct link, use the Link (Single) or Links/App Directory feature.
12. Next, select the icon for this menu item. Click Choose Icon.
13. In the icon library window, page through or search for the desired icon. Clicking on the icon will load the icon into the item window.
๐ Have an icon request? Email us at support.cms@4schools.net with your request!
14. Save your icon menu item by clicking Add (or Edit).
15. Continue adding or editing menu grid icon items as needed. Remember that for multi-site apps, each menu is created uniquely.
โ To return to the main menu builder page in Studio, click the Back to Menu Builder button.
ย