Moodle

In my quest to make Moodle as easy to use and as efficient as possible, I’ve made two changes to the Login Page.

Reorder Login Fields

The first thing that I did was to reorder the Login fields. Generally, we want users to use the Login with Google button. Thus, I want this the topmost option.

I’ve already written this up, so suffice it to say that putting the best option first is important.

Button Color

Changed the button color of the Google Login button. Added the following code to the RAW SCSS intial field:

a.btn.login-identityprovider-btn.btn-block {
background-color:#ffff00;
}

Note that the color (#ffff00) is a bright yellow.

Summary

I’ve added the following code to the CSS portion of our Moodle theme:

.loginform {
display: flex;
flex-direction: column;
}

login.login-form

{
order: 2;
}
.login-identifyproviders
{
order: 1;
}
a.btn.login-identityprovider-btn.btn-block {
background-color:#ffff00;
}

This accomplishs my goals of highlighting the action that I want my participants to take.