Advanced Custom Logon Page (1.0 only)


Advanced Custom Logon Page (1.0 only)

If you are using a custom logon page, there are several advanced features you can use to control and handle various scenarios.  Four51 provides tools to help with:

  1. Log off handling. 
  2. Logon and session error handling. 
  3. Directing a user to a specific product or category upon logon. 
  4. Forgotten passwords.


Http vs. Https

For security purposes, Four51 requires that forms and links passing username and password information to the application be submitted via https.  When a link is submitted over http but requires https, the user will be directed to the Four51 logon page, or the value set in the 'return' parameter.
 

About Log Off Handling

The 'return' Parameter:

<html>
   <body>
      <table align="center" border="0" cellspacing="5" cellpadding="2">
         <form method="post" action="https://www.four51.com/ui/logon.aspx">
            <tr>
                <td><img width="350" height="200" src="http://www.logoopenstock.com/media/users/379/778/raw/65edc5b9fd755017e29be413f20bb444-logo-logo-design-download-free-psd-file.jpg">
                </td>
            </tr>
            <tr>
               <td><font face="Tahoma, Arial, Helvetica" color="#000000" size="3"><b>Username</b></font></td>
            </tr>
            <tr>
               <td><input type=text name="UserName" value="" Size="25"></td>
            </tr>
            <tr>
               <td>&nbsp;</td>
            </tr>
            <tr>
               <td><font face="Tahoma, Arial, Helvetica" color="#000000" size="3"><b>Password</b></font></td>
            </tr>
            <tr>
               <td><input type=password name="Password" Size="25" Value =""></td>
            </tr>
            <tr>
               <td><input type="hidden" name="return" value="http://www.yahoo.com"></td>
            </tr>
            <tr>
               <td>&nbsp;</td>
            </tr>
            <tr>
               <td><INPUT Type = image Name=logon Alt="Log On" Src="http://www.freeiconspng.com/uploads/login-button-png-13.png" Border=0 Width="150" Height="25"></td>
            </tr>
         </form>
      </table>
   </body>
</html>
 

The 'close window' Parameter:

<tr>
   <td><input type="hidden" name="closewindow" value="1"></td>
</tr>
 

About Logon and Session Error Handling 

Using Four51's message parameter, you can display a logon error messages on your custom logon page. For example, if a user has not entered a valid username and password, they should see a message "Username and password not found."  Similarly, if a session is interrupted due to time out, or another reason, they should see a "Session Failure" message.  Four51 posts logon error messages and session failure error messages and passes them in the message parameter.  For example: https://www.four51.com/ui/logon.aspx?message=User+name+and+password+not+found.

In order to configure this for your own custom logon page, you must do two things:

  1. Set the return parameter on your custom logon page to a web page that you have created to handle error messages.  This may be your custom logon page or a page you have created specifically to handle error messages. If you do not set a value for the return parameter, users will be directed to the Four51 logon page. 
  2. Write code to receive and process the message parameter value and display the message on your page. There are many different ways to do this and implementation methods vary based on the technology your website utilizes.  See your web administrator to discuss how you might implement this on your website.


About Directing Users to a Product or Category

Using the productid and catid parameters, you can direct a user to a specific product or category upon logon.  To do this, you must first set the interop id for the product and category.  This is important because these two parameters only accept Four51's interop id values.  The application does not accept category name or product id as parameter values. 

To set the interop id for a category, complete the following:

  1. Logon to your administrative interface.
  2. Click the "Buyers" tab in the top navigation tab.
  3. Select a company from the list.
  4. Click the "Categories" tab.
  5. Select your category from the list.
  6. Enter a value in the interop id field.  This value may be any combination of letters and numbers.  It also must be unique. No two category interop ids associated with your administrative environment may be the same.
  7. Click the "Save" button.

To set the interop id for a product, complete the following:

  1. Logon to your administrative interface.
  2. Click the "Products" tab in the top navigation tab and locate your product. 
  3. Enter a value in the Interop ID field.  This value may be any combination of letters and numbers.  It also must be unique. No two products associated with your administrative environment may be the same.
  4. Click the "Save" button.

After you have set an interop id for your category and product, use these in your custom logon page.  To direct a user to a category, you only need to send a value for catid.  Your logon form should post a url like the following:

https://www.four51.com/ui/logon.aspx?username=[[username]]&password=[[password]]&catid=[[categoryinteropid]]

To direct a user to a product, you need to send a value for catid and productid. Your logon form should post a url like the following:

https://www.four51.com/ui/logon.aspx?username=[[username]]&password=[[password]]&catid=[[categoryinteropid]]&productid=[[productid]]

The following rows added to your logon form would send the user to the columbian coffee (cbcol) product in the coffee category (coffeecat).

<tr>
     <td><input type="hidden" name="catid" value="coffeecat"></td>
</tr>
<tr>
      <td><input type="hidden" name="productid" value="cbcol"></td>
</tr>

About Forgotten Passwords

Four51 provides a password reset feature that allows users to submit their email address and then reset their password from an email.  To limit the users that appear in the Forgotten Password email to just the users in your specific buyer company, you would add a parameter, "cid", with the unique company identifier. The identifier can be found on the Logon Page Configuration page in the left navigation under a buyer company. Example: cid=38a3ec59-8a3a-48d3-8094-2ad69330940d.  An example logon form with a password reminder is found below:

 <html>
  <body>
    <table align="center" border="0" cellspacing="5" cellpadding="2">
      <form method="post" action="https://www.four51.com/ui/logon.aspx">
        <tr>
          <td><img width="350" height="200" src="http://www.logoopenstock.com/media/users/379/778/raw/65edc5b9fd755017e29be413f20bb444-logo-logo-design-download-free-psd-file.jpg"></td>
        </tr>
        <tr>
          <td><font face="Tahoma, Arial, Helvetica" color="#000000" size="3"><b>Username</b></font></td>
        </tr>
        <tr>
          <td><input type=text name="UserName" value="" Size="25"></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td><font face="Tahoma, Arial, Helvetica" color="#000000" size="3"><b>Password</b></font></td>
        </tr>
        <tr>
          <td><input type=password name="Password" Size="25" Value =""></td>
        </tr>
        <tr>
          <td><INPUT Type = image Name=logon Alt="Log On" Src="http://www.freeiconspng.com/uploads/login-button-png-13.png" Border=0 Width="150" Height="25"></td>
        </tr>
      </form>
      <form method=post action=https://www.four51.com/ui/logon.aspx>
        <tr>
          <td><img width="3" height="100" src="http://www.four51.com/Images/space.gif"></td>
        </tr>
        <tr>
          <td><font face="Tahoma, Arial, Helvetica" color="#8B0000" size="2"><b>Forgot your password?</b></font></td>
        <tr>
        <tr>
          <td><font face="Tahoma, Arial, Helvetica" color="#8B0000" size="2"><b>Email Address</b></font></td>
        </tr>
        <tr>
          <td><input style="width:300px;" name=emailpassword /></td>
        </tr>
        <tr>
          <td><img width="3" height="20" src="http://www.four51.com/Images/space.gif"></td>
        </tr>
        <tr>
          <td style="text-align: right"><INPUT border=0 alt="Reset" class="Button" type=image width ="75" height = "25" src="http://www.pngmart.com/files/3/Submit-Button-PNG-File.png" name="Reset Password"></td>
        </tr>
        <tr>
          <td><input type="hidden" name="return" value="http://localhost/logon.html"></td>
        </tr>
        <tr>
          <td><input type="hidden" name="cid" value="38a3ec59-8a3a-48d3-8094-2ad69330940d"></td>
        </tr>
      </form>
    </table>
  </body>
</html>

Reference Material: None

Related Articles:
Logon Page Configuration (1.0 only)
Custom Logon Page (1.0 only)

Labels: Custom Logon, Advanced logon, http, https, log off, session error, interop id