BuddyPress Follow
[resolved] Using an image instead of text on follow buttons (8 posts)

  1. Henry
    Posted 2 years ago #

    The plugin works flawlessly for me so this is more of a enhancement or how to question than a bug report.

    I am currently using a language file to customise the labels outputted by the plugin. I'm also using custom slugs as described in the wiki:


    Is it possible to go one step further and use an image instead of text on the follow buttons? I tried using HTML in poedit which semi-worked but the HTML tags show up in the title text when hovering over the Follow button/image.


  2. r-a-y
    Plugin Author

    Posted 2 years ago #

    You can filter the entire contents of the button using the 'bp_follow_get_add_follow_button' filter.

    It's not ideal right now because you'd need to find out what the link text is and replace it with nothing manually.

    You can also do this with CSS. Search for "CSS image replacement" on Google for some tutorials.

    Also not ideal, but if you can't wait for the new code, you can use those techniques.

  3. Henry
    Posted 2 years ago #

    Thanks for the ideas, think i'll give the filter approach a shot!

  4. Henry
    Posted 2 years ago #

    Hi r-a-y

    I've tried to use the filter approach but just can't seem to get it to work. My PHP is failing me :{

    Any pointers would be really helpful?

  5. Henry
    Posted 2 years ago #

    OK managed to filter the button properly now.

    function custom_follow_button( $button ) {
    global $bp, $members_template;
    		$defaults = array(
    			'leader_id'   => bp_displayed_user_id(),
    			'follower_id' => bp_loggedin_user_id()
    		$r = wp_parse_args( $args, $defaults );
    		extract( $r );
    		if ( !$leader_id || !$follower_id )
    			return false;
    		// if we're checking during a members loop, then follow status is already queried via bp_follow_inject_member_follow_status()
    		if ( !empty( $members_template->member ) && $follower_id == bp_loggedin_user_id() && $follower_id == bp_displayed_user_id() ) {
    			$is_following = $members_template->member->is_following;
    		// else we manually query the follow status
    		else {
    			$is_following = bp_follow_is_following( array( 'leader_id' => $leader_id, 'follower_id' => $follower_id ) );
    		// if the logged-in user is the leader, use already-queried variables
    		if ( bp_loggedin_user_id() && $leader_id == bp_loggedin_user_id() ) {
    			$leader_domain   = bp_loggedin_user_domain();
    			$leader_fullname = bp_get_loggedin_user_fullname();
    		// else we do a lookup for the user domain and display name of the leader
    		else {
    			$leader_domain   = bp_core_get_user_domain( $leader_id );
    			$leader_fullname = bp_core_get_user_displayname( $leader_id );
    		// setup some variables
    		if ( $is_following ) {
    			$id        = 'following';
    			$action    = 'stop';
    			$class     = 'unfollow';
    			$link_text = $link_title = sprintf( __( 'Stop Following %s', 'bp-follow' ), apply_filters( 'bp_follow_leader_name', bp_get_user_firstname( $leader_fullname ), $leader_id ) );
    		else {
    			$id        = 'not-following';
    			$action    = 'start';
    			$class     = 'follow';
    			$link_text = $link_title = sprintf( __( 'Follow %s', 'bp-follow' ), apply_filters( 'bp_follow_leader_name', bp_get_user_firstname( $leader_fullname ), $leader_id ) );
    		// setup the button arguments
    		$button = array(
    			'id'                => $id,
    			'component'         => 'follow',
    			'must_be_logged_in' => true,
    			'block_self'        => empty( $members_template->member ) ? true : false,
    			'wrapper_class'     => 'follow-button ' . $id,
    			'wrapper_id'        => 'follow-button-' . $leader_id,
    			'link_href'         => wp_nonce_url( $leader_domain . $bp->follow->followers->slug . '/' . $action .'/', $action . '_following' ),
    			'link_text'         => $link_text,
    			'link_title'        => '',
    			'link_id'           => $class . '-' . $leader_id,
    			'link_class'        => $class
       return $button;
    add_filter( 'bp_follow_get_add_follow_button', 'custom_follow_button' );

    Link title was the only part I changed as poedit accepts HTML markup so was able to swap out the text for an image using the localisation file.

    The approach works for me but if there is an easier way....? (i'm sure my filter can be stripped down too - probably have unnecessary stuff in there)

    Ref: bp-follow-templatetags.php line 117

  6. Henry
    Posted 2 years ago #

    Humm, spoke slightly too soon. Although it is working on the profile page, the button isn't displayed at all in the members loop.

  7. r-a-y
    Plugin Author

    Posted 2 years ago #

    Hi Henry,

    Try this:

  8. Henry
    Posted 2 years ago #

    Thanks r-a-y!

    Of course my badly written function had no way of accepting the leader ID and follower ID variables so that explains why it didn't work.

    I actually re-wrote my function to work but your approach is far cleaner so will use that.


Topic Closed

This topic has been closed to new replies.

About this Plugin

  • BuddyPress Follow
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic