Skip to:
Content
Pages
Categories
Search
Top
Bottom

user role box under profile picture


  • Masoud
    Participant

    @masoud1111

    7 years, 3 months ago

    hi,
    i am using latest version of wordpress and buddypress.
    in site, i want the users to know who is admin of website.
    so i decided to create a small box under profile picture, which should say the current user role.
    (just like the one, here on buddypress)(you can see my user role as Member)(Participant)(Moderator)…

    1 – i created a css property :
    .buddypress-under-avatar-img-txt {height:auto;width:90px;background:green;border:1px;color:black;padding-bottom:3px;text-align:center;}

    2 – copy/paste ” cover-image-header.php ” file
    From:
    wp-content/plugins/buddypress/bp-templates/bp-legacy/buddypress/members/single
    To:
    wp-content/themes/my-theme/buddypress/members/single

    3 – and added my code on line 27:

    <?php bp_displayed_user_avatar( 'type=full' ); ?>
   <div id="buddypress-under-avatar-img-txt">
     <?php if (current_user_can('administrator')) ?>
       <br /><p <?php printf ('Admin of site'); ?> </p>
    </div>

    but the box is not showing.
    can anyone please help me on this? which part of my code is wrong? how can i correct it?

    any help would be appreciated.

Viewing 2 replies - 1 through 2 (of 2 total)

  • danbp
    Moderator

    @danbp

    7 years, 3 months ago

    Hi,

    you have many errors in your code.

    – in the css you declare a class (a dot ) while you use an ID (#) in the html
    – in the code, you omit to close a p tag, and you need also a user_id and a way to get the displayed user (WordPress) role. Both are missing.

    Here, the whole thing corrected.
    – we don’t need a extra div, as we only add a p tag in an existing div.
    – the code to get the role holds in 2 small lines.

    The CSS (goes into child theme’s style.css)

    #item-header-avatar p {
margin: auto;
border:1px solid green;
background: yellow;
width: 110px;
text-transform: capitalize;
}

    The html and php for the template (starts aroud line 24 of cover-image-header.php)

    <div id="item-header-avatar">
	<a href="<?php bp_displayed_user_link(); ?>">

	<?php bp_displayed_user_avatar( 'type=full' ); ?>
	</a>

	<?php
	$user = new WP_User( bp_displayed_user_id() );
	echo '<p>'. $user->roles[0] .'</p>';
	?>			
	
</div><!-- #item-header-avatar -->

    Do it simple ! 😉


    Masoud
    Participant

    @masoud1111

    7 years, 3 months ago

    hi @danbp
    your explanations was complete. i understood completely.
    and thank you very much for the help.
    the code worked well.
    actually i changed it a little to fit my requirements .
    i added some other elements to the css 

    #item-header-avatar p {
width: 90px;
height: 15px;
position : absolute;
top : 90px;
right : 0px;
text-align: center;
vertical-align: middle;
line-height: 15px; 
margin-top: 3px;
border:1px solid green;
background: green;
color: black;
}

    again, thank you for help.

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.

Topic Info

Topic Tags

Skip to toolbar