Altitude Theme

Customizing Altitude


Altitude is a responsive Moodle® theme designed by Remote-Learner’s Learning Solutions team. It is bootstrap based, and mobile ready. Most importantly, Altitude is easy to configure, and is highly customizable.


Site Administration > Appearance > Themes > Altitude


Design Tab
  • Upload a Logo for the header of the site.
    • Maximum height of the image should be 150px
    • Maximum width should be 300px
  • Select a Theme Color from the dropdown menu, to compliment the logo uploaded.
  • Upload a Favicon for the browser title.
    • Dimensions for the favicon should be 16x16px.
  • Add Social Media Icons, if desired. Each line should consist of the Font Awesome icon name, pipe, #fullURL.
    • Example: facebook|#http://facebooklink
  • Click Save changes to commit the changes to the server.
Front Page Tab
  • Customize theFront Page Banner:
    • Image(s) - Upload up to four images that will rotate display in the banner. Images should have the dimensions 1920x500.
    • Video - Use a URL (mp4, webm, or ogg) to load a looping video as the banner background.
      • Include a Video Background Static Image that will stand in place of the video if a user has a slower internet connection.
      • Add Video Header Text and Video Paragraph Text that will overlay the video in pre-formatted text.
  • Configure the Front Page Blocks by completing the following fields for each:
    • Subsection (#) Header - title text below icon
    • Subsection (#) Icon - this is where the Font Awesome name is entered
    • Subsection (#) Description - paragraph text under header
    • Subsection (#) Link - add a URL to this field to make the icon and label a hyperlink
    • Subsection (#) Label - this is an optional field that can be used to add a label beneath the description. Keep length of text short to ensure it fits in the label.
  • Click Save changes to commit the changes to the server.
User Interface Tab
  • The Course Category AJAX setting is by defaultenabled. To disable, unselect checkbox.
  • Simple Quiz Navigation is enabled by default. To disable, unselect checkbox.
  • The Slideout Block Panel is disabled by default. To enable, select checkbox.
    • Choose which side the panel will slide out from, by selecting "Left" or "Right" in the Slightout Block Panel Alignment dropdown menu
    • Use the Slideout Toggle Button Type dropdown menu to select how the toggle button displays. Options include: "Icon and Text," "Icon Only," or "Text Only".
  • Select the preferred One Topic Enhanced Style from the dropdown menu. Either "None," "Vertical," or "Enhanced Tabs"are available.
  • To enable the Grid Enhanced Style, select the checkbox.
  • To enable the My Courses dropdown menu on the front page header, select the checkbox.
  • ClickSave changesto commit the changes to the server.
Advanced Tab
  • Upload a Custom CSS file or directly add Custom CSS code in either field of this tab.
  • Click Save changes to commit the changes to the server.
User Alerts Tab
  • Enable alerts by selecting the checkbox.
  • Select the Level of the alert from the dropdown menu. Available options are: "Information," "Warning," and "Announcement".
  • Enter the alert Title and Alert Text.
  • Click Save changes to commit the changes to the server.


  • Navigate to the front page of the site, and any other pages in which updates were made.
  • Verify the theme displayed reflects the design changes completed.