One User Avatar | User Profile Picture

plugin banner

Use any image from your WordPress Media Library as a custom user avatar or user…

Author:One Designs (profile at wordpress.org)
WordPress version required:4.0
WordPress version tested:6.3.4
Plugin version:2.4.0
Added to WordPress repository:25-05-2021
Last updated:17-08-2023
Rating, %:96
Rated by:40
Plugin URI:https://onedesigns.com/plugins/one-user-avata...
Total downloads:251 232
Active installs:80 000+
plugin download
Click to start download

WordPress currently only allows you to use custom avatars that are uploaded through Gravatar. One User Avatar enables you to use any photo uploaded into your Media Library as an avatar. This means you use the same uploader and library as your posts. No extra folders or image editing functions are necessary. This plugin is a fork of WP User Avatar v2.2.16.

One User Avatar also lets you:

  • Upload your own Default Avatar in your One User Avatar settings.
  • Show the user’s Gravatar avatar or Default Avatar if the user doesn’t have a One User Avatar image.
  • Disable Gravatar avatars and use only local avatars.
  • Use the [avatar_upload] shortcode to add a standalone uploader to a front page or widget. This uploader is only visible to logged-in users.
  • Use the [avatar] shortcode in your posts. These shortcodes will work with any theme, whether it has avatar support or not.
  • Allow Contributors and Subscribers to upload their own avatars.
  • Limit upload file size and image dimensions for Contributors and Subscribers.

Copyright

One User Avatar
Copyright (c) 2023 One Designs https://onedesigns.com/
License: GPLv2
Source: https://github.com/onedesigns/one-user-avatar

One User Avatar is based on WP User Avatar v2.2.16
Copyright (c) 2020-2021 ProfilePress https://profilepress.net/
Copyright (c) 2014-2020 Flippercode https://www.flippercode.com/
Copyright (c) 2013-2014 Bangbay Siboliban http://bangbay.com/
License: GPLv2
Source: https://github.com/profilepress/wp-user-avatar

One User Avatar is distributed under the terms of the GNU GPL

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 2 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.

Advanced Settings

Add One User Avatar to your own profile edit page

You can use the [avatar_upload] shortcode to add a standalone uploader to any page. It’s best to use this uploader by itself and without other profile fields.

If you’re building your own profile edit page with other fields, One User Avatar is automatically added to the show_user_profile and edit_user_profile hooks. If you’d rather have One User Avatar in its own section, you could add another hook:

do_action( 'edit_user_avatar', $current_user );

Then, to add One User Avatar to that hook and remove it from the other hooks outside of the administration panel, you would add this code to the functions.php file of your theme:

function my_avatar_filter() {
    // Remove from show_user_profile hook
    remove_action( 'show_user_profile', array( 'wp_user_avatar', 'wpua_action_show_user_profile' ) );
    remove_action( 'show_user_profile', array( 'wp_user_avatar', 'wpua_media_upload_scripts' ) );

    // Remove from edit_user_profile hook
    remove_action( 'edit_user_profile', array( 'wp_user_avatar', 'wpua_action_show_user_profile' ) );
    remove_action( 'edit_user_profile', array( 'wp_user_avatar', 'wpua_media_upload_scripts' ) );

    // Add to edit_user_avatar hook
    add_action( 'edit_user_avatar', array( 'wp_user_avatar', 'wpua_action_show_user_profile' ) );
    add_action( 'edit_user_avatar', array( 'wp_user_avatar', 'wpua_media_upload_scripts' ) );
}

// Loads only outside of administration panel
if ( ! is_admin() ) {
    add_action( 'init','my_avatar_filter' );
}

HTML Wrapper

You can change the HTML wrapper of the One User Avatar section by using the functions wpua_before_avatar and wpua_after_avatar. By default, the avatar code is structured like this:

<div class="wpua-edit-container">
    <h3>Avatar</h3>
    <input type="hidden" name="wp-user-avatar" id="wp-user-avatar" value="{attachmentID}" />
    <p id="wpua-add-button">
        <button type="button" class="button" id="wpua-add" name="wpua-add">Edit Image</button>
    </p>
    <p id="wpua-preview">
        <img src="{imageURL}" alt="" />
        Original Size
    </p>
    <p id="wpua-thumbnail">
        <img src="{imageURL}" alt="" />
        Thumbnail
    </p>
    <p id="wpua-remove-button">
        <button type="button" class="button" id="wpua-remove" name="wpua-remove">Default Avatar</button>
    </p>
    <p id="wpua-undo-button">
        <button type="button" class="button" id="wpua-undo" name="wpua-undo">Undo</button>
    </p>
</div>

To strip out the div container and h3 heading, you would add the following filters to the functions.php file in your theme:

remove_action( 'wpua_before_avatar', 'wpua_do_before_avatar' );
remove_action( 'wpua_after_avatar', 'wpua_do_after_avatar' );

To add your own wrapper, you could create something like this:

function my_before_avatar() {
    echo '<div id="my-avatar">';
}
add_action( 'wpua_before_avatar', 'my_before_avatar' );

function my_after_avatar() {
    echo '</div>';
}
add_action( 'wpua_after_avatar', 'my_after_avatar' );

This would output:

<div id="my-avatar">
    <input type="hidden" name="wp-user-avatar" id="wp-user-avatar" value="{attachmentID}" />
    <p id="wpua-add-button">
        <button type="button" class="button" id="wpua-add" name="wpua-add">Edit Image</button>
    </p>
    <p id="wpua-preview">
        <img src="{imageURL}" alt="" />
        <span class="description">Original Size</span>
    </p>
    <p id="wpua-thumbnail">
        <img src="{imageURL}" alt="" />
        <span class="description">Thumbnail</span>
    </p>
    <p id="wpua-remove-button">
        <button type="button" class="button" id="wpua-remove" name="wpua-remove">Default Avatar</button>
    </p>
    <p id="wpua-undo-button">
        <button type="button" class="button" id="wpua-undo" name="wpua-undo">Undo</button>
    </p>
</div>
Screenshots
FAQ
ChangeLog