Custom Fields
Re-Envisioned
Support MB User Profile Custom Avatar via Image leads to blank avatar image

  • Creator
    Topic
  • #27135
    Resolved EddyPiV
    Participant

    Hi,

    I have added a custom avatar to the user profile, like described in https://metabox.io/create-custom-avatar/. Only change I made was that I used Image instead of Single Image, as I don't want the user to access the Media library.

    Used the same custom_avatar field id and added the code to functions.php.

    But the profile picture ends up as blank image, like this: https://share.getcloudapp.com/rRuG7zO8.

    <div>
    <?php
    add_filter( 'rwmb_meta_boxes', 'your_prefix_register_meta_boxes' );

    function your_prefix_register_meta_boxes( $meta_boxes ) {
    $prefix = '';

    $meta_boxes[] = [
        'title'  => esc_html__( 'Your Profile', 'text-domain' ),
        'id'     => 'user-profile-default-fields',
        'fields' => [
            [
                'id'       => $prefix . 'first_name',
                'type'     => 'text',
                'name'     => esc_html__( 'First Name', 'text-domain' ),
                'required' => 1,
            ],
            [
                'id'   => $prefix . 'last_name',
                'type' => 'text',
                'name' => esc_html__( 'Last Name', 'text-domain' ),
            ],
            [
                'id'       => $prefix . 'age',
                'type'     => 'number',
                'name'     => esc_html__( 'Your Age', 'text-domain' ),
                'min'      => 18,
                'max'      => 100,
                'required' => 1,
            ],
            [
                'id'   => $prefix . 'biography',
                'type' => 'textarea',
                'name' => esc_html__( 'Biography', 'text-domain' ),
                'desc' => esc_html__( 'Tell me about yourself', 'text-domain' ),
            ],
            [
                'id'               => $prefix . 'custom_avatar',
                'type'             => 'image',
                'name'             => esc_html__( 'Your Avatar', 'text-domain' ),
                'desc'             => esc_html__( 'If you have registered with your social media account, I take your avatar from there.<br>You can change it here if you want, or add it here if you registered traditionally.', 'text-domain' ),
                'force_delete'     => 1,
                'max_file_uploads' => 1,
            ],
        ],
        'type'   => 'user',
    ];
    
    return $meta_boxes;
    

    }
    </div>

Viewing 10 replies - 1 through 10 (of 10 total)
  • Author
    Replies
  • #27146
    Long Nguyen
    Moderator

    Hi Eddy,

    There is a bit of difference between two field types image and single_image. The field image is set to multiple so you have to loop through the array of the returned value to get the image information.
    https://docs.metabox.io/fields/image/#data

    You can use the function reset() to get the first-one element of array.

    $images = rwmb_meta( 'info', array( 'limit' => 1 ) );
    $image = reset( $images );
    ?>
    <img src="<?php echo $image['url']; ?>">
    

    Get more details here https://docs.metabox.io/fields/image/#template-usage.

    #27149
    EddyPiV
    Participant

    Hi Long,

    Yes, I forgot the array.

    But that makes the code for the functions.php more complicated for me, as I struggle to combine it with the array for the object type 'user'. (Critical errors...)

    Can you help please?
    Thanks.

    #27165
    Long Nguyen
    Moderator

    Hi,

    Here is the code in the article

        if ( $user && is_object( $user ) ) {
            $value = rwmb_meta( 'custom_avatar', array( 'object_type' => 'user' ), $user->data->ID );
    
            if ( $value ) {
                $avatar = "<img src='" . $value['url'] . "' class='avatar avatar-" . $size . " photo' alt='" . $alt . "' height='" . $size . "' width='" . $size . "' />";
            }
        }

    After changing to the field image, it should be

        if ( $user && is_object( $user ) ) {
            $value = rwmb_meta( 'custom_avatar', array( 'object_type' => 'user' ), $user->data->ID );
            $value = reset( $value );
            if ( $value ) {
                $avatar = "<img src='" . $value['url'] . "' class='avatar avatar-" . $size . " photo' alt='" . $alt . "' height='" . $size . "' width='" . $size . "' />";
            }
        }
    #27171
    EddyPiV
    Participant

    Thanks a lot, Long.

    Perhaps it makes sense to change the article https://metabox.io/create-custom-avatar/ accordingly, as I would expect not many webmasters would like to give their members access to the media library.

    Anyway, it works very nicely now. Thanks again.

    #27207
    EddyPiV
    Participant

    Hi Long,

    Getting back on this issue.
    My installation is a multisite. The code to copy custom_avatar to the standard wordpress profile picture works nicely for the subsite running MetaBox, but 2 other sites using the same (child) theme are facing critical errors.
    When taking out the code, they're back to normal.

    This is the code I have:

    `
    /* MetaBox - replace WP gravatar with custom gravatar */
    add_filter( 'get_avatar' , 'my_custom_avatar' , 1 , 5 );
    function my_custom_avatar( $avatar, $id_or_email, $size, $default, $alt ) {
    $user = false;
    if ( is_numeric( $id_or_email ) ) {
    $id = (int) $id_or_email;
    $user = get_user_by( 'id' , $id );
    } elseif ( is_object( $id_or_email ) ) {
    if ( ! empty( $id_or_email->user_id ) ) {
    $id = (int) $id_or_email->user_id;
    $user = get_user_by( 'id' , $id );
    }
    } else {
    $user = get_user_by( 'email', $id_or_email );
    }

    if ( $user && is_object( $user ) ) {
    $value = rwmb_meta( 'custom_avatar', array( 'object_type' => 'user' ), $user->data->ID );
    $value = reset( $value );
    if ( $value ) {
    $avatar = "<img alt='" . $alt . "' height='" . $size . "' width='" . $size . "' />";
    }
    }
    return $avatar;
    }
    `
    Is something extra needed to handle this multisite installation?

    #27208
    EddyPiV
    Participant

    Sorry, I was fighting with the code. But I hope you can work on it, right?

    #27228
    EddyPiV
    Participant

    Hi Long,
    I don't know what happened, but the code was not the root cause of the severe error.
    So please ignore my previous comments.

    #27267
    EddyPiV
    Participant

    Hi Long,

    I'm back on this issue.

    When I added the code as suggested by you to the functions.php, it worked very nicely.
    But... another subsite on the same multisite installation, using the same child theme, crashed.

    Reasson: Uncaught Error: Call to undefined function rwmb_meta() in /var/web/site/public_html/wp-content/themes/materialis-pro-child/functions.php:88

    That subsite doesn't have Meta Box activated. When I activate the plugin, it's working.

    But that's not the correct way, obviously.

    Can you please help me with the correct code to keep subsites without Meta Box activated working as well?

    Thanks for your help, kind regards,
    Eddy

    #27275
    Long Nguyen
    Moderator

    Hi Eddy,

    You can use check if the helper function exists and run the code after the condition.

    add_filter( 'get_avatar' , 'my_custom_avatar' , 1 , 5 );
    function my_custom_avatar( $avatar, $id_or_email, $size, $default, $alt ) {
        if( !function_exists( 'rwmb_meta' ) ) return $avatar;
        $user = false;
        ...
    }

    see more here https://www.php.net/manual/en/function.function-exists.php

    #27285
    EddyPiV
    Participant

    Thanks Long, it's working.

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