Changes

The Login page allows a user to gain access to your SmartSimple System. The user will authenticate on this page, typically by entering a username and password. You will need global administrator '''Global Administrator''' access to setup or edit login pages.

# Direct people to a [[Signup_Page|signup page]]via the (routing page)

This article will show you how to setup and modify login pages within your systemand we will look at other related settings.

1. Click on the 9-square menu '''Menu''' icon on the top right of your page.

:: {{Icon-Menu}} 2. Under the heading '''Configuration, '''select Select '''Global Settings.'''

:: [[File:Finding login pages branding.png|600pxthumb|none|border800px|The link to create and edit login pages.]] 

:: [[File:List of login pages.png|900pxthumb|none|border800px|The list of login pages.]] 6. Staying on the '''Primary''' tab, click the '''New Login Page''' button which looks like a '''+''' icon in the action bar to create a new Login Page. [[File:New login page button.png|thumb|none|800px|The new login page button.]] 7. Select the desired language 8. Modify the settings on the '''General''' tab as needed and press '''Save'''. ==Login Page Branding== There are several settings under '''Page Formatting''' to control the look of the background image and its positioning. Note, background images should be something generic like a solid block of color, a pattern or photo. Avoid graphic elements like logos that must be visible as the same image will be used across all devices, screen sizes and both in portrait and landscape so clipping will occur. The recommended dimensions of background images are 1920 x 1280 with 72 pixels per inch (PPI). You can also adjust the opacity and color of the panel. ==Multiple/Switching Languages==Administrators may create a separate login page for each language they want to support. Administrators will choose the desired language for a login page when they create a new login page. If you have more than one language login page, the user will see a select one drop down in the top right of the screen as long as you have set the '''Page Layout''' setting to '''Default''', alternately you may chose '''Custom''' and add the sample template. The user can choose their desired language from this drop down. The language the user chooses will follow through after login.  If you choose to have a single login page for all users instead of separate login pages per language, then upon login users will be directed to the language they last chose within the platform. Administrators can choose which language login page is the default via a toggle on the settings page for the desired login page. This determines which language login page will be displayed if a user goes to https://youralias.smartsimple.com/ without specifying a language ID. You can also send your users a direct link to a specific language login page by adding '''?&lang=''' to the login page URL. For example the URL to a Spanish login page would look as follows where 14 is the language id <pre> https://myalias.smartsimple.com/s_Login.jsp?&lang=14</pre> ==Creating a Routing Page==Routing pages are created to direct (guide) the end user to the appropriate page which is typically a [[Signup_Page|Signup page]].When a user navigates to a login page they will click a button which is typically labeled register on the login page and that will take the user to an intermediary (routing) page where they can see the list of available signup pages. Routing pages are recommended if you have: * Multiple signup pages to register different kinds of organizations and users* Multiple signup pages for different languages* Multiple eligibility questionnaires  [[File:Singup-routing.png|thumb|none|800px|The routing page takes users to the signup page that is right for them.]] [[File:Login-Routing-Page.jpg|thumb|none|800px|How the configuration page for a routing page looks.]]  To create a routing page # Go to '''Menu''' Icon > '''Global Settings''' > '''Branding''' tab > '''Login Pages''' link > edit the desired login page > '''Routing Page''' tab.# Under '''Routing Links''' press the '''Add Link''' button (looks like a plus sign "+") to add a new link.# For '''Title''' enter some text to indicate the kind of signup page you will link to. Example Individual, Domestic Organization, International Organization, etc.# For '''Description''' enter some text to help people choose the correct signup page. Example, '''For applicants who are not associated with an organization'''.# For '''URL''' enter the URL to your signup page or use the '''URL Lookup''' to find it. If you paste the Page URL of your signup page into a routing page, make sure you use the relative path. Relative paths will resolve correctly and work on production as well as development and backup Environments. Example: <pre>/s_csignup.jsp?token=XVtQHUUGYVpQRhRRXxNRS1BWZEl2HnFsFA%3D%3D&ptoken=XVtQC1oGYVpQRhRRXxNRS1BWZEl2HnFsFQ%3D%3D</pre># Press '''Save'''. ==Agreeing to Cookies==Cookies are small pieces of data stored on a user’s computer by their browser.Depending on your jurisdiction you may be required to notify your users of the use of cookies.Learn more about cookies and the EU cookie directive in this [https://en.wikipedia.org/wiki/HTTP_cookie#EU_cookie_directive Wikipedia article on cookies].

