Login Block

The Login block is a very important component of your PostNuke site. You must identify users to manage the types and levels of access and capabilities they will have on your site. If it is not clear that a login provides additional benefits, many users might not log in at all, even if they have accounts. Plan for these issues by customizing your PostNuke site to apply to your user base.

You can change login messages and field labels to cater to the wants and needs of your site visitors. For this chapter's examples, you make changes as though you are building a political campaign site. You assume visitors are from the general public, and the site provides general information for the candidate John Smith.

Customizing Labels

The default PostNuke Login block contains a very simple interface (see Figure 24.1). First change the block title to something more appropriate for our example site. Go to your site's Administration Menu and click the Blocks link. Find the Login block entry near the base of the table and edit the block. In the title field, change the "Login" text to "Join the Campaign" and submit your changes.

Figure 24.1. A simple login to PostNuke.

Having a block named "Join the Campaign" helps to create interest in the form by inviting visitors to participate. Now change the form labels, Username and Password, for added clarity. Start your text editor and open the language file at this location:

 /includes/language/blocks/eng/login.php 

There are three variable definitions in the file:

 define('_ASREGISTERED','&nbsp;<a href="user.php?op=lostpassscreen&amp;module=NS- LostPassword">Log in Problems?</a><br />&nbsp;New User? <a href="user.php">Sign Up!</a>'); define('_BLOCKNICKNAME','Username'); define('_BLOCKPASSWORD','Password'); 

Now change the value of _BLOCKNICKNAME to "Login Name." Change the _BLOCKPASSWORD value to "Your Password." This also adds a personal touch to the form.

The _ASREGISTERED definition is a bit more complex and incorporates link code for both new user sign-up and login help. Change the definition to match the following line:

 define('_ASREGISTERED','Don\'t have an account? Support John Smith and <a href="user.php">create one now!</a><br /><br /><a href="user.php?op=lostpassscreen&amp; module=NS-LostPassword">Get help with your account.</a>'); 

The placements of the two links have been exchanged so that the sign-up prompt is before the help link. This helps a site that expects to have more new visitors than return visitors. The two links have been separated with a little space to keep their separate messages clear, and a customized message is included to personalize the site for John Smith supporters.

The "Remember me" text can also be altered, but its variable definition is found in this location:

 /language/eng/global.php 

The global definition file contains variables that are shared by different modules on the site. If you change a variable there, it might change references on other pages of which you are not aware. To change the Login reference without the possibility other pages will be affected, create a replacement variable that's specific to only the Login block. In the Login's text variable listing:

 /includes/language/blocks/eng/login.php 

add this line:

 define('_LOGINREMEMBERME','Stay logged in'); 

Now open the login script file itself located here:

 /includes/blocks/login.php 

Change the REMEMBERME reference at about line 72 to LOGINREMEMBERME so the block accesses your custom variable and not the global one. Save the files and refresh your login screen to see your updated block (shown in Figure 24.2).

Figure 24.2. Customized PostNuke login labels.

Adding Text

Even with the personal touches outlined previously, your site's visitors might need a little additional prompting to log in to their accounts. One solution is to add a short message to the login block that promotes the access to additional features a login can provide.

It is possible to extend the existing text definitions and add in complete paragraphs to their values, but those definitions were created for specific purposes, and if you want to add new text, it is best to create a new variable definition to support your changes. Open the login.php file defined next in your editor.

 /includes/language/blocks/eng/login.php 

Create a new definition line called LOGINMESSAGE and give it the value text: "Get involved in the campaign. Sign in now to speak your views in the forums and get access to special site features." The complete line code should appear as this:

 define('_LOGINMESSAGE','Get involved in the campaign. Sign in now to speak your views in the forums and get access to special site features.'); 

Now, add the variable to the block code. Open the code file in your editor:

 /includes/blocks/login.php 

Examine the code starting at about line 62. To add the message before the Username and Password fields, place the variable call before the start of the form and table or just inside the table opening. Visually, this is a better location to separate the new message from the other text below the form, but it's possible to place the variable anywhere on the form.

