In this part of the User Follow System tutorial series, we will be writing our function to display follow / unfollow links. These are the links that a logged-in user will click in order to follow or unfollow another user.

The links used to follow or unfollow a user, illustrated here, are displayed via a function we’re going to write calledΒ pwuf_follow_unfollow_links(). This function is pretty straight forward and will simply retrieve the output of two sets of links:

  1. A follow user link and an unfollow user link (hidden until user is followed)
  2. A unfollow user link and a follow user link (hidden until user is unfollowed)

This function will be used anywhere that we want to output the user follow links, such as at the bottom of a post, the sidebar on an author archive page, etc.

The first thing we need to do is open includes/display-functions.php and then paste the following function into it:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<?php
/**
 * Retrieves the follow / unfollow links
 *
 * @access      public
 * @since       1.0
 * @param 	    int $user_id - the ID of the user to display follow / unfollow links for
 * @return      string
 */
 
function pwuf_get_follow_unfollow_links( $follow_id = null ) {
 
	global $user_ID;
 
	if( empty( $follow_id ) )
		return;
 
	if( ! is_user_logged_in() )
		return;
 
	if ( $follow_id == $user_ID )
		return;
 
	ob_start(); ?>
	<div class="follow-links">
		<?php if ( pwuf_is_following( $user_ID, $follow_id ) ) { ?>
			<a href="#" class="unfollow followed" data-user-id="<?php echo $user_ID; ?>" data-follow-id="<?php echo $follow_id; ?>">unfollow</a>
			<a href="#" class="follow" style="display:none;" data-user-id="<?php echo $user_ID; ?>" data-follow-id="<?php echo $follow_id; ?>">follow</a>
		<?php } else { ?>
			<a href="#" class="follow" data-user-id="<?php echo $user_ID; ?>" data-follow-id="<?php echo $follow_id; ?>">follow</a>
			<a href="#" class="followed unfollow" style="display:none;" data-user-id="<?php echo $user_ID; ?>" data-follow-id="<?php echo $follow_id; ?>">unfollow</a>
		<?php } ?>
		<img src="<?php echo PWUF_FOLLOW_URL; ?>/images/loading.gif" class="pwuf-ajax" style="display:none;"/>
	</div>
	<?php
	return ob_get_clean();
}

The follow links can be outputted like this:

1
2
3
<div id="follow-user">
<?php echo pwuf_get_follow_unfollow_links( $user_id_to_follow ); ?>
</div>

A sensible place to add the links would be the bottom of the post content, so let’s open single.php from Twenty Twelve (it’s a good example theme) and place our code there:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<?php
/**
 * The Template for displaying all single posts.
 *
 * @package WordPress
 * @subpackage Twenty_Twelve
 * @since Twenty Twelve 1.0
 */
 
get_header(); ?>
 
	<div id="primary" class="site-content">
		<div id="content" role="main">
 
			<?php while ( have_posts() ) : the_post(); ?>
 
				<?php get_template_part( 'content', get_post_format() ); ?>
 
				<nav class="nav-single">
					<h3 class="assistive-text"><?php _e( 'Post navigation', 'twentytwelve' ); ?></h3>
					<span class="nav-previous"><?php previous_post_link( '%link', '<span class="meta-nav">' . _x( '&larr;', 'Previous post link', 'twentytwelve' ) . '</span> %title' ); ?></span>
					<span class="nav-next"><?php next_post_link( '%link', '%title <span class="meta-nav">' . _x( '&rarr;', 'Next post link', 'twentytwelve' ) . '</span>' ); ?></span>
				</nav><!-- .nav-single -->
 
				<div id="follow-user">
					<?php echo pwuf_get_follow_unfollow_links( get_the_author_meta( 'ID' ) ); ?>
				</div>
 
				<?php comments_template( '', true ); ?>
 
			<?php endwhile; // end of the loop. ?>
 
		</div><!-- #content -->
	</div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

