Tips and Tricks HQ Support

Support site for Tips and Tricks HQ premium products

  • Home
  • Contact Us
  • Documentation
  • Forum Home
    • Forum
    • Forum Search
    • Forum Login
    • Forum Registration

[Resolved] Changing dimensions of gravatar

by

Tips and Tricks HQ Support Portal › Forums › WP eMember › WP eMember Tweaks › Changing dimensions of gravatar

Tagged: change profile image size, square gravatar

  • This topic has 9 replies, 6 voices, and was last updated 4 years, 4 months ago by jeffeinstein.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • February 20, 2012 at 9:39 am #5597
    johnw1965
    Member

    Where would I go to change the default dimensions of the members’ gravatar?

    I need them to be width=100px and height=140px

    I know from http://codex.wordpress.org/Using_Gravatars

    that I can use something like


    <img alt='' src='http://gravatarurl_or_default_url' class='avatar avatar-$size' height='$size' width='$size' />

    Where would I tweak this code in the eMember files?

    February 20, 2012 at 10:58 am #42162
    blatternet
    Member

    On my new “login center” I display some useful infos for my members. There I use the new shortcode to display the picture of a member:

    [wp_eMember_user_details user_info="profile_picture"]

    Then I just adjust the size of the picture in my style.css:

    .eMember_custom_profile_picture {
    width: 100px;
    height: 100px;
    }

    I’m not sure if this is the answer to your question, but perhaps it helps.

    February 20, 2012 at 11:48 pm #42163
    admin
    Keymaster

    @blatternet, Thank you for sharing your suggestion. That is a nice way to do it.

    @johnw1965, profile picture image displayed in the “Edit Profile” page has an ID of “emem_profile_image”. You can target that from the CSS file and change the dimension like the following:

    #emem_profile_image{
    width: 100px;
    height: 140px !important;
    }

    July 8, 2020 at 11:45 pm #42164
    clearscopedesign
    Participant

    Can you please tell me – is there a way to make it so that the eMember profile image that members upload to their profile can be automatically made to be of square dimensions?

    July 9, 2020 at 3:23 am #42165
    wzp
    Moderator

    @clearscopedesign —

    There is no “easy way” to force cropping during the upload process. However, through the magic of CSS, you can do the cropping.

    #emem_profile_image{
    width: 300px;
    height: 300px !important;
    object-fit:cover;
    }

    In this example, the image will crop 150px from the center of the image.

    You can also do this…

    #emem_profile_image{
    width: 300px;
    height: 300px !important;
    object-fit:cover;
    border-radius:50%;

    And you will get a circle 8)

    July 10, 2020 at 4:34 am #42166
    clearscopedesign
    Participant

    Thank you – what if the profile image needs to be the width of its container, rather than have a fixed width, such as when it appears in bbPress forum posts? In other words for it to be mobile responsive that way. Is there a way to do this without specifying a fixed width for the image?

    July 10, 2020 at 9:33 pm #42167
    wzp
    Moderator

    Try using percentages instead of “px” (pixel) units.

    January 18, 2021 at 9:34 am #82342
    jeffeinstein
    Participant

    Hello,

    I’m using eMember Prodile Extended to generate a user directory with links to member detail pages such as [as2ac.com/vendor-detail?member_id=34] How do I change the profile image size? I need to make it larger. Thanks for your help, as always.

    Jeff

    January 18, 2021 at 4:32 pm #82343
    wzp
    Moderator

    The dimensions have been hard coded into the addon.
    ********** WARNING: Running With Scissors Ahead **********
    ********** WARNING: Running With Scissors Ahead **********

    1. Backup the addon file: detailed_profile.php
       
    2. Now edit the file detailed_profile.php and look for the following line:
      
      $profile_img_tpl = '<img src="_%img_url%_" height="100" width="100" />';
      
    3. Now change the height and width values to whatever you need, and then save the file.
       
    • This reply was modified 4 years, 4 months ago by wzp.
    • This reply was modified 4 years, 4 months ago by wzp.
    January 19, 2021 at 4:51 am #82357
    jeffeinstein
    Participant

    Thank you! Worked great! [as2ac.com/vendor-detail?member_id=34]

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.
Log In

Forum Related

  • Forum Home
  • Forum Search
  • Forum Registration
  • Forum Login

Support Related Forms

  • Contact Us
  • Customer Support
  • Request a Plugin Update
  • Request Fresh Download Links

Useful Links

  • Plugin Upgrade Instructions
  • WP eStore Documentation
  • WP eMember Documentation
  • WP Affiliate Platform Documentation
  • Tips and Tricks HQ Home Page
  • Our Projects

Quick Setup Video Tutorials

  • WP eStore Video Tutorial
  • WP eMember Video Tutorial
  • WP Affiliate Platform Video Tutorial
  • Lightbox Ultimate Video Tutorial

Our Other Plugins

  • WP Express Checkout
  • Stripe Payments Plugin
  • Simple Shopping Cart Plugin
  • Simple Download Monitor

Copyright © 2025 | Tips and Tricks HQ