user profile photo with shortcode

Resolved tauras2
(@tauras2)

5 years, 6 months ago

Hi,

looking for a way to add a member profile photo to a page using a shortcode. I want to enhance profile page with custom design and displaying a profile photo in a separate section in addition to the profile form.

I managed to parse other elements like “about” using this shortcode [um_user meta_key=”about”], but when I add this shortcode [um_user meta_key=”profile_photo”], it returns a filename.jpg, not the actual photo.

I’ve added the below code in functions.php, that I found on this forum and it helped to parse those other elements. But profile pic is not being displayed no matter what. I

function um_user_shortcode( $atts ) {

$atts = extract( shortcode_atts( array(
‘user_id’ => 0,
‘meta_key’ => ”,
), $atts ) );

if ( empty( $meta_key ) ) return;

if( empty( $user_id ) ) $user_id = um_profile_id();

$meta_value = get_user_meta( $user_id, $meta_key, true );

if( is_serialized( $meta_value ) ){
$meta_value = unserialize( $meta_value );
}

if( is_array( $meta_value ) ){
$meta_value = implode(“,”,$meta_value );
}

return apply_filters(“um_user_shortcode_filter__{$meta_key}”, $meta_value );

}
add_shortcode( ‘um_user’, ‘um_user_shortcode’ );

Does anybody know how to solve this?
thanks!!

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

Plugin Contributor Champ Camba
(@champsupertramp)

5 years, 6 months ago

Hi @tauras2

UM stores the user files in /wp-content/uploads/ultimate-member/<user_id>/

If the user has an ID# 123, you can retrieve the Image in the following URL format:
http://yoursitedomain/wp-content/uploads/ultimate-member/123/<photo file name>

Regards,

Thread Starter tauras2
(@tauras2)

5 years, 6 months ago

Thanks, Champ.

But how could I use a shortcode to get that picture dynamically in my profile page template that i’ve built (on Elementor)?
Plugin Contributor Champ Camba
(@champsupertramp)

5 years, 6 months ago
Hi @tauras2

You can add this along with the meta shortcode code snippet:
```
add_filter(“um_user_shortcode_filter__profile_photo”, function( $meta_value, $user_id ){
   return "http://yoursitedomain/wp-content/uploads/ultimate-member/{$user_id }/{$meta_value}";
}, 10, 2);
```
I made changes to the main shortcode function:
```
function um_user_shortcode( $atts ) {

$atts = extract( shortcode_atts( array(
   ‘user_id’ => 0,
   ‘meta_key’ => ”,
), $atts ) );

if ( empty( $meta_key ) ) return;

if( empty( $user_id ) ) $user_id = um_profile_id();

$meta_value = get_user_meta( $user_id, $meta_key, true );

if( is_serialized( $meta_value ) ){
   $meta_value = unserialize( $meta_value );
}

if( is_array( $meta_value ) ){
   $meta_value = implode(“,”,$meta_value );
}

   return apply_filters(“um_user_shortcode_filter__{$meta_key}”, $meta_value, $user_id );

}
add_shortcode( ‘um_user’, ‘um_user_shortcode’ );
```
Regards,
- This reply was modified 5 years, 6 months ago by Champ Camba.
Plugin Contributor Champ Camba
(@champsupertramp)

5 years, 6 months ago

Hi @tauras2

Please feel free to re-open this thread if any other questions come up and we’d be happy to help. 🙂

Regards,

Thread Starter tauras2
(@tauras2)

5 years, 6 months ago

Hi Champ,

yes, thank you! It still didn’t work, or maybe my skills are limited to make it work. Do you provide a paid help and could perhaps do this and troubleshoot directly on the page?

I’ve checked with couple of developers, but they all suggest to ditch trying to build this page on Elementor and instead custom code the whole page.

sqkkyzx
(@sqkkyzx)

5 years, 6 months ago

I don’t understand any code knowledge, but I remember that the picture widget that comes with Elementor seems to be able to directly select the dynamic metadata of the user’s profile photo.

I have similar difficulties, but my problem is that I want to get a user cover image. I finally failed to solve it. However, if you are talking about a user profile photo, I am sure that Elementor Pro can dynamically obtain it directly, unless you must use a shortcode.
sqkkyzx
(@sqkkyzx)

5 years, 5 months ago
Now I tried a new solution in order to get the user’s cover image.
As you said, using the short code [um_user meta_key=”cover_photo”] returned a url.
But I can still use the url to display pictures, Just use HTML tags img src=”[um_user meta_key=”cover_photo”]”
- This reply was modified 5 years, 5 months ago by sqkkyzx.
Thread Starter tauras2
(@tauras2)

5 years, 5 months ago

Thanks sqkkyzx! This works! Awesome, thanks a lot.

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

The topic ‘user profile photo with shortcode’ is closed to new replies.