Display User Avatar in Post

[aldisney]

Hi–
I’d like to include the user’s avatar in any posts they add – i’d like to add it right above the name, but it’s not appearing in the post or in the code.

Please see screenshots and let me know what i can do to add it.

Thanks!

[aldisney]

Sorry, forgot to attach screenshots. The avatar should appear above the username – I suspect it’d go right above span class=usermeta (or be included in it).

Attachments:

You must be logged in to view attached files.

[Catalin]

Hello,

Please take a look at this link:

http://buddypress.org/support/topic/global-avatar-function/

The post templates can be found in kleo theme folder.

Thank you,
Catalin

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[glikoz]

How can I show user’s photo for every post, (included listing pages, both feature image(if exists) and author’s photo )

[sharmstr]

I’m displaying the authors avatar within the post meta. To do it, I’m doing this.

COPY CODE

/**
* Override Post Author Meta to include avatar
**/
if ( ! function_exists( 'kleo_entry_meta' ) ) :
	/**
	 * Prints HTML with meta information for current post: categories, tags, permalink, author, and date.
	 * Create your own kleo_entry_meta() to override in a child theme.
	 * @since 1.0
	 */
	 
	function kleo_entry_meta($echo=true, $att=array()) {
	
		$meta_list = array();
		
		// Translators: used between list items, there is a space after the comma.
		$categories_list = get_the_category_list( __( ', ', 'kleo_framework' ) );

		// Translators: used between list items, there is a space after the comma.
		$tag_list = get_the_tag_list( '', __( ', ', 'kleo_framework' ) );

		$date = sprintf( '<a href="%1$s" title="%2$s" rel="bookmark"><time class="entry-date" datetime="%3$s">%4$s</time></a>',
			esc_url( get_permalink() ),
			esc_attr( get_the_time() ),
			esc_attr( get_the_date( 'c' ) ),
			esc_html( get_the_date() )
		);

		$author = sprintf( '<a href="%1$s" title="%2$s" rel="author">%3$s</a>',
			esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
			esc_attr( sprintf( __( 'View all posts by %s', 'kleo_framework' ), get_the_author() ) ),
			get_the_author()
		);
		
		if (is_single()):
			$avatar = get_avatar( get_the_author_meta( 'ID' ), 100 );
			$meta_list[] = '<small class="post-author-avatar">'.$avatar.'</small>';
		endif;
		$meta_list[] = '<small class="meta-author">'.$author.'</small>';
		$meta_list[] = '<small>'.$date.'</small>';
		
		$cat_tag = array();
		
		if ( $categories_list ) {
			$cat_tag[] = $categories_list;
		}
		
		if ($tag_list) {
			$cat_tag[] = $tag_list;
		}
		if (!empty($cat_tag)) {
			$meta_list[] = '<small class="meta-category">'.implode(", ",$cat_tag).'</small>';
		}
		
		//comments
		if (!isset($att['comments']) || (isset($att['comments']) && $att['comments'] !== false)) {
		$meta_list[] = '<small class="meta-comment-count"><a href="'. get_permalink().'#comments">'.get_comments_number().' <i class="icon-chat-1 hover-tip" 
			data-original-title="'.sprintf( _n( 'This article has one comment', 'This article has %1$s comments', get_comments_number(), 'kleo_framework' ),number_format_i18n( get_comments_number() ) ).'" 
			data-toggle="tooltip" 
			data-placement="top"></i></a></small>';
		}
		
		if ($echo) {
			echo implode(", ", $meta_list);
		}
		else {
			return implode(", ", $meta_list);
		}
		
	}
endif;

Now, I’m only displaying in on the post page (single), not the listing pages. I haven’t tested it, but you can try removing the if single around this bit of code

COPY CODE

if (is_single()):
	$avatar = get_avatar( get_the_author_meta( 'ID' ), 100 );
	$meta_list[] = '<small class="post-author-avatar">'.$avatar.'</small>';
endif;

To style the avatar, I use this (you’ll probably want it smaller for listing pages)

COPY CODE

/* Format Post Author Avatar */

.post-author-avatar {
	display: block;
}
.post-author-avatar img {
	width: 60px;
	height: 60px;
	overflow: hidden;
	border-radius: 100%;
	border-style: solid;
	border-width: 5px;
	border-color: #f7f7f7;
}

I’ve attached a screenshot so you can see what it supposed to look like.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

Attachments:

You must be logged in to view attached files.

[glikoz]

I’m a little newbie. I think I will edit single.php but what is the position that I will insert exactly?

[Catalin]

You need a bit of PHP knowledge. The first part should go in your child theme in functions.php anywhere you like but not after the ending ? > php tag

The second one goes in your style.css from the child theme

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[glikoz]

via KEO Child them I can manage.. Thanks

So another question:
How can I add Author photo to top-left corner for category pages/home page?

[Abe]

You can edit archive.php and add related code to show author avatar

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[webmaster-sw]

Hello @sharmstr
I have updated the Kleo theme to v2.4, which states this:
– NEW FEATURE: Added avatar and links to author meta with the ability to control display using theme options

How do we access and enable this feature? I can’t find any references to it in any of the update documentation.

[sharmstr]

WP Admin > Theme Options > Blog

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[webmaster-sw]

@sharmstr Can you be more specific?

All I see is the following options:

Display Meta Fields
What fields do you want displayed? Link fields will only work if BuddyPress is active.
Default: D, C, T, C

Date
Categories
Tags
Comments

Display post meta on archive listing
If you want to show meta info in Blog posts listing like Author, Date, Category
Default: On

OnOff
Display post meta in Single post page*
If enabled it will show post info like author, categories

OnOff
Display media on post page
If you want to show image/gallery/video/audio before the post on single page
Default: On

OnOff
Get Featured image from content
If you have not set a Featured image allow the system to show the first image from post content on archive pages
Default: On

OnOff
Default Featured Image Placeholder
If your post does not have a Featured image set then show a default image on archive pages.

Upload
Enable related posts*
Display related posts in single blog entry

OnOff
Enable custom posts related
Display related posts in custom post type single entry

[sharmstr]

Click in Display Meta Fields. Sorry, I thought that was obvious because you pasted ” author meta with the ability to control display using theme options”

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[webmaster-sw]

Oh I get it. The combo box dropdown doesn’t appear unless you click in the field, and the description doesn’t mention anything about Author avatars or links.

I’m probably not the only person that couldn’t figure that out. Some expanded documentation is highly recommended for less savy users like me.

[webmaster-sw]

This reply has been set as private.

[sharmstr]

No

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

Attachments:

You must be logged in to view attached files.

[sharmstr]

The above was the actual post. Here’s the archive page

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

Attachments:

You must be logged in to view attached files.

[webmaster-sw]

@sharmstr It’s working great for me on the archive page and on single posts page, as you posted above.

How about Posts page? Also known as Blog. The page that you set your Blog to in Settings > Reading > Static Page > Posts

[sharmstr]

Look at my second image. That’s IS my blog page.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[webmaster-sw]

@sharmstr Oh right, I see with the Continue Reading.
Okay I will look for a css conflict on my end.

Thanks!

[Milton Ayala]

Works Perfect! Thank you @sharmstr

[Milton Ayala]

@sharmstr I just noticed that the avatar is not clickable.

[sharmstr]

Yes it is. It links to the buddypress profile if buddypress is enabled or to the author archive if buddypress isnt enabled. If its not working on your site, go through the basic troubleshooting steps.

May I also suggest setting up a test site that doesnt have any customization or extra plugins. Then you can tell if its a kleo bug or if you’ve installed/changed something that’s broken default functionality. That’s how I do it.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Milton Ayala]

Thanks @sharmstr

Awesome idea! Funny I did not think of this, that’s how I started this whole site. less pressure doing it that way. testing now.

[webmaster-sw]

@sharmstr Upgraded to KLEO v2.4.3 and author avatars are gonzo.

Any info on what happened?

VC is at 4.3.5, WordPress is 4.2.

Post meta included “Author Avatar”

Here’s my html for blog page, posts page, and archives:

COPY CODE

<div class="article-meta">
<span class="post-meta">
<small class="meta-links">
<a href="http://www.temp.com/members/kyle/">
<i class="icon-user-1 hover-tip" data-placement="top" data-toggle="tooltip" data-original-title="View profile"></i>
</a>
<a href="http://www.temp.com/members/me/messages/compose/?r=kyle&_wpnonce=61c36a22fd">
<i class="icon-mail hover-tip" data-placement="top" data-toggle="tooltip" data-original-title="Contact Kyle"></i>
</a>
<a href="http://www.temp.com/author/kyle-the-photographer/">
<i class="icon-docs hover-tip" data-placement="top" data-toggle="tooltip" data-original-title="View all posts by Kyle"></i>
</a>
</small>
,
<small>
<a class="post-time" rel="bookmark" href="http://www.temp.com/2015/04/post-32915/">
<time class="entry-date" datetime="2015-04-24T15:56:01+00:00">April 24, 2015</time>
<time class="modify-date hide hidden updated" datetime="2015-04-24T15:56:01+00:00">April 24, 2015</time>
</a>
</small>
,
<small class="meta-category">
<a rel="category tag" href="http://www.temp.com/category/gallery/">Gallery</a>
</small>
,
<small class="meta-comment-count">
<a href="http://www.temp.com/2015/04/post-32915/#comments">
</small>
</span>
<span class="edit-link">
</div>

[Milton Ayala]

@webmaster-sw

I had the same issue, I fixed it by going to theme options / Display Meta Fields / and added Profile Link to the meta and boom it worked.

[malcolmboyd]

Hi,

I’d like to do the same as this but not on posts but woocommerce product pages (I have different users creating product, each with their own BP profile) : how would the code need to be changed?

Thanks for your help.

[Abe]

Hi, really sorry for the late reply. For that you need to edit woocommerce templates found in kleo/woocommerce folder. The template for the single product page is wp-content/themes/kleo/woocommerce/content-single-product.php

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[igalencar]

I need to put the avatar on post details
i only got admin there but i need also the avatar on it.
Im usin kleo 4.0.7

Attachments:

You must be logged in to view attached files.

[Abe]

Please see Theme options – Blog – Meta settings

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[Author]

Posts