Change these two lines:

 $boxstuff  = '<form action="user.php" method="post">' . "\n"; $boxstuff .= '<table border="0" width="100%" cellspacing="0" cellpadding="1"><tr>' . "\n"; 

to the following:

 $boxstuff = '<div >'._LOGINMESSAGE.'</div>'."\n"; // Additional login message $boxstuff .= '<form action="user.php" method="post">'."\n"; $boxstuff .= '<table border="0" width="100%" cellspacing="0" cellpadding="1"><tr>'."\n"; 

Placing the <div> before the start of the <form> tag has the added benefit of using the default margin space placed above form tags to separate your new message from the start of the login form. Your edited block with the new message is shown in Figure 24.3.

Figure 24.3. Promoting your Login features.

Adding Style

For most websites, success is determined by traffic. The easiest way to build visitor traffic is to maintain existing users so that the influx of new visitors will always grow the overall user base. Site logins create ties to users, promote return traffic, and provide the means to develop a real community of users.

However, you might find the Login block is not obvious enough in a site with so many other blocks and block-like content. You can, of course, be certain the Login block is positioned at the very top of your site, but if that fails, the next step is to make the Login block visually unique.

You can redefine the look of the Login block in three ways. First, if you are using a Xanthia theme, you need only develop a specialized template and apply it to only one block. A similar effect is accomplished through the second option: Use third-party theme extensions, such as AutoThemes (www.autothemes.com), BlockHome (moe.cape.com/~nate/postnuke/), or Nuclei (www.tangant.com), and define custom styles for the Login block.

The third option is to change the Login block code directly. This hack might or might not be simpler or faster than either of the previous options, especially if you are already using specialized themes, but the following works with any PostNuke site, regardless of whether you are using any of the previous systems.

Launch your editor and open the Login block file:

 /includes/blocks/login.php 