And there you go! You now have follow/unfollow links at the bottom of all posts. They aren’t functional yet, but we get one step closer to making them functional in the next part when we write the javascript.

  1. mikc03

    Hi,

    There seems to be some missing parts in this tutorial/page. Code is not displayed.

    Also, are you going to be releasing the next part of this tutorial soon?
    Looking forward to seeing how you will hook up the JS to the follow/unfollow links and add AJAX calls.

    Thank you! πŸ™‚

    • Pippin

      Ah, sorry about that. I’ve just fixed it.

      I’m hoping to have the next part written later this week πŸ™‚

  2. Alan

    Hey, Pippin, this guide can be applied to any PHP script or CMS right ?
    Or is it tied to wordpress ?

    Can i use this guide to develop a user follow system for any other cms ?

    • Pippin

      The exact code written in this tutorial series applies only to WordPress, but you could easily take the general architecture of the plugin and carry it over to other PHP platforms.

  3. rick joseph

    Hi Pippin,

    I wanted to ask me, if it is possible to buy the plugin?

    Or at what point.

    Thank you. greetings Riccarda

    • Pippin

      No, the plugin will not be sold, but it will be available as a complete download once finished.

    • rick joseph

      Hi Pippin,

      You can download it now, or when it will be finished? I’m excited.

      Cheers Riccarda

    • Pippin

      Once it’s finished.

    • rick joseph

      Hi Pippin, super I like to wait. All the best.

      Cheers Riccarda

  4. Robert Austin

    Hi

    i thought the point of a plugin was that it was theme independent. Why are we hard-coding the links in the 2012 theme?

    Regards

    Robert Austin

    • Pippin

      The links were hard coded simply to show an example of how they can be used.

    • Robert Austin

      Out of interest, where would you normally put them?

      Regards

      Robert Austin

    • Pippin

      It depends on the implementation you are doing. If you can, adding them from the plugin is best, since it makes the theme and plugin independent of one another, but sometimes that isn’t really possible.

      In the case of CG Cookie.com (the site I originally built this functionality for), I put the function calls directly into the theme files but wrapped them in a if( function_exists(…) ) check to ensure that nothing erred if the plugin was deactivated.

  5. Robert Austin

    Ok, thanks for the explanation

  6. victor espejo

    Hi Pippin
    I followed the tutorial and Im really new at this, so I downloaded your plugin
    but when I put the code in the theme there are not links showing.
    What could it be?

    Thanks

    • Pippin

      Are you viewing the page while logged in?

    • victor espejo

      Hi thanks for your Reply Pippin
      Tried everything now, I deleted and activated the downloaded version
      twenty twelve theme
      no more plugins activated

      When logged in as user I see the link Follow on the post
      but does nothing when clicked
      And on the follow links short code the same.

      The only thing I don’t know if matters is that im testing on a local server installation

      Tried this on twenty twelve theme because on my theme the short codes broke it, I only saw the header and from there down it was blank

      Thanks again for your support

      Victor

    • Pippin

      Are there any JS errors on the page?

  7. victor espejo

    Also i found out that the file display-functions.php on the download has more code that the explained on this part of the tutorial, so would that matter? which one should be working?

    Thanks a lot

    • Pippin

      Use the version in the downloaded plugin.

  8. James Kemp

    Good work, Pippin – just what I needed!

    • Pippin

      Glad to hear it!

  9. Burak Birer

    At this point yes i am one of the direct plugin installers. I installed and started reading. πŸ™‚ At this page i added

    And it didn’t work for me. Infact it also killed the single.php page.

    Than i realized that i learned $post->post_author thing, So i modified the show links snippet like this, (instead of $user_id_to_follow)


    post_author ); ?>

    Well now there is a button showing up πŸ™‚ But still killing the page if i put it inside the loop (the original snippet) So i put my modified on outside the loop. Reading the next page now, hope i get how to make it work properly πŸ™‚

  10. Burak Birer

    I am showing the author’s followers count like this


    post_author);
    echo count($followers_count); //counting the array
    ?>

    It is working but am i doing right? Thanks,

    • Pippin

      That will work just fine.

  11. Guga Alves

    As the download plugin is not working I manually created all files on my end but function pwuf_get_follow_unfollow_links is not working for me.

    I’m logged as user id 1 and want follow user ID 2 so on my author.php file I added function pwuf_get_follow_unfollow_links(get_the_author_meta(‘ID’)) but the unfollow button appears, not the follow button. What should be wrong?