Starr Cancer Consortium

Custom Navigation and User-Friendly Modules

Filter by Type:

Filter by Industry:

Starr Cancer wanted their existing site to be converted into a Sitefinity site so they could take advantage of the many Sitefinity content management features. They also wanted to make their site responsive so it could be viewed on mobile and tablet devices.  

Two of the Sitefinity features that were highlighted with this project are the Sitefinity Module Builder and the Sitefinity Navigation Widget

Module Builder

Using Sitefinity's Module Builder, the programmers at Inalign were able to expand on the end-users' capabilities.  A module was created for each of the pages in which there were multiple lists of information (Awarded Grants, Publications, Visiting Fellows Program, and Archives.)  Each module had categories associated with it (for Publications it was the publication year).   This enables the Starr Cancer people to simply enter the information for a module, specify the category, and it automatically shows up on the page.  The styling was done via a css file.

Screenshot of SCC Categories

Navigation Widget

The Sitefinity Navigation Widget has built-in functionality for highlighting the page you’re on and opening and closing sub-navigation.  There are also options for setting up either a horizontal or vertical nav, for having the sub-navs expanded or contracted, and to select which pages are displayed in the navigation.  To make the navigation look like the existing Starr Cancer site, all of the styling was done via external css.

Current page is highlighted

Screenshot of SCC Nav

Navigation is contracted

Screenshot of SCC Nav

Responsive Design

To make the site responsive, Inalign used the unsemantic responsive grid to layout the page.  Unsemantic is a css file incorporated into the project.  When laying out the page with the unsemantic grids, the pages can shift naturally from desktop to mobile.  You can also easily choose which sections of the page will show up on which device.  Throw in a little javascript to make the navigation button work and some css for styling and life is good.

Are You Ready to
Supercharge Your Project?