Edwiser RemUI: Personalization Options

Moodle themes, apart from being functional, have an additional responsibility. They need to be customizable. Usually themes contain a settings panel with options that allow you to make changes, without diving into code.

With Edwiser RemUI, we made sure we added sufficient personalization options to cope with your branding needs.

Font Customization

The font across your Moodle website can be changed with a simple option. Under Site administration → Appearance → Themes → Edwiser RemUI → General Settings

  • Font Type Selector: You can pick a Google font of your choice, and set a different font for the text and headings.

edwiser-remui-colors

Personalizing the Login Page & Logo

The login page is where every student, teacher, manager will land to access course content. Although customization might not be of great importance here, you can add a personal touch by changing the background image and color scheme.

Under Site administration → Appearance → Themes → Edwiser RemUI → Login Page Settings set:

  • Upload Background Image: Set a background image of your choice
  • Signup panel text color: Select the preferred text color for the Login/Signup panel

DEVELOPER TIPS

 Changing Background Image to Color

#page-login-index {
    background-image: none;
    background-color: #00a680;
}

Updating Login Button Color

.loginpanel #loginbtn {
    background-color: #00a680;
}

The above code has to be added in the ‘Custom CSS‘ settings in the theme’s ‘General Settings‘.

Uploading the Logo

With Edwiser RemUI, you can upload a logo image, display your sitename as the logo, or display an icon along with the sitename using the ‘Choose site logo format‘ under Site administration → Appearance → Themes → Edwiser RemUI → General Settings.

If you choose to upload an image, remember the image height should ideally be 50px.

Customizing the Footer

The footer is quite an important but often ignored piece of real estate on your Moodle website. Visitors look towards the footer for links to important pages on your website.

The default footer in Moodle is quite limited. When designing the Edwiser RemUI footer we added more functionality to it.

Here’s what we thought was needed:

  • A contrasting color for clear indication and improved readability
  • A clean well spaced layout
  • Sub-sections within the footer

edwiser-remui-footer

The Moodle footer contains a login option. Since Edwiser RemUI provides you additional sections, there’s lot more information that you can add.

  • Copyright & Privacy Policy links: Copyright information and links to the ‘Privacy Policy’ or ‘Terms & Conditions’ pages should be placed in the footer. These links are not primary, yet need to be present on all pages of your Moodle website, making the footer an ideal place.
  • Sitemap: A link to the sitemap offers an SEO advantage. But a sitemap can also help visitors browse through site contents with ease.
  • Links to Important Pages: Just like the header, the footer can also contain links to important pages, such as ‘About Us’, ‘Blog’, and so on. Apart from pages, you can add links to engaging content such as popular blog posts, or teacher profiles.
  • Social Profile links: Links to social profiles are usually placed in the footer. Edwiser RemUI has a dedicated section to place links to social profiles.
  • About Us: If you do not have a page dedicated for company information, you can add information directly in the footer, and create an ‘About Us’ section.
  • Contact Information: Contact information such as a call to action, contact address, email, location map or  phone number could be placed in the footer. The advantage of placing this information in the footer, is that when a visitor scrolls to the end of the page, contact information is easily available.

Adding Social Profiles Links

Under Site administration → Appearance → Themes → Edwiser RemUI → Footer Settings you should see options to add links to your social profiles under ‘Social Media Settings’.

edwiser-remui-footer-social

Icons corresponding to profiles for which a link has been specified will be displayed in the top-section of the footer.

For example, if you want to display links to your Facebook and Twitter profiles only, you need to specify links to the respective accounts and leave the rest blank.

Customizing Footer Content

The main footer area is divided into three sections- 1st Column (Left), 2nd Column (Middle), 3rd Column (Right)- an even three column layout. To structure a particular column, you need to add content under ‘Custom HTML’ for the column.

edwiser-remui-footer-column-settings

Updating Bottom Footer Section (Default Moodle Footer)

Apart from an option where the login link in displayed, you can specify copyright information, and a link (external link, or a link to Terms & Conditions page).