:: [[File:New login page buttonThe first time a user comes to your system they will be presented with an alert explaining that SmartSimple Cloud uses cookies. It also states that by using the system they are consenting to the use of cookies. The user can click '''OK''' to accept or navigate away. There is also a link to a longer description which explains what cookies are being used and why.png|180px|border]]

==Switching languages==Administrators need [[File:cookies.jpg|thumb|none|800px|The Cookies acceptance alert shown to create a separate login page for each language you want to support. You choose the desired language for a login page when you create a new login pageall users first time they visit your system.]]

If ==Privacy and Security Policies==: ''Main Article: [[Configuring Privacy, Confidentiality and Other Policies]]'':Within your system you will need to set up Privacy and Security Policies. You will set these policies up for several language and country combinations. Typically, a privacy policy will say what type of information you collect, why it is collected, how it is collected , what you will use the information for, who will have more than one language access to the information, how users will be notified of changes to the policy and who to contact regarding privacy concerns.By default, the login pagewill have a button called '''Privacy & Security Policies''' in the main panel below the email and password inputs. This link will display any policies you have set up for the '''Default Country''' (default country is a privacy country option that is generally used for all countries if the user has not logged in or if there are no country-specific policies). After the user has logged in, and if the user has a country specified in their profile then the user will be able to see their specific countries/language policies in the header if they have been configured.If you have chosen a drop down date for '''Enforce User Acceptance''' the user will be brought directly to your policies upon login and the user will be forced to accept the policies in order to use the top right system. A record of the screen. The user can choose their desired language from this drop downthat acceptance is also recorded and retrievable.

Administrators can choose which language login page is If you are using '''Default''' for the '''Page Layout''' setting, you also have the option to '''Hide''' the default via a toggle '''Privacy Policies''' on the settings page for the desired log in login page.

You ==Forgot Password==A forgot password link appears by default on the login page. Users can also send enter an email and the system will email instructions to the user if that email address has been registered and given system access.  If you do not receive an email within a few minutes check your spam/junk mail folder. The account recovery email sent to users a direct can be configured by doing the following: # Go to '''Menu''' icon > '''Global Settings''' > '''Security''' Tab > '''Password and Activation Policies''' link > '''Activation Emails''' tab > scroll down to a specific language '''Password reset'''.# Modify the content as desired.# Press '''Save'''. =Configuration - Advanced===CAPTCHA on the Login==If you enter the wrong email and password into the login pagetwice you will see a CAPTCHA. For example, if I wanted CAPTCHA stands for "Completely Automated Public Turing Test to tell Computers and Humans Apart”. It is used in this case to verify that the user is a person and not an automated program attempting to send login. [[File:captcha-login.jpg|thumb|none|800px|CAPTCHA displayed after wrong email and password combination entered]] You can choose Google reCAPTCHA or alternate CAPTCHA or specify alternate CAPTCHA only for users in countries that are unable to communicate with CAPTCHA servers because of government policy. This is done by selecting a country such as China in the '''Countries Using Alternate CAPTCHA Service:''' setting.This setting can be found at '''Menu''' icon > '''Global Settings''' > '''Security''' tab. ==Popup Blocker Check==The login page can be configured Spanish language to check whether users have a pop-up blocker enabled if you are using a custom page template. If the user does have a popup blocker enabled they will receive a warning with a suggestion that they disable their pop-up blocker. Typically we leave this check disabled and do not warn users that they are using a pop up blocker. [[File:popup-blocker.jpg|thumb|none|500px|Warning message displayed on login page I would adding ?&lang=14 when a pop-up blocker is detected]] If you choose you can enable this check and warning message by doing the following. # Go to '''Menu''' icon > '''Global Settings''' > '''Branding''' tab > '''Login Pages''' link > edit the desired login page .# Make sure '''Page Layout''' is set to '''Custom'''.# Go to the '''Template''' tab.# Inside the '''Login Page Template''' text area search for '''disabled="disabled"''' (If you don't see it add the sample template).# Remove the '''disabled="disabled"''' text.# Press '''Save'''. ==Alternate Login Pages==The '''Alternate '''tab from the Login Page list view is used to create and edit multiple custom login pages with a specific instance URL . If you are on the '''Alternate''' tab, when you click the '''New Login Page''' button that looks like this a '''+''' icon in the action bar then you will create a New Alternate Login Page. Alternate login pages work differently then Primary login pages, so you can’t reuse the code from the Primary login pages. Alternate login pages also require more customization and the users are required to enter a long url to use these <pre> https://myalias.smartsimple.com/s_Loginwelcome/MyFolder/?u=1 </pre> [[File:Alternate login pages.jsp?&langpng|800px|border]] ==Failed Login Log==14 If a user attempts to log in and send that link fails, you can see a list (audit log) of the user names (the email they entered), their IP addresses, and the time. To see the Failed Login Log go to '''Menu''' icon > '''Global Settings''' > '''Security''' tab > '''Password and Activation Policies''' > and click on '''Failed Login Log''' in the left navigation. Also, in the left navigation at this location, you can see locked accounts and other settings related to usersfailed login attempts.

