 |
|
With a little bit of HTML know-how, adding our login box to your website is easy! Simply
follow the steps below, and your members will be able to access your directory from anywhere on your site
in no time.
Please Note: This tutorial is intended for users who want to add a login box to their own websites. The code for this login
box will not work with the MemberClicks Web Module or with pages built using our Templates. For those cases, simply use the built-in login links provided
with the Web Module.
First, you need to edit the HTML file to which you want to add the login section. Copy and paste the following section
of code between the <head> and </head> tags near the top of the file.
These are the Javascript functions needed for the login process.
You will need to make one change to the code above. In the line that reads:
...http://web.memberclicks.com/mc/common/forgotpassword.do?hidOrgID=xxx
Simply replace the xxx with your organization's acronym or abbreviation.
Now, locate the area
inside the body of your HTML file where you want to place the Username and Password fields. Copy and
paste the following segments of code into the area of your page where you want the login box to appear.
You will need to make two small changes to the code above. In the line that reads:
<input type="hidden" name="hidOrgID" value="xxx">
Simply replace the xxx with your organization's acronym or abbreviation.
In the lines where the image sources are defined, i.e.:
...images/gui/blue/login.gif"...
You can replace the word blue with any of the 90 colors in our color palette. This will change the color
of the "LOGIN" and "FORGOT YOUR PASSWORD" buttons. Pasting all of the code above as-is will yield a login section that looks like this:
You can also use any of the 11 different button styles that we offer. To access one of these styles, first look
at this line again:
...images/gui/blue/login.gif"...
Replace the text "gui/blue" with one of the following options:
 |
|
 |
|
| | | | |
| Text | Image | | Text | Image |
| styles/1 |  | | styles/7 |  |
| styles/2 |  | | styles/8 |  |
| styles/3 |  | | styles/9 |  |
| styles/4 |  | | styles/10 |  |
| styles/5 |  | | styles/11 |  |
| styles/6 |  | | | |
|
|
 |
|
 |
For example, if you changed the code for the image sources for both the "Login" and "Forgot Your Password" buttons,
so that it looked like this:
...images/styles/7/login.gif"...
Your login section would look something like this:
These are the only parts of the code that you will
need to change, but feel free to customize the appearance of the login fields as much as you want. By
adding the right HTML tags or applying stylesheets, you can make your MemberClicks login blend in seamlessly
with the rest of your site!
|
|
|