On line 60, an if statement begins with this:

 if (!pnUserLoggedIn()) {

and ends around line 90, depending on your changes to the file. The code within the statement builds the block content and uses the themesideblock function to add the default block definition around it. Replace all of those lines and you can make the block appear with any colors or layout you choose.

Note

It is important that you are familiar with the way your site's theme is designed, so that when you make a custom block layout, it naturally fits into the site just as a dynamically generated block based on your theme does.

Here is an example of one way to approach this change. Comment out all of these lines:

 if (!pnUserLoggedIn()) {     $boxstuff = '<div >'._LOGINMESSAGE.'</div>'."\n"; // Additional login message     $boxstuff .= '<form action="user.php" method="post">'."\n";     $boxstuff .= '<table border="0" width="100%" cellspacing="0" cellpadding="1"><tr>'."\n";     $boxstuff .= '<td><span >&nbsp;<label for="uname">'. _BLOCKNICKNAME.'</label></span><br />' . "\n";     $boxstuff .= '<input type="text" name="uname"  size="14" maxlength="25" /></td>' . "\n";         $boxstuff .= '</tr><tr>';     $boxstuff .= '<td><span >&nbsp;<label for="pass">'._BLOCKPASSWORD.'</label></span><br />' . "\n";     $boxstuff .= '<input type="password" name="pass"  size="14" maxlength="20" /></td>' . "\n";        $boxstuff .= '</tr>' . "\n";     if (pnConfigGetVar('seclevel') != 'High') {         $boxstuff .= '<tr>' . "\n";             $boxstuff .= '<td><input type="checkbox" value="1" name="rememberme" id= "rememberme" />' . "\n";         $boxstuff .= '<span >&nbsp;<label for="rememberme">'. _LOGINREMEMBERME.'</label></span></td>' . "\n";             $boxstuff .= '</tr>' . "\n";     }     $boxstuff .= '<tr><td>' . "\n";     $boxstuff .= '<input type="hidden" name="module" value="NS-User" />' . "\n";     $boxstuff .= '<input type="hidden" name="op" value="login" />' . "\n";     $boxstuff .= '<input type="hidden" name="url" value="' .pnVarPrepForDisplay($path) .'" />' . "\n";     $boxstuff .= '<input type="submit" value="'._LOGIN.'" /></td></tr><tr><td>' . "\n";     $boxstuff .= '<br /><span >'._ASREGISTERED.'</span></td></tr></table></form>' . "\n";     if (empty($row['title'])) {         $row['title'] = _LOGIN;     }     $row['content'] = $boxstuff;     return themesideblock($row); } 

Add this code to display the customized Login block:

 if (!pnUserLoggedIn()) {     $newlogblock = '<div style="width:150px; padding:2px; border:1px solid #000000; background-color:#D0FFD0;">'."\n";     $newlogblock .= '<div style="padding:1px;"><span  style=" text- transform:uppercase;">Join the Campaign</span></div>'."\n";     $newlogblock .= '<div style="padding:2px;" >'."\n";     $newlogblock .= '<div >'._LOGINMESSAGE.'</div>'."\n"; // Additional login message     $newlogblock .= '<form action="user.php" method="post" ><table border="0" width="100%" cellspacing="0" cellpadding="1">'."\n";     $newlogblock .= '<tr><td><span >&nbsp;<label for="uname">'. _BLOCKNICKNAME.'</label></span><br /><input type="text" name="uname"  size="14" maxlength="25" /></td></tr>'."\n";     $newlogblock .= '<tr><td><span >&nbsp;<label for="pass">'. _BLOCKPASSWORD.'</label></span><br /><input type="password" name="pass"  size="14" maxlength="20" /></td></tr>'."\n";     if (pnConfigGetVar('seclevel') != 'High') {         $newlogblock .= '<tr><td><input type="checkbox" value="1" name="rememberme"  /><span >&nbsp;<label for="rememberme">'. _LOGINREMEMBERME.'</label></span></td></tr>'."\n";     }     $newlogblock .= '<tr><td><input type="hidden" name="module" value="NS-User" /><input type="hidden" name="op" value="login" /><input type="hidden" name="url" value="' .pnVarPrepForDisplay($path).'" /><input type="submit" value="'._LOGIN.'" /></td></tr>'."\n";     $newlogblock .= '<tr><td><br /><span >'._ASREGISTERED.'</span></td></tr>'."\n";     $newlogblock .= '</table></form>'."\n";     $newlogblock .= '</div></div><br />'."\n"; } return $newlogblock; 

The new block, shown in Figure 24.4, displays as a simple bordered area with a light green background. The block area has been separated from the theme, but still accesses the standard styles and language text variables. Using the previous code, you can now change the block to look like anything.

Figure 24.4. Highlighting your site's login.

Customizing Page Labels

The PostNuke Login screen uses a form that's nearly identical to the block form described in the previous sections. The login screen is generally seen less than the side block for most sites, but it's still an important part of any site. If you make changes to customize the block's labels, you should make the same changes to the login page for consistency.

Open the NS-User user.php file:

 /modules/NS-User/user.php 

Scroll down to line 330 where you will see this function:

 function user_user_loginscreen() {     include 'header.php';     OpenTable();     echo "<form action=\"user.php\" method=\"post\"><div>\n"        . "<span class=\"pn-title\">" . _USERLOGIN . "</span><br /><br />\n"        . "<table border=\"0\">\n"        . "<tr>\n"        . "<td><span class=\"pn-normal\"><label for=\"uname_mod_user\">" . _NICKNAME . "</label>: </span></td>\n"        . "<td><input type=\"text\" name=\"uname\" id=\"uname_mod_user\" size=\"26\" maxlength=\"25\" /></td>"        . "</tr>\n"        . "<tr>\n"        . "<td><span class=\"pn-normal\"><label for=\"pass_mod_user\">" . _PASSWORD . "</label>: </span></td>\n"        . "<td><input type=\"password\" name=\"pass\" id=\"pass_mod_user\" size=\"21\" maxlength=\"20\" /></td>\n"        . "</tr>\n";     if (pnConfigGetVar('seclevel') != 'High') {         echo "<tr>\n"             ."<td><span class=\"pn-normal\"><label for=\"rememberme_mod_user\">" . _REMEMBERME   . "</label>: </span></td>\n"            ."<td><input type=\"checkbox\" name=\"rememberme\" id=\"rememberme_mod_user\" /></td>\n"            ."</tr>\n";     }     echo "</table>\n"        . "<input type=\"hidden\" name=\"url\" value=\"" . pnServerGetVar("HTTP_REFERER") . "\" />\n";     user_submit('NS-User', 'login', _LOGIN);     echo "</div></form>\n";     CloseTable();     include 'footer.php'; } 

You can reformat the Hypertext Markup Language (HTML) in the preceding function to display the form in any fashion you desire. The key variables are USERLOGIN, NICKNAME, PASSWORD, and REMEMBERME. They are defined in this file:

 /language/eng/global.php 

You can edit those variables directly, which can affect other pages, or create a new set of variables for this particular form, as you did with the Login block in the previous sections. You might also want to add an additional message to this form, again using the previously outlined steps.

Customizing the Help Page

Users who have forgotten their password can easily click the Help link in the Login block to have it reset using an automated email script. As you can see in Figure 24.5, the default Help page wording and layout might not apply well to all sites. You can edit the page to work with whatever styling you need.

Figure 24.5. PostNuke's account password help.

The language variables are defined in both of these files:

 /modules/NS-LostPassword/lang/eng/global.php /language/eng/global.php 

and the code that calls the variables and creates the form itself is found here:

 /modules/NS-LostPassword/user.php 

First review the text variables relevant to this page. The form calls six variables, but two are in the global.php file PostNuke uses universally. You can create two new variables to isolate this code from the rest of the site just as you did for the block form. Edit the NS-LostPassword global.php and add these lines:

 define('_LOGHELPNICKNAME','Login Name'); define('_LOGHELPEMAIL','Email Address'); 

Now review the four existing variables and change them to suit your site. For the John Smith campaign example, use these changes:

 define('_PASSWORDLOST','ElectJohnSmith.com Account Password Help'); define('_NOPROBLEM','The form below can be used to reset your password. Enter your Login Name and Email Address for your account. If you leave the Confirmation Code field blank, a code will be generated and emailed to your address to confirm your identity.<br /><br />Once you have a code, return to this form and complete all of the fields. Submit the completed form, and your account password will be reset with a randomly generated one. The new password will be emailed to you.<br /><br />'); define('_CONFIRMATIONCODE','Confirmation code'); define('_SENDPASSWORD','Submit Form'); 

Now edit the NS-LostPassword user.php file. First update the variables on lines 47 and 51 to match the new definitions you added to the local global.php file.

The centered text style is being carried down from the parent column styles, and due to the sometimes inconsistent rendering of nested styles with <div> and <span> tags, the only sure way to fix the effect is by encasing all the code beneath the title inside a table. The table needs only one cell; it resets the text-align styles to the local cell with a default left justification.

After all of these changes are completed, your display code should appear fairly close to the following:

 OpenTable(); echo "<span class=\"pn-title\">"._PASSWORDLOST."</span><br /><br />\n"     ."<table style=\"width:100%;\"><tr><td style=\"text-align:left;\"><span class=\ "pn-normal\">"._NOPROBLEM."</span><br />\n"     ."<form action=\"user.php\" method=\"post\"><div>\n"     ."<table border=\"0\" cellspacing=\"0\" cellpadding=\"5\">\n"     ."<tr>\n"     ."<td><span class=\"pn-normal\"><label for=\"uname_lost_password\">". _LOGHELPNICKNAME."</label>: </span></td>\n"     ."<td><input type=\"text\" name=\"uname\" id=\"uname_lost_password\" size=\"26\" maxlength=\"25\" /></td>\n"     ."</tr>\n"     ."<tr>\n"     ."<td><span class=\"pn-normal\"><label for=\"email_lost_password\">"._LOGHELPEMAIL."</label>: </span></td>\n"     ."<td><input type=\"text\" name=\"email\" id=\"email_lost_password\" size=\"60\" maxlength=\"60\" /></td>\n"     ."</tr>\n"     ."<tr><td><span class=\"pn-normal\"><label for=\"code_lost_password\">". _CONFIRMATIONCODE."</label>: </span></td>\n"     ."<td><input type=\"text\" name=\"code\" id=\"code_lost_password\" size=\"5\" maxlength=\"6\" /></td>\n"     ."</tr>\n"     ."</table>\n"     ."<input type=\"hidden\" name=\"op\" value=\"mailpasswd\" />\n"     ."<input type=\"hidden\" name=\"module\" value=\"NS-LostPassword\" />\n"     ."<input type=\"submit\" value=\""._SENDPASSWORD."\" />\n"     ."</div></form></td></tr></table>\n"; CloseTable(); 

An example of the completed changes is also shown in Figure 24.6. Compare the changes with Figure 24.5 to see how all the edits come together.

Figure 24.6. Personalized help for your site's users.

Customizing the Help Email

When users submit the automated password help form, they receive an email message. This message can also be customized to your website quite easily. The first email content is generated by line 109 of the NS-LostPassword's user.php file:

 $message = ""._USERACCOUNT." $uname "._AT." $sitename "._HASTHISEMAIL." "._AWEBUSERFROM." $host_name "._HASREQUESTED."\n\n"._YOURNEWPASSWORD." $newpass\n\n "._YOUCANCHANGE . pnGetBaseURL() . "user.php\n\n"._IFYOUDIDNOTASK.""; 

The second email that also includes the reset confirmation code is generated by line 134:

 $message = ""._USERACCOUNT." '$uname' "._AT." $sitename "._HASTHISEMAIL." "._AWEBUSERFROM." $host_name "._CODEREQUESTED."\n\n"._YOURCODEIS." $areyou \n\n"._WITHTHISCODE."". pnGetBaseURL() . "user.php\n"._IFYOUDIDNOTASK2.""; 

You can see from the preceding lines which variables in the global.php language file are used to produce the message. Open the variable file into your editor:

 /modules/NS-LostPassword/lang/eng/global.php 

One way you can rewrite the email is by changing the values of the existing variables, by creating an entirely new set of text variables, or any combination of these. The site variables, $uname, $sitename, $newpass, and so on, can also be reordered or selectively displayed. For this example, add these lines to the global.php definitions:

 define('_MSGINTRO','This message has been generated to reset your account password. Use the confirmation code below to complete the lost password form. If you did not request this email, please disregard this message.\n'); define('_MSGINTRO2','Your account password has been reset. The new password is listed below. If you did not intend to reset your password, simply login using the link below and manually change your password to something new.\n'); define('_MSGLOGIN','\nLogin Name: '); define('_MSGCODE','\nConfirmation Code: '); define('_MSGPASS','\nNew Password: '); define('_MSGREQUEST','\nRequested By: '); define('_MSGLINK','\n\nTo change your password, go to '); define('_MSGTHANKS','\n\nThank you for being a part of '); define('_MSGIFNOT','\n\nIf you did not request this email, please disregard this message.'); 

Comment out line 109 in the user.php file and add the following line to replace it:

 $message = _MSGINTRO._MSGLOGIN."$uname"._MSGCODE."$areyou"._MSGREQUEST."$host_name"._MSGLINK. pnGetBaseURL()."user.php"._MSGTHANKS."$sitename"; 

Do the same to line 134 using this code:

 $message = _MSGINTRO2._MSGLOGIN."$uname"._MSGPASS."$newpass"._MSGREQUEST."$host_name"._MSGLINK. pnGetBaseURL()."user.php"._MSGTHANKS."$sitename"; 

Log in to your site using a test user account and reset your password to test your changes. The previous example creates a simple paragraph with the key information listed below the prose text, but you can, of course, change the display to be more complex, including generating HTML email.