Introduction to the Super Login Module for Drupal 7

Drupal Version
7

INTRODUCTION

Drupal’s default login page form is functional but does leave a lot to be desired. It’s pretty bland and, if left as-is, is always a telltale sign that your site is a Drupal website.

Super Login Module for Drupal

The above image is the default Drupal login page and, as we've pointed out, there are multiple areas that could be improved upon.

Over the years, we've incorporated improvements to our site’s login forms via various theme and module hooks. Some of them started with Morten DK’s Watchdog article, “De-Drupalizing The login Form” and have evolved over the years.

Then, we recently read Jeff Atwood’s, “The God Login” Article which led us to incorporate more changes to our login forms and inspired us to release the Super Login module for Drupal 7.

Super Login is a simple, light-weight module that, once enabled, instantly changes the login page from the above screenshot into one like the one below.

Improve Drupal login page form

IMPROVEMENTS

As you can see from the screenshot, there are multiple improvements to our login page. Some of which include:

  • The tabs are removed and replaced with links within the login form itself
  • The submit buttons are replaced with Retina Display compatible images
  • Icons are placed within the fields for a visual clue
  • Redundant field descriptions are removed
  • Page title is hidden and replaced within the forms
  • Placeholder text is displayed within the fields (this feature can be disabled)

There's also some other improvements below the surface:

  • User can now login with their email address as well as their username
  • A "caps lock" message is displayed if the user starts typing their password while caps lock is enabled
  • System messages, such as warning about missing or invalid info when submitting the forms are now displayed within the forms themselves
  • Autofocus is set to the appropriate fields on page load
  • The submit buttons are replaced with images

Just enabling the Super Login module instantly gives you a better looking and more functional Drupal login page. Almost all text strings and features can be changed or disabled with the module's configuration area.

NOTES

Super Login only affects the login and password reset pages. It does not change the login block in anyway.

Page titles on login and password reset pages are attempted to be hidden, however, various theme may output the titles in different ways and may needed to be hidden manually through your theme's CSS

Your theme may already be applying changes to the login pages on your site. If you enable this module and have different results then your stylesheets and/or theme functions may already be altering your login page. If so, you can try modifying your theme or disabling the CSS from the Super Login module in its configuration.

SUMMARY

This module may not be the perfect one size fits all solution but hopefully this will fit the needs for some Drupal website to de-drupalize the login pages. Please let us know if you have suggestions for improvements.

Author Information

Written by: Shawn Ostermann

Shawn is a Drupal Specialists with over 12 years of experiencing building and developing Drupal websites including custom module development and e-commerce websites.