PrivateAlps.net - Offshore Cloud Services | VPS/RDP/VPN - Dedicated Servers - Webhosting - TOR Services - Auto Deploy
IP.Board Tutorials

[IPS4.1x] Change Avatar Style

Submitted by zLuckr0x, , Thread ID: 34465

Thread Closed
17-05-2017, 07:06 AM
Working Not Working Link Down
#1
In this tutorial, I'll show you how you can create a different view to your board avatar on AuthorPane_info. Let's get started.

1- CSS Modifications

Go into core->front->custom->custom.css and add this code:

Code:
.cAuthorPane_photo img{
max-width: 170px;
}

2- Now, we'll edit the Templates of your theme. Go to forums->front->topics->postContainer and replace this code:

Code:
<li class='cAuthorPane_photo'>
{template="userPhoto" app="core" group="global" params="$comment->author(), 'large', $comment->warningRef()"}
</li>


To this:

Code:
<li class='cAuthorPane_photo'>
     {{if $comment->author()->pp_main_photo}}
         <a href='{url="app=core&module=members&controller=profile&id={$comment->author()->member_id}-{$comment->author()->name}" seoTemplate="profile" seoTitle="$seoName"}' data-ipsHover data-ipsHover-target='{url="app=core&module=members&controller=profile&id={$comment->author()->member_id}-{$comment->author()->name}&do=hovercard" seoTemplate="profile" seoTitle="$seoName"}' title="{lang="view_user_profile" sprintf="$name"}">
             <span class='ipsUserPhoto ipsUserPhoto_variable'>
                 <img src="{setting="base_url"}uploads/{$comment->author()->pp_main_photo}" />
             </span>
         </a>
     {{else}}
         <a href='{url="app=core&module=members&controller=profile&id={$comment->author()->member_id}-{$comment->author()->name}" seoTemplate="profile" seoTitle="$seoName"}' data-ipsHover data-ipsHover-target='{url="app=core&module=members&controller=profile&id={$comment->author()->member_id}-{$comment->author()->name}&do=hovercard" seoTemplate="profile" seoTitle="$seoName"}' title="{lang="view_user_profile" sprintf="$name"}">
             <span class='ipsUserPhoto ipsUserPhoto_variable'>
                 <img src="<Path_to>/default_photo.png" />
             </span>
         </a>
     {{endif}}
</li>


3- let's go to board configuration now. Go to: ACP > Users > Groups > EACH_USER_GROUP > Social and change the Maximum profile photo width/height to 300.

Done! Now, create a 170 x 300 avatar image and enjoy your new style.
1
Deadwood

RE: [IPS4.1x] Change Avatar Style

#2
are there any limits to the dimensions this can be changed to ?

RE: [IPS4.1x] Change Avatar Style

#3
yes i love it great thx 15/15

RE: [IPS4.1x] Change Avatar Style

#4
Thanks you for the sharing script code, fonctional for 4.2 version?

RE: [IPS4.1x] Change Avatar Style

#5
Thank you for the share buddy, really useful!!!!!!!!

RE: [IPS4.1x] Change Avatar Style

#6
thank you soo much geat one i like that realt help full keep posting this please thank you again

RE: [IPS4.1x] Change Avatar Style

#7
Thanks for sharing.

Best Regards,
mpro.

RE: [IPS4.1x] Change Avatar Style

#8
Thanks!! Smile
But my hovercard doesn't work. How to fix?
https://i.imgur.com/ACaA1jN.png

RE: [IPS4.1x] Change Avatar Style

#9
Do not have one for the latest versions?
In any case, it may be useful for study

RE: [IPS4.1x] Change Avatar Style

#10
This was the first time I've ever actually edited any custom html/css on IPB. Thank you so much, I really appreciate it.

Users browsing this thread: 1 Guest(s)