||Each login page must have a single language which you can select from the drop downdropdown. Available languages are:  * Arabic* Danish* Dutch* English - UK* English - US* Finnish* French - Canada* French - France* Georgian* German* Hindi* Italian* Japanese* Korean* Nepali* Portuguese* Russian* Spanish* Swedish* Traditional Chinese* Turkish* Vietnamese 

||By default, when a user goes to your system's URLwithout the Language ID, example https://smart.smartsimple.com they will be directed to the '''English US''' language login page. If you want users to go to a different language login page by default, toggle this setting on for the login page with your desired language. Note: only one login page can be set as the default.|-||'''Page Layout'''||Leave this setting on '''Default''' unless you specifically need to customize the HTML to your login page as it will ensure you will always have the latest and greatest looking login page. If you choose '''Custom''' you will get a '''Template''' tab where you can modify the underlying HTML of the login page. Note if you opt to go custom, you may need to manually update your login pages to take advantage of improvements or changes in functionality.

||Text entered here will display in a browsers This is the title your browser displays on it’s title bar or a page’s page tab. This text is used as to populate the title tag in the HTML of the login page. Typically your web pageorganization's name is entered into this field.

||Text entered here appears above the area where you authenticate. Generally it Typically the word "Login" is not modifiedentered into this field.

||Text entered here appears above the custom message on the right area of the screen. Typically this is replaced with something like "Welcome to ABC SystemXYZ".

||Text entered here appears below the content title. Typically this area is used to describe who you are, what you do and what the system is used for. Example, ABC : "XYZ group provided provides grants to non-profits in small town the USA. Press the register button Register to gain access to the system and apply for funding."

||This is the page the user gets redirected to once they logout. Enter a URL such as ''https://www.smartsimple.com/ here and '' or leave it blank to have the user will be redirected back to your system’s login page by default.|} ===Privacy Policies===This section is only visible if you chose a '''Page Layout''' of '''Default'''. {| class="wikitable"|-||'''Section'''||Choose to show or hide the '''Privacy Policies''' for your system on the login page only.|-||'''Section Title'''||This input only appears if you are using the '''Default''' page layout with privacy policies on. Typically people enter "Learn more about our".|-||'''Button Label'''||This input only appears if you are using the '''Default''' page layout with '''Privacy Policies''' on. Enter the name you want to give the button that will open your systems policies that site upon logoutyou define. Typically people enter "Privacy and Security Policies" for the button text.|} ===Links===This section is typically used for giving people the ability to self-register and gain access to your system. {| class="wikitable"

||Typically people are given the ability The '''None''' option provides no links to a signup page and hides this section. Users cannot self-register and gain access to must be created and activated in your system. You have 3 options in this regardvia a different methodology, such as an autoloader, importing or manual creation by internal staff.

The '''NoneUse Routing page''' – You provide no links option is best if you have multiple signup pages often for different types of users and organizations. The routing page will display a list of signup pages so the user can be directed to a the signup pagethat is right for them. Users cannot self-register and must be created and activated in your system via a different methodology, such as auto loading, importing or manual creation by internal staff.Learn more about [[Signup_Page#Creating_a_routing_page|routing pages]]

The '''Use Routing pageCustom URL''' – When option is best if you only have multiple one signup pages for different types of users, organizations and languages, page. If you choose this option is used. It you will display be able to enter a list of label for the button such as "Register here" as well as the URL to the desired signup pages so page. For the URL use the user can be directed relative path to the your signup page that is right for them. Learn more about [[Signup_Page#Creating_a_routing_page|routing pages]]This way the register button will work on production and backup and any staging servers you may have. Example:

Custom URL – If you only have one signup page in one language you can choose this option and enter the URL to that page here. Remember to use the relative path. Example ''/s_signup.jsp?token=XVtQC1oGYFFaRhNaXxJaQVBRZEl8GnA%3D this way the register button will work on production and backup and any staging servers you may have.''

||'''Link Section Title'''||Text entered here appears above the register buttons. Typically this the text entered is not modified"New to the System?".

||The image uploaded will appear behind the content of your login page (in the background). Upload an image in JPG or PNG format with a resolution of 1920 x 1080 or higherbut try to optimize the image to keep the file size low.Browse a file from your computer using Click the '''folder icon ''' and upload it with the '''upwards arrow Browse'''button which looks like a folder icon. You can delete any uploaded to select a file with from your computer and click the '''trashcan icon. Upload'''button which has an '''Note: upwards arrow '''The background image field will only allow you to browse and upload a the image file once you have clicked the '''Save '''button on a new login page.

||Select how the image will render at different resolutions by choosing where to anchor the image vertically and horizontally. For example if you choose '''Top ''' and '''Left ''' as the position, then the top left area of the background image will always be visible on screen. Anything on the right/bottom of the image may be clipped and not display depending on screen size and aspect ratio of the image and the users user's device.

||Adjust this setting to change the color that will appear above over the background image. Enter the desired hexadecimal value here without the # or use the color picker. Example, enter FFFFFF to have a white background. You must enter either 3 or 6 characters if you are manually entering the hexadecimal value.

||Adjust this setting to change the opacity of the background color. For example '''High ''' will make the color completely opaque and you will not see the background image. '''Low ''' will make the background color completely transparent revealing the background image as uploaded. Something in between '''Low ''' and '''High ''' will create a translucent layer of color over the background image.

||Select the color of the login panel that appears behind the content such as the username and passwordbut in front of the background color and image. 

||Select the level of opacity for the panel that appears behind the login content such as the username and password. '''Low ''' will make the panel transparent, '''High ''' will make the panel opaque.

||Select the color used for all text that appears on the panel. Example '''Content Title, Content Text, Link Section Title, '' etc. Note you must make sure there is enough contrast between the foreground text and the panel or background image. Typically text is black on a white panel or white on a black panel.

  ===Routing Page=Tab==You can also learn about the [[Signup Page#Creating a routing page|The following settings are available on the '''Routing Page]] here.  :: [[File:Routing page.png|800px|border]] The configuration options for your routing page include the following''' tab:

||The text entered here will be used as the label for the button that will appear on open the '''Routing Page'''. This button is displayed on the login page that, when clicked, . Typically you will direct enter the user to this Routing Pagetext "Register".

||The header that text entered here will appear on at the Routing Pagetop of the routing page. Typically you will enter something like "Registration Options".

||The introduction text that entered here will appear on under the Routing Pagetitle but before the list of signup pages. Typically you will enter something like "I am applying as:".

||The text that entered here will appear at under the bottom list of signup pages. Typically you will leave this blank however you may want to add contact information here in case the Routing Pageuser needs assistance.

||This is a dynamic section that allows for enables the creation of multiple administrator to add links on a to their desired signup pages onto the Routing Page. In order to add To create a new link, simply click the '''Add''' button which has a '''+ '''buttonicon. |}

* '''Title: '''The title that will appear for the configured Each routing link.* '''Description: '''The description that appears against has the configured link. * '''URL: '''The URL that the user will be taken to upon clicking on the link. following settings

A routing page will allow for simplified creation and access to multiple pages, guiding the end{| class="wikitable"|-user to the correct page from a single login page. A successful routing page might look like the following: !|Setting:: [[File:RoutingPage.png!|700pxDescription|border]]-===Template===The third tab from the ||'''Login Screen Content Sample Template'''||Clicking this link inserts the HTML, CSS and other code which is the '''Template '''used to render the login page. Here, Typically you can would only use the '''Sample Template '''button a custom template if you wanted to populate the content of the Rich Editor field, and then modify as necessary.  :: [[File:Login page template.png|450px|border]]==ReCAPTCHA Security==Login pages will automatically enable Google reCAPTCHA add some functionality in order to ensure security standards. In order to modify that is not typically used or disable this setting, go to '''Global Settings > Security '''and scroll down you wanted to radically customize the bottom look and structure of the login page. |-:: [[File:Recaptcha.png|800px|border]] =Configuration - Advanced===Error Message==In order to display an '''Error Message Login Page Template'''when an incorrect login username ||You can enter your custom code into this text area or password is provided, simply include modify the following variable into existing content added by clicking the Login Screen HTML: '''@errmsg@''' The system will always save a list of all invalid loginssample template link. See how to access this list [[Login Page#Invalid Login Audit|Although you can enter your own code here]]. ==Popup Blocker Check==The login page can be configured to check whether users have a pop-up blocker enabled; we generally don’t recommend it will enable a suggestion to the user that they disable their pop-up blocker for the SmartSimple system.  The source If you do add your own code of the login page will include a here make sure your code for a pop-up blocker warning message, but by default this will be disabledmeets accessibility guidelines and make sure it is responsive (works on all devices including mobile).|}

[[Image:PBWarning1.png|1200px|border]]=Alternate Login Page Settings=To enable the warning message, simply remove the text '''disabled="disabled" '''Settings from the source code, then click '''Save '''at the bottom.Alternate login pages which are typically only used in special circumstances

||Description of the virtual alias login pagethat is not exposed to end users.

||Lookup that allows the virtual alias login page to be restricted to users in the selected organization.

||User adds Enter a name such as "grants," which will appear in the login URL and then you can direct different users be used to appropriate differentiate logins.

||User enters Enter the desired alias they you want - for example, "gms" - instead of using the instance-defined alias.

||Enable or disable persistent cookies. Rather than having to log into SmartSimple your system each time you open your web browser, a "cookie" can be installed on your computer that will automatically authenticate you, allowing you to bypass the login screen and having to re-enter your credentials. 

||'''Logout Redirect URL'''||Enter URL for users to be redirected to upon successful logout. If left blank users go to the loginpage on logout.

||Select from the available system roles to choose the primary default role that a user will have when they log in from through this alternate login page. This function is used to force the user to see the correct a specific Role based portal.

||Select from the drop-down for the three available desired options: All Users, Activated Users Only, No Access  

||This is the field that will be used on the login page to uniquely identify the specific user when they log in. This is typically set to '''Email Address. '''.

||This is the field on the login page that will be used to capture for the user password when they login.

||This is the error message that will appear on the login page after upon a failed login attempt. 

||Click the '''Insert Sample Template - '''Click this hyperlink to autopopulate auto-populate the text window with a sample template for a login page. Otherwise, you can insert in your own customized content. You can use the '''HTML Editor '''button at the bottom in order to open a pop-up Note that displays the Alternate login page content as it will be shown to works differently than primary login pages so you cannot use the user from the HTMLsame template for both. 

[[Category:System Management]][[Category:Glossary]][[Category:Login PagesInterface]]