Step:1
Go to ACP > Customization > Themes and Select the skin you wish to edit
Step: 2
Find postContainer in the templates
Step: 3
Look for
<li class='cAuthorPane_photo'>
{template="userPhoto" app="core" group="global" params="$comment->author(), 'large', $comment->warningRef()"}
</li>
Step: 4
Replace it with
<li class='cAuthorPane_photo'>
{template="userPhoto2" app="core" group="global" params="$comment->author(), 'variable', $comment->warningRef()"}
</li>
Step: 5
Create New HTML Template
Name: UserPhoto2
Variables:
$member, $size='small', $warningRef=NULL, $classes='', $hovercard=TRUE
Location: Add To an existing location
Existing Location: front
Group: Add to an existing group
Existing Group: global
Application: System
Step 6:
Find HTML template "UserPhoto2" and paste the following code into it
{{if $member->member_id and \IPS\Member::loggedIn()->canAccessModule( \IPS\Application\Module::get( 'core', 'members' ) )}}
{{$memberURL = ( $warningRef ) ? $member->url()->setQueryString( 'wr', $warningRef ) : $member->url();}}
<a href="{$memberURL}" {{if $hovercard}}data-ipsHover data-ipsHover-target="{$memberURL->setQueryString( 'do', 'hovercard' )}"{{endif}} class="ipsUserPhoto ipsUserPhoto_{$size}{{if $classes}} {$classes}{{endif}}" title="{lang="view_user_profile" sprintf="$member->name"}">
<img src='{{if $member->pp_main_photo}}{file="$member->pp_main_photo"}{{else}}{file="$member->photo"}{{endif}}' alt='{$member->name}'>
</a>
{{else}}
<span class='ipsUserPhoto ipsUserPhoto_{$size} {{if $classes}}{$classes}{{endif}}'>
<img src='{file="$member->photo"}' alt='{$member->name}'>
</span>
{{endif}}
Step: 7
Find custom.css and Add this line of code below
.ipsUserPhoto_variable img, img.ipsUserPhoto_variable, .ipsUserPhoto_variable:after {
width: 170px;
{{if theme.rounded_photos}}
border-radius: 0px;
{{endif}}
}
after you have completed all the steps above the results should be like this below