Raising the WP eMember Public Directory Bar to the Next Level

I am a diehard fan of the plugins developed by Tips and Tricks HQ. As an author, I especially like their PDF stamper plugin. I use it to protect the contents of my book, “Principles for Maturing Your System Development Life Cycle: The Ultimate Guide to the SDLC,” which can be purchased at http://www.ultimatesdlc.com. So when my colleagues in the North Carolina Executive Roundtable (NCER) asked me to build membership features into their website, I readily selected WP eMember.

Needless to say, the NCER membership was very happy with the WP eMember plugin, with one exception. They didn’t care for the native public directory and asked that the phone number field be added to the display. This is where I started to run into problems.

My first instinct is to contact the plugin author to modify the plugin. After all, how hard could it be to modify the display table to add an additional field? The author’s reply:

There is no option to show the phone field in the user directory table. The user directory table is embedded on a page so it can't have too many columns due to the page width restriction. After several testing we found that 3 to 4 columns yields the best result.

Coupled with another response in the same thread, it’s clear that he won’t edit his plugin to add the field. I was disappointed. I had made other suggestions to this author before which he implemented and have always found their support team to be very responsive. This time, however, he was adamant. He wasn’t going to modify the code. His

adsasd

decision left me with two choices. I could either modify his code myself or write a new, custom directory function that accesses his tables and displays the data therein. Since modifying delivered code is never a good option, I opted for writing my own directory function that mimics that found in the WP eMember plugin, except it looks nicer and displays a whole lot faster

Before we dive into the code, let me warn you that this is as simple as it comes. I do not build bells and whistles into this code. It simply extracts what it needs from the database and displays it. There is a second .php file that populates a popup when you click on a members name. The popup uses ThickBox. ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. ThickBox is delivered natively in WordPress.

<?php
   // connect to the server
   $host="<your host name>";
   $user="<your user id>";
   $pass="<your password>";
   $mysql_link = mysql_connect($host,$user,$pass,true);

   // select database
   mysql_select_db("<your database>", $mysql_link);

   // get active user count to calculate pagination -- pagination code to be added later when we there are enough records to justify it
   $query = "SELECT COUNT(*) as count FROM `wp_wp_eMember_members_tbl` where account_state = 'active' ORDER BY member_id";
	 $mysql_results = mysql_query($query, $mysql_link);
	 $row = mysql_fetch_array($mysql_results);
   $emember_user_count = $row["count"];

   // get active member data
   $query = "SELECT last_name, first_name, email, phone, member_id FROM `wp_wp_eMember_members_tbl` where account_state = 'active' order by last_name;";
   $mysql_results = mysql_query($query, $mysql_link);

   //close data connection
   mysql_close($mysql_link);
?>

<table style='margin: 6px; padding: 6px; width: 640px;'>
<tbody>
        <tr>
           <td style='color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; text-align: center; background-color: #680014'>
               <b>Name</b></td>
           <td style='color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; text-align: center; background-color: #680014'>
               <b>Email</b></td>
           <td style='color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; text-align: center; background-color: #680014'>
               <b>Phone</b></td>
        </tr>

<?php
   //get user data
   while($row = mysql_fetch_row($mysql_results))
   {
   	print("<tr>n");

   	// build link to personajax.php
   	print("<td>n");
   	$link_code = "<a href=";
   	$link_code .= "'http://www.your-url.org/displaycode.php?id=";
   	$link_code .= $row[4];
    $link_code .= "&height=300&width=400' class='thickbox' title='";
   	$link_code .= $row[1];
   	$link_code .= " ";
   	$link_code .= $row[0];
   	$link_code .= "'>";
   	$link_code .= $row[0];
   	$link_code .= ", ";
   	$link_code .= $row[1];
   	$link_code .= "</a>";

   	print($link_code);

   	print("</td>n");
   	print("<td>n");
   	print("<a href='mailto:");
   	print($row[2]);
   	print("'>");
   	print($row[2]);
   	print("</a></td>n");
   	print("<td>n");
   	print($row[3]);
   	print("</td>n");
   	print("</tr>n");
  }

   print("</tbody>n");
	 print("</table>n");

?>

The only thing you really have to do to this code is add the server and database access details. The code builds a hyperlink that calls personajax.php. The output of that file displays in a ThickBox.

<?php

	 $id = $_GET['id'];
	 if($id == ''){
	 		return;
	 	}
   // connect to the server
   $host="<your host name>";
   $user="<your user id>";
   $pass="<your password>";
   $mysql_link = mysql_connect($host,$user,$pass,true);

   // select database
   mysql_select_db("<your database>", $mysql_link);

   // get active member data
   $query = "SELECT a.member_id, a.first_name, a.last_name, b.alias as member_role, a.email, a.phone, a.address_street, a.address_city, a.address_state, a.address_zipcode ";
   $query .= "FROM `wp_wp_eMember_members_tbl` a LEFT JOIN `wp_wp_eMember_membership_tbl` b ON a.membership_level = b.id where a.account_state='active' and a.member_id=";
   $query .= $id;
   $query .= ";";
   $mysql_results = mysql_query($query, $mysql_link);

   $affectedrows = mysql_affected_rows($mysql_link);

   if ($affectedrows == -1)
   {
   	return;
   	}

   while($row = mysql_fetch_row($mysql_results))
   {

?>

<table style="width: 100%;" class="mceItemTable" align="center" data-mce-style="width: 100%;">
<tbody>
<tr>
<td vAlign="middle" align="center"><img alt="<?php print($row[1]); print(" align="middle" src="http://www.ncer1.org/wp-content/uploads/emember/<?php print($row[0]); ?>.jpeg" width="150" height="150" data-mce-src="http://www.ncer1.org/wp-content/uploads/emember/<?php print($row[0]); ?>.jpeg">
<td align="center"></td>
<td align="center"></td>
<td align="center"></td>
<td align="center"></td>
<td align="center"><strong>Membership Role:  <?php print($row[3]); ?></strong></td>