• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Which Style Property ?

tafreehm

Well-known member
#1
Hello,
I am looking for few style properties to make changes.

  1. Font color for top navigation text (for example: HOME FORUM BUY XENFORO etc)
  2. Background Color and Size for Sub Navigation (Mark Forum Read, Search Forums etc)
  3. Avatar Size control at Sidebar and in userinfo at message also at profile page.
I could not find any style properties for above. I will post more if I need help.

Thanks
 

Jake Bunce

XenForo moderator
Staff member
#2

tafreehm

Well-known member
#3
HeyJake, Thanks for that. second link you posted did not work for me.
Also for this
How can I have custom size ? L is sort of too big for what I m looking for.

-----------
I did create a custom property, but it does not seems to be working:
HTML:
.avatar .img.c { width: 150px; height: 165px; }
 

Jake Bunce

XenForo moderator
Staff member
#4
How can I have custom size ? L is sort of too big for what I m looking for.
To have a custom avatar size other than s, m, or l requires modifying the code like this:

http://xenforo.com/community/threads/how-do-i-change-avatar-size.6817/#post-109103

That changes the size of the "m" avatar which is used in posts. In addition you will need to adjust the size of the author area in posts to accommodate the new size:

Admin CP -> Appearance -> Style Properties -> Message Layout
> User Info Container
> Content Container


One controls the box itself, the other controls the space allocated for the box.
 

tafreehm

Well-known member
#5
so S, M and L only been used in Message area ? If I modify m's properties its only gonna take affect in one location only. Right?
and the link you posted in above post, gives me permission error.
 

Jake Bunce

XenForo moderator
Staff member
#6
Oh I'm sorry. It's a deleted thread. I didn't notice because I'm a mod. Here is a quote:

I've read several avatar-size threads now and the answer to changing their size is always, there is no way to do that without code and template edits. Well, I'm game - how do I do that with code and template edits? :) I'd like the avatars to be a full 124x124 and I'll just eliminate the padding.
Make sure the one php file you are about to edit, you have a back-up of, :)

If you open this php file: yourinstalldirectory/library/XenForo/Model/Avatar.php you will find this located near the top:

PHP:
    protected static $_sizes = array(
        'l' => 192,
        'm' => 96,
        's' => 48
    );
the "l" contains the value for the large avatar, "m" for the medium (used in the poster block), and "s" for small avatars. Change the 96 to 124, and save.

Template edits: AdminCP -> Appearance -> Templates. Select your style you want to apply the changes to.

Open xenforo.css, find:

Code:
.avatar .img.m { width: 96px;  height: 96px;  }
Change both 96px's to 124px

Save, and then open navigation.css:

Code:
    #AccountMenu .menuHeader .links .fl
    {
        position: absolute;
        bottom: 10px;
        left: {xen:calc '10 + 10 + 96'}px;
    }
change the 96 to 124, and select save.

You will need to fine tune paddings for the poster information block. You will need to re-upload your avatar so the new "m" size can be saved. Also, the three default avatars should have their medium size changed to 124px too.
And this change will affect all "m" avatars, not just those in posts.
 

tafreehm

Well-known member
#7
Oh I'm sorry. It's a deleted thread. I didn't notice because I'm a mod. Here is a quote:



And this change will affect all "m" avatars, not just those in posts.
Thanks Jake.. Now How I can move Search Bar position ? I could not find any style property for search bar ?
I haven't look into any templates yet..
 

Jake Bunce

XenForo moderator
Staff member
#8
Thanks Jake.. Now How I can move Search Bar position ? I could not find any style property for search bar ?
I haven't look into any templates yet..
Admin CP -> Appearance -> Templates -> EXTRA.css

Add this code:

Code:
#QuickSearch
{
	position: absolute;
	right: 20px;
	top: -18px;
}
Those are the default position adjustments. You can change them.
 

DRE

Well-known member
#9
Oh I'm sorry. It's a deleted thread. I didn't notice because I'm a mod. Here is a quote:



And this change will affect all "m" avatars, not just those in posts.
Can I add those css edits in Extra.css or do I absolutely have to edit the xenforo.css and navigation.css templates?
 

psTubble27

Well-known member
#13
Hi @Jake Bunce, quick question.

Here's a sample test-case avatar.

If I set the avatar size to medium:
Code:
<xen:avatar user="$user" size="m" img="true" />
The result looks as it's supposed to:
postbit-m.png
(The bottom part of the image is cropped.)

However if I set the avatar to large:
Code:
<xen:avatar user="$user" size="l" img="true" />
The system inserts an uncropped avatar:
postbit-l.png

Is this a bug?

In an enlarged postbit, we need to serve a larger avatar. But the image returned by the system is uncropped and thus totally unusable!
 

psTubble27

Well-known member
#15
@Jake Bunce

Ok I tried it out in various configurations. It doesn't seem to actually be a fix, to be honest. Instead of an image, the system serves a <span> with the entire avatar image in the background. The problem is, it still doesn't serve you the cropped avatar. You're still trying to fit in the uncropped avatar into the userbit.
 
Last edited:

Jake Bunce

XenForo moderator
Staff member
#16
@Jake Bunce

Ok I tried it out in various configurations. It doesn't seem to actually be a fix, to be honest. Instead of an image, the system serves a <span> with the entire avatar image in the background. The problem is, it still doesn't serve you the cropped avatar. You're still trying to fit in the uncropped avatar into the userbit.
It works in my testing. I get a square span with a cropped rectangular avatar in the background.

Please post a URL showing the problem.
 
#18
I tried the large av fix linked above (cannot reply there insuf priv's) and it works fine in threads etc. But here's what happened in my PMs . . .
large avs.jpg

Do I need to edit something else in style properties/container ? It is probably being caused by my custom theme which I am having removed soon and going back to stock XF. In the meantime I hope there's an edit I can use.