Page Banners: Creating a Banner for your Ultranet page


The Page Banner is an optional module which can be used to quickly and easily create a welcoming banner or used to theme a topic related page.

Screen Shot 2013-08-09 at 9.02.32 AM.png

Whilst the banner has a useful role to play on pages themselves it has been primarily designed to interface with future versions of the Ultranet mobile app. Page banners will be picked up by the app for easy visual recognition on small form factor devices. In addition to the banner, a 'thumbnail' image can also be added to the page. This will act as a page identifier (such as a class photo or other representative image) and will appear in thumbnail form on the list of class pages to assist with navigation.


Getting Started

The page banner is enabled on the webpage itself. Open the Page Tools menu and  select 'General Settings' from the Admin Options menu.

Screen Shot page tools menu.png

On the 'Settings' tab, check the 'Enable page banner' box. If desired, a page identifier i.e. thumbnail image can also be uploaded. (Refer to the end of this article for image dimensions).


Editing the Page Banner

Once the page banner has been enabled the option to 'Edit Banner' will appear in the Edit Options of the Page Tools menu. 

Screen Shot 2013-08-09 at 10.17.24 AM.png

Selecting 'Edit Banner' will open the banner editor.

edit banner 2.png

There are 3 components that can be used to create the banner, the background, the text box, and optionally the thumbnail image if one has been uploaded. Content is added and adjusted using the buttons on the toolbar.


By varying the use of  just these three components a range of attractive banner designs can be created.


Image Dimensions

The background image needs to be at least 960 pixels wide. An image smaller than this will be stretched to fit the frame and this may result in some distortion and pixelation.

The thumbnail image must be at least 310px x 310px.  If a larger image is uploaded this will be cropped to size with a selected portion of the image used as the thumbnail.


Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request


Article is closed for comments.
Powered by Zendesk