Navigation Logo is an extension for displaying an image in the course navigation bar.
The image displays with minimal padding by default or can be configured to fill the navigation bar height. For mobile, an alternative, mobile-friendly image can be specified or the logo can be hidden entirely. The logo can be shown on the menu, on specific pages, or everywhere as default.
The following attributes are set within course.json.
The object that defines the content to render. It contains the following settings:
Turns on and off the Navigation Logo extension.
_isHiddenOnMenu (boolean)
When true, hides the logo on the main menu. Default: false
The graphic object that defines the image which is rendered. The assumed use case for this image is to display a client's logo. It contains the following settings:
File name (including path) of the image. Path should be relative to the src folder (e.g. "course/en/images/logo.jpg").
Optional, file name (including path) of the image. Used to display an alternative image for mobile view. Useful for displaying a smaller logo.
This text becomes the image’s alt attribute.
When set to a valid Adapt element, the logo image will link to the specified location. Valid values include a page (e.g. co-100) or a menu (e.g. course)
Default: false where the image is displayed with minimal padding. Set to true for the image to fill the nav bar height.
Optional, hide logo for mobile view. Useful to declutter the navigation bar where limited space is available.
The following attributes are set within contentObjects.json.
The object that defines the content to render. It contains the following settings:
When false, hides the logo on a specific page or sub menu. Default: true
Remember to include an alt attribute. Screen readers will read aloud alt text content, so leave the alt text empty ("alt": "") if the logo is repeated in the course title.
Author / maintainer: CGKineo
AAT support: Yes
Accessibility support: WAI AA
RTL support: Yes
Cross-platform coverage: Chrome, Chrome for Android, Firefox (ESR + latest version), Edge, Safari for macOS/iOS/iPadOS, Opera