nCubed Free Members Only - Documentation
The nCubed.com Free Members Only allows you to quickly add a password protected section to your website. By following the directions here, you should be able to have your Members Only section up and running in no time at all.
- Requirements
- Files Included
- n3_membersFree.asp
- Unprotected Content
- Protected Content
- Content Always Seen
- onload Page Function
- CSS Styles (refer to CSS Properties)
- n3_class.asp
- n3_config.asp
- n3_membersFree.asp
- CSS Properties
Requirements
You must be hosted on a server that supports ASP/VBScript. Any standard Windows NT or Windows 2000 (or higher) server will meet the requirement.
This is not a Dreamweaver MX extension, nor does it require Dreamweaver MX to use.
Files Included
The nCubed Members Only script contains three files:
n3_membersFree.asp
This is the 'parent' file containing the log in form as well as the actual password protected content based on the user authentication. This file also contains two include files, n3_class.asp and n3_config.asp (explained below).
You can change the name of this page to anything you want, as well as formatting the page to your liking - just be sure the page has an .asp extension, i.e., my_page.asp.
| Property | Description |
|---|---|
| NOTE: All ASP Tags and Variables described here are used in the sample files as examples of their use. | |
| Unprotected Content | To add content the user sees prior to logging in, enter the information between the Else/End If ASP tags: <% Else %> |
| Protected Content | To add the password protected content to the page, enter any and all information between the If/Else ASP tags: <% If blnAccess = True Then % > If you want to include a greeting to your user, add the ASP variable
'strRealName' within the protected area: If you want to include a log out link add this code anywhere within
the protected area: |
| Content Always Seen | To add content the user sees regardless of being logged in or not, simply place the content:
|
| onload Page Function | There is a pre-built onload function contained in the document's head. This function currently places the user's cursor automatically into the log in form's text field. If you have additional onload calls, add them to the pre-built onload function. If you do not know how to add additional onload functions to the pre-built function or you want to move them to the body tag, then let us know and we'll show you what to do. Please Note: If you have onload functions in your body tag along with the pre-built onload function, then the onload functions in the body tag most likely will not work. |
| CSS | There is a linked CSS file and an Embedded CSS block included in this page. Please refer to the CSS Properties for specific information. |
n3_class.asp
This is an include file found near the top of n3_membersFree.asp containing the Class to authenticate the user. You really shouldn't mess with this file and you definitely shouldn't delete it.
If you do not use the pre-built Members Only page, then you need to include this file in the page you create.
n3_config.asp
This is an include file found near the top of n3_membersFree.asp containing the configuration for the password protected page.
This is the file you add your allowed users to the password protected section. Open the file and review the notes - everything should be fairly self explanatory.
If you do not use the pre-built Members Only page, then you need to include this file in the page you create.
CSS Properties
Included in the n3_membersFree.asp page are two types of CSS. The first is a linked style sheet, the second is an Embedded style block.
Linked Style Sheet
The linked CSS file (n3_basic.css) contains basic page formatting. Feel free to modify it to your liking, delete it all together or replace it with your own page formatting CSS.
Embedded Style Block
We recommend that you use the Embedded CSS Style Block which allows you complete control over the log in <table>. Whether you leave the CSS Embedded in the page or cut/paste it into an external style sheet is up to you.
| CSS | Description |
|---|---|
| #n3-LogInTable { border-collapse: collapse; border: none; background-color: transparent; width: 300px; margin-left: auto; margin-right: auto; } |
This style essentially formats the log in table with no cell-spacing, no border, 300px wide and centered on the page. The ID is assigned to the actual <table> tag of the log in table, i.e., <table id="n3-LogInTable"> . |
| #n3-LogInTable td { border-collapse: collapse; vertical-align: baseline; padding: 5px 5px 0px 0px; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; } |
This style formats the <td>'s in the log in table by removing cell-spacing, placing all the content near the bottom of the <td> cell, adds some padding to the cell and gives the text some basic style. |
| #n3-LogInTable caption { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; text-align: left; color: black; } |
This style provides basic text formatting to the <caption> for the log in table. |
| #n3-LogInTable col.colOne { text-align: right; width: 100px; } |
This style sets the first table column at a width of 100px and aligns the text to the right. |
| .n3-textField { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #232323; background-color: #FCFCFC; padding: 3px 4px 3px 3px; border-width: 1px; border-style: solid; border-top-color: #AEAEAE; border-right-color: #E1E1E1; border-bottom-color: #E1E1E1; border-left-color: #AEAEAE; } |
This style provides formatting for the text fields by giving them some basic text formatting and borders for the text fields. |
| .n3-error { color: #FF0000; font-weight: bold; } |
This style is applied to any error messages generated by the script. |