Classroom Transcript: Login Customizations

The following is the transcript of our “Login Customizations” How-to video.

Customizing your lightbox is an effective way to signal to your users how you want them to login and interact with your calendar. In this Localist Lesson we’ll be showing you how you can make sure your lightbox reflects your organization's needs.

Language Changes

The first customization is a basic one. If you have a Shibboleth or CAS Single Sign-On (SSO) configured, you will see an additional login button appear in your lightbox. By default it says “Login with school ID”, but you can change the button to match the messaging your community expects. For example, I’ve changed it to “Log in as Localist Staff”. If you’re interested in customizing the language of your SSO button, please email support@concept3d.com as this can only be changed on our end.

Theme Editor

Beyond changing your Single Sign-On CTA language, you are able to use our Theme Editor to add custom messaging throughout the login lightbox. To get started:

1. Login to your Localist Admin Dashboard
2. In the left side navigation select, Settings > Platform Settings > Appearance
3. On the Appearance page, select the Edit HTML (code icon in screenshot below) for your active theme.
4. This will take you to the Theme Editor where you will find all of the HTML files for your platform.
5. Scroll down the list of files until you see the header Modals.
6. We'll be working in the files _login_message and _login_methods.

Opening Message

If you’d like to modify the default opening message, the _login_message theme file is the place to do so. To do this:

• Swap out the text

• Make sure to keep the opening and closing "p" tags in place

• Save Changes

All files in the Theme Editor, support full HTML so code away if necessary. Additionally, since this falls just above the email address and password fields, this is also a great place to direct people to use these fields for logging in via Localist's local method or through LDAP Single Sign-On.

Single Sign-On

Now let's skip down the lightbox just a bit and revisit that Single Sign-On button we changed to say “Login as Localist Staff.” While tweaking the CTA language often does the trick, if you’d like to add messaging above this button you can do so by jumping over to the _login_methods theme file. This file has much more code in it, but don’t be intimidated! To add content in between the local login fields and your single sign on button:

1. Add a new line between the lines #2 and #3 of an unedited file
2. Add the desired HTML on the new line #3
3. This code can be as simple as text wrapped in "p" tags.

Social Logins

If you’d like to add a similar directive, but for the social media set, scroll down to line #14 of the same unedited template. Remember, as you add new lines, any lines below will numerically increase. If that’s the case, you’ll just be looking for the line before the Facebook login code. This is a great place to let your outside community know that they are not only welcome to create accounts on the platform, but that it is encouraged by your organization!

Additional Information

Finally, another space for customization is after all of the login options. This space is ideal for privacy statements, disclaimers or longer FAQ’s about your platform. To do this:

1. In the same _login_methods template, scroll down to the end of the code
2. Add a new line in between lines #29 and #30 of an unedited template
3. This will be immediately after the LinkedIn login code ends
4. Just as before, if you’re just entering text don’t forget those “p” tags or feel free to flex your design muscle