Frame box around Avatar

[katie hunter]

Hi I've seen this happening in some sites, that by editing postbit_legacy , the avatar part, all avatars will have a framebox around it, gray whichever color

how can i apply this to my template code ?

PHP Code:

<if condition="$show['avatar']"><center>
<div class="smallfont">
&nbsp;<br /><a href="member.php?$session[sessionurl]u=$post[userid]"><img src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0" /></a>
</div>
</if> 


--------------------------

I checked one of the site where some ppl have this done and this is what they did

PHP Code:

<div class="smallfont">

<div align="center"><a href="member.php?u=2"><img class="postbit_avatar" src="image.php?u=2&amp;dateline=1217596661" alt="width="100" height="100"Aki's Avatar

" border="0" /></a> </div>
</div> 


The only difference u will notice is this part i think

PHP Code:

<img class="postbit_avatar" src="image.php?u=2&amp;dateline=1217596661" alt="width="100" 


so that person must have went and added

Additional CSS Definitions

for example like and use it

PHP Code:

.avatar_postbit {
  padding-left: 3px;
  padding-right: 0px;
  padding-top: 3px;
  padding-bottom: 3px;
  background-color: #E0E0F6
  border-top: 2px solid #E0E0F6;
  border-right: 2px solid #E0E0F6;
  border-left: 3px solid #b7ccfc;
  border-bottom: 2px solid #E0E0F6;
  margin-bottom: 7px;
  } 


----------------------------

But how to apply all that to this code

PHP Code:

<if condition="$show['avatar']"><center>
<div class="smallfont">
&nbsp;<br /><a href="member.php?$session[sessionurl]u=$post[userid]"><img src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0" /></a>
</div>
</if> 


[Lynne]

You would add the new css into your style in Styles & Templates > sTyle Manager > find your style > Main CSS > go to the bottom of the page to Additional CSS Definitions and put the postbit_avatar CSS in there.

Then modify your postbit(_legacy) templates:

<if condition="$show['avatar']">
                <div class="smallfont">
                    &nbsp;<br /><a href="member.php?$session[sessionurl]u=$post[userid]"><img class="postbit_avatar" src="$post[avatarurl]" $post[avwidth] $post[avheight] alt="<phrase 1="$post[username]">$vbphrase[xs_avatar]</phrase>" border="0" /></a>
                </div>
            </if>

[katie hunter]

Thanks Lynne, do you know how would i a creat a good additional css ?

I mean something like this,

.avatar_postbit {
padding-left: 3px;
padding-right: 0px;
padding-top: 3px;
padding-bottom: 3px;
background-color: #E0E0F6
border-top: 2px solid #E0E0F6;
border-right: 2px solid #E0E0F6;
border-left: 3px solid #b7ccfc;
border-bottom: 2px solid #E0E0F6;
margin-bottom: 7px;
}

[Lynne]

I have not tried that css (and btw, it should be called .postbit_avatar if you used the class name in my example above). Did you try it?

[katie hunter]

I will try it and let you know i just have to figure out it for the avatar