Members List Tutorial by leialee31

[leialee31]

Okay, so here goes. Looking at Jason's info in that post above, though, I think I went about this in a pretty convoluted way. Let me know what you think.

Steps:

1. Plugins to use
2. Adding the s2member roles to wp-users.php and the admin dashboard
3. Displaying Level 1 Members on the list page
4. Displaying individual members' profiles
5. Styling

1. Plugins to use
Front-end Editor (http://wordpress.org/extend/plugins/front-end-editor/) - To place an "edit my information" form in a restricted page. Users must sign in to edit their information, but never have to see the dashboard.
User-Photo (http://wordpress.org/extend/plugins/user-photo/) - Adding this plugin places an upload field in each user's profile form, and automatically creates a thumbnail version of each photo.
WP-Users (http://wordpress.org/extend/plugins/wordpress-users/)- I used the Wordpress-Users plugin because I wasn't having any success with members-list. I'm not the brightest bulb when it comes to code and for whatever reason I found its php a little easier to parse mentally. I also wanted the list to be clickable to individual profiles, and I couldn't make members-list do that. Fortunately, WP-Users was built to be compatible with the User Photo plugin and already has some stuff in there to access user images.
s2member - DUH.

2. Adding the s2member roles to wp-users.php and Wordpress-Users' section on the admin dashboard
My users have two levels. When they first register, they are "Pending Approval", which is level 0. After paying or being manually upgraded, they are "Participants", or level 1. There is another level I used for special spaces but never mind that right now.

The first thing to do was add s2member's custom roles in wp-users.php (the Wordpress Users main file). There are three places this needs to be added.

At the top of wp-users.php in function wpu_get_roles() you'll need to edit the following sections:

Code: Select all

function wpu_get_roles()

{

   global $wpdb;


   $administrator = get_option('wpu_roles_admin');

   $subscriber = get_option('wpu_roles_subscriber');

   $author = get_option('wpu_roles_author');

   $editor = get_option('wpu_roles_editor');

   $contributor = get_option('wpu_roles_contributor');


Add whatever level you want to be able to limit the list to. For me it was:

Code: Select all

$s2member_level1= get_option('wpu_roles_s2member_level1');

Same thing in the next section - you can see where I added:

Code: Select all

$rolelist = array('administrator'=>$administrator, 'subscriber'=>$subscriber, 'author'=>$author, 'editor'=>$editor, 'contributor'=>$contributor, 's2member_level1'=>$s2member_level1);

And again:

Code: Select all

   if (empty($roles))
              $roles = array('administrator', 'subscriber', 'author', 'editor', 'contributor', 's2member_level1');


You'll also want to add it to the dashboard so that you can easily change the roles you want to display. Go to function wpu_admin() a little after line 900 in wp-users, and add:

Code: Select all

   
$roles_s2member_level1 = $_POST['wpu_roles_s2member_level1'];
update_option('wpu_roles_s2member_level1', $roles_s2member_level1);

Then find the wpu_admin_form near the end of the code, and add this to the table already built there to create a checkbox for your new roles:

Code: Select all

  <tr>
<td colspan="3"><input name="wpu_roles_s2member_level1" type="checkbox" value="yes" <?php checked('yes', get_option('wpu_roles_s2member_level1')); ?> />&nbsp; <?php _e("Participants" ); ?>
</td>
</tr>

You should now have your custom roles added to Wordpress Users, and be able to select which roles to include in your list by checking the appropriate box in wp-users dashboard section. Like this:

Picture 5.png (22.86 KiB) Viewed 27534 times

You can select multiple roles as long as you add them first in all those places. My list shows only my paid members (who are automatically added to the list when they pay), and updates their profiles whenever they do since it's just pulling their data.

[leialee31]

3. Displaying Level 1 Members on the list page
Originally, I had a block of code that broke the s2member custom field data into an array before displaying it. However, after some testing, it doesn't seem like it's necessary, which is hilarious because I definitely spent way too much time getting that to work before noticing that it didn't seem to matter if it happened or not. Whoops.

So, the public list of all Level 1 members (Participants) is located here: http://www.northsideopenstudios.org/view-members

The first change I made was having the users order by ID rather than their name, and display by a custom field I'd created called "Listing Title" rather than by their "nicename". Users actual names are only for internal use, since most of them are running their listings as galleries and collectives.

Around line 100 look for:

Code: Select all

   $query = "SELECT $wpdb->users.ID, $wpdb->users.user_nicename FROM $wpdb->users INNER JOIN $wpdb->usermeta ON $wpdb->users.ID = $wpdb->usermeta.user_id WHERE $meta_values ORDER BY $wpdb->users.user_nicename LIMIT $offset, $limit";


And change it to:

Code: Select all

   $query = "SELECT $wpdb->users.ID, $wpdb->users.user_nicename FROM $wpdb->users INNER JOIN $wpdb->usermeta ON $wpdb->users.ID = $wpdb->usermeta.user_id WHERE $meta_values ORDER BY $wpdb->users.ID LIMIT $offset, $limit";


This just orders the listings by user ID, which I did because nicenames are irrelevant to what I'm doing.

Then, you're ready to add whatever s2member custom field data you need to function get_user_listing($curauth). For example, I changed the following:

Code: Select all

$html .= "<div class=\"wpu-id\"><a href=\"" . get_permalink($post->ID) . $concat . "uid=$curauth->ID\" title=\"$curauth->display_name\">$curauth->display_name</a></div>\n";

To this:

Code: Select all

$html .= "<div class=\"wpu-id\"><a href=\"" . get_permalink($post->ID) . $concat . "uid=$curauth->ID\" title=\"$curauth->display_name\">" . $curauth->wp_s2member_custom_fields["listing_title"] . "</a></div>\n";

The key to getting the fields is always writing them as $curauth->wp_s2member_custom_fields["field ID of the custom field you want to display"]. $curauth is wp-users' variable for fetching the user ID and relevant details.

You can add as many of these fields as you like. I kept it simple for now.

4. Displaying individual members' profiles
When clicked, each listing title directs you to an individual profile for each Member. In the same way as above, edit function display_user() to pull the s2member fields into each person's page.

I wanted each display field to be conditional (so that no one would have empty fields). To achieve this, I added a bunch of iterations of the following, with the field changed to be whatever I was trying to pull. This one, for example, is making sure that there's a website listed in the person's profile (in my s2member custom fields, it was "website_url", then, if there is, it pulls that url and makes it a hyperlink. Thanks to s2member's ability to require that URLs be typed in full, this flows perfectly:

Code: Select all

if ($curauth->wp_s2member_custom_fields["website_url"] && $curauth->wp_s2member_custom_fields["website_url"] != "http://")
{
      $html .= "<p><strong>WEBSITE:</strong> <a href=\" ".$curauth->wp_s2member_custom_fields["website_url"]." \" rel=\"nofollow\">".$curauth->wp_s2member_custom_fields["website_url"]."</a></p>\n";
   }

That's just an example, as you can see I also commented out several features (I did not want anyone to make comments on my listings, or show posts by each author, which are features included in wp-users).

5. Styling
So that's pretty much it, except that the default list and profile layouts are hideous. I edited wpu-styles.css, the stylesheet included with wp-users (NOT your general wordpress stylesheet) and changed the attributes of all the different divs. For example, to get a grid view like I have, I changed .wpu-user to float left and crop the user's image to create a fun closeup abstract view of their User Photo.


So, yeah, that's how I created my paid membership directory. I hope this is helpful to someone out there like me who doesn't know much php.

Ideally, I would REALLY love to build in some search functions - at first to just be able to search generally, and later (when I learn more) to make the list sortable by people looking for artists in particular neighborhoods, or who work in particular mediums. So far, all these details are there thanks to s2member custom fields, but I'm not quite ready to go about building a search thing, so they're invisible right now. If anyone knows how to do that, I'd be very grateful to hear how I might integrate that functionality!

I'll give this tutorial a look over later to make sure I haven't missed anything. Thanks to Christian and Jason for a great plugin with great support.

[Jason Caldwell]

Thank you VERY much for submitting this detailed tutorial.

I'm glad to see that you got things working the way you need them to.
For search functionality, I think you'll find this WordPress class helpful, it is documented here:
http://codex.wordpress.org/Function_Ref ... User_Query

[leialee31]

Cool. No problem and thanks for the lead on the search thing! I'll post again if I manage to get that working.

[carblanco]

Woow, many thanks, works perfectly.

Do you know how I can add some filters just to list the users based on mobile_phone or on birth_date, for instance?
Or simply adding a filter by letter (click on "A" to go to users beginning with a "A" letter)?

Thanks again.

[carblanco]

Just a quick question.

You order the listings by user ID using:

Code: Select all

$query = "SELECT $wpdb->users.ID, $wpdb->users.user_nicename FROM $wpdb->users INNER JOIN $wpdb->usermeta ON $wpdb->users.ID = $wpdb->usermeta.user_id WHERE $meta_values ORDER BY $wpdb->users.ID LIMIT $offset, $limit";

How can I order the list by s2member_custom_field["company_name"]?
Which would be the right $query?

I think I'm writing something wrong in the code.

Thanks.

[carblanco]

Can anybody help me with this newie question?
Right now I hava a list ordered as:

Code: Select all

$query = "
SELECT $wpdb->users.ID, $wpdb->users.user_nicename
FROM $wpdb->users
INNER JOIN $wpdb->usermeta ON $wpdb->users.ID = $wpdb->usermeta.user_id
WHERE $meta_values
ORDER BY $wpdb->users.ID LIMIT $offset, $limit";

And what I need is ordering by a s2member custom field called "company name". How?

Thanks.

[leialee31]

Hey Carlos, I got your message. I actually wanted to do that too but couldn't get it to work. Sorry, I hope you find a solution!

[carblanco]

Thanks leialee31, I'll keep you posted.
Anyway Cristián is trying to help me here, maybe you want to join the discussion

[dskallman]

Is it possible to add a search/sort option to this setup? Would like to add that option since it's a large membership base?

Thanks!

[carblanco]

Is it possible to add a search/sort option to this setup? Would like to add that option since it's a large membership base?

Thanks!

It would be great, I'm also looking for it but it's no very easy.
I'm waiting for the s2member developers to develop some sort options.

[antseo]

leialee31, is your suggestion to list out a members list work in the free version or pro version only?

[Cristián Lávaque]

That seems to work with the free version.

[surveysayz]

Great tutorial, thank you!

How would the code be modified to display the selected values (multiple) from an s2Member custom checkbox field?

Code: Select all

if ($curauth->wp_s2member_custom_fields["favs"]) {
         $html .= "<p><strong>Favorite Plugins:</strong> ".$curauth->wp_s2member_custom_fields["favs"].",\n";
   }

Thanks again!