MyBB Community Forums
[HowTo] Fix empty default user avatar in custom theme user menu - Printable Version

+- MyBB Community Forums (https://community.mybb.com)
+-- Forum: Extensions (https://community.mybb.com/forum-201.html)
+--- Forum: Themes (https://community.mybb.com/forum-103.html)
+---- Forum: Theme Development (https://community.mybb.com/forum-105.html)
+---- Thread: [HowTo] Fix empty default user avatar in custom theme user menu (/thread-166660.html)



[HowTo] Fix empty default user avatar in custom theme user menu - SvePu - 2015-02-05

Hi dear theme designers

some of you use the avatar image source code {$mybb->user['avatar']} in a user header menu, but there is no image when user has the default MyBB avatar.

Here are two ways how you can fix it.

1.) Download my "MyBB Default Avatar Fix" plugin from here and include it into your theme package.

or

2.) Include the small function into your own theme plugin:

// defaultavatarfix function by SvePu (http://community.mybb.com/user-91011.html) //
function defaultavatarfix()
{
	global $mybb;

	if(!$mybb->user['avatar'] && !empty($mybb->settings['useravatar']))
	{
		$mybb->user['avatar'] = $mybb->settings['useravatar'];
	}
}
$plugins->add_hook("global_intermediate", "defaultavatarfix");


Thank you all for your amazing themes and keep on styling!


RE: [HowTo] Fix empty default user avatar in custom theme user menu - Leefish - 2015-02-05

You can actually do this with javascript . Give your avatar a class of header_avatar img and add js code at the bottom of footer.

Example code
<li class="header_avatar"><img src="{$mybb->user['avatar']}" height="30px" width="30px" align="top" class="miniav"/></li>

<script>
$(document).ready(function() {
 //create a default avatar for those without one.
 if($('.header_avatar img', this).attr('src') == ''){
 $('.header_avatar img').attr('src', '/images/default_avatar.gif');
 }
});
</script>

You might say aha - but what if user has no js enabled. Um, if they have no js enabled on a 1.8 mybb board then no avatar in the header is a minor issue compared to the rest.


RE: [HowTo] Fix empty default user avatar in custom theme user menu - SvePu - 2015-02-05

You're right Leefish, that's also a way. But why adding another javascript function while mybb 1.8 has a default avatar option in profile settings?

The only problem is that the default avatar from profile settings isn't loading in custom theme header. With the small php function above it will.

BTW: It's only a suggestion by me, not a must have. Wink


RE: [HowTo] Fix empty default user avatar in custom theme user menu - Devilshakerz - 2015-02-05

(2015-02-05, 04:43 PM)SvePu Wrote: Include the small function into your own theme plugin

(2015-02-05, 05:11 PM)Leefish Wrote: You can actually do this with javascript

You can actually do this with pure CSS:

<div class="avatar-box">
    <img src="{$mybb->user['avatar']}" alt="avatar" />
</div>
.avatar-box { height: 30px; width: 30px; background: url('../../../images/default_avatar.png') no-repeat; background-size: 100% auto; }
.avatar-box img { height: 30px; width: 30px; }
.avatar-box img[src=""] { display: none; }
If the user has set his own avatar, the default one gets covered behind - if not, the image is hidden to prevent the browser from rendering a broken image indicator.


RE: [HowTo] Fix empty default user avatar in custom theme user menu - Leefish - 2015-02-05

@Devilshaker, Yea, I use something similar to that trick for the profile backgrounds.

Anyhoo, now our themers have 3 ways to give us the avatar in the member header . That is good right?


RE: [HowTo] Fix empty default user avatar in custom theme user menu - SvePu - 2015-02-05

Sorry, but I guess my way has the best usability.

Users can change the path to default avatar image in profile settings as they like and it'll take effect. They haven't to change css rules or javascript entries for the new image path.


RE: [HowTo] Fix empty default user avatar in custom theme user menu - zukro - 2015-10-04

Hi SvePU, could you explain to me how to Include that small function into theme?


RE: [HowTo] Fix empty default user avatar in custom theme user menu - Destroy666 - 2015-10-10

Not into theme, you have to add it into a plugin stored within the pluckin package.
http://docs.mybb.com/1.8/development/plugins/


RE: [HowTo] Fix empty default user avatar in custom theme user menu - Dr_The_One - 2015-12-05

(2015-02-05, 05:59 PM)Devilshakerz Wrote: You can actually do this with pure CSS:

<div class="avatar-box">
    <img src="{$mybb->user['avatar']}" alt="avatar" />
</div>
.avatar-box { height: 30px; width: 30px; background: url('../../../images/default_avatar.png') no-repeat; background-size: 100% auto; }
.avatar-box img { height: 30px; width: 30px; }
.avatar-box img[src=""] { display: none; }
If the user has set his own avatar, the default one gets covered behind - if not, the image is hidden to prevent the browser from rendering a broken image indicator.

Where to modify/add code?


RE: [HowTo] Fix empty default user avatar in custom theme user menu - amanda_2011 - 2018-11-21

Thanks, SvePu, great plugin! (Tack!)