Control signatures height per pixel with CSS

[Mazinger]

This mod will help you determine a fixed height for signatures in posts with CSS to prevent members from having a large annoying signature. (it will cut from the signature and hide the rest of it) - screenshot attached.

Long signatures and signatures with alot of images will not be an issuse anymore!


INSTALLATION


EDIT postbit OR postbit_legacy (which you use) and search for:

$post[signature]Replace it with

<div class="fixedsig">$post[signature]</div>Then go to the style option and add these lines in the CSS


.fixedsig {
max-height:250px;
height:expression((document.documentElement.client Height) > 250? "250px" : "100%");
overflow:hidden;
}
You can change the 250 to the height you want (per pixels)

And you're done!


SUPPORT


Please click Mark as Installed if you want to get support for this mod.

[Leo Brazil]

Great idea. I going to check this out.

[TomJames]

Awesome.

[Mazinger]

If you have installed it, then click Mark as Installed please. :)

[TomJames]

Just finished installing it, works perfectly and very easy to install. Thanks.

[Mike08]

Thanks!!! It works! ;)

I needed a code to modify the width of the signature. So with your permission I have adapted to modify the code in height and width.

Here it is. Example with 800x300px.

.fixedsig {
max-width:800px;
width:expression((document.documentElement.clientW idth) > 800? "800px" : "100%");
overflow:hidden;

max-height:300px;
height:expression((document.documentElement.client Height) > 300? "300px" : "100%"); }

[Mazinger]

Well, I could add a width control too, but I decided to leave it to image resize mods; they would give better results for width control.

[Mike08]

I have the ncode image resizer installed but don't work in signatures images. I think the best way to have a well-organized forum :D.

I have users who have reached 1,200px width pictures in signatures :eek:

And vBulletin can only limit the size of attached images, not the bbcodes.

Anyway, thanks again :up:

[Boosted Panda]

Great one Ill try this later!

[RocCityDad]

Hi I am new to vbulletin.. where do I go to make this edit.. thanks

[RocCityDad]

i don't think I did it right... not working

[Mazinger]

Are you sure you applied my instructions correctly?

[yingzhou]

If I don't want to hide it, how can I add the scrollbar to the last part?

[Mazinger]

If I don't want to hide it, how can I add the scrollbar to the last part?
Change overflow:hidden; to overflow:scroll;

[HolyKiller]

I'm using 6 skins on my forum. One is default skin, the other four are from eXtreme pixels, and the last one is free skin Pro Bangla ( from vbulletin.org -> HERE (https://vborg.vbsupport.ru/showthread.php?t=198937) ).

This signature restriction works perfectly on the fist five skins (default and eXtremepixels skins) BUT, it doesn't work with ProBangla skin. I am rly confused.

In CSS i have (like in other's five skins)

/* ***** Signature Cut ***** */
.fixedsig {
max-height:100px;
height:expression((document.documentElement.client Height) > 100? "100px" : "100%");
overflow:hidden;
}


and in postbit_legacy (again, "like in other skins")

<div class="fixedsig">$post[signature]</div>


Can anyone please help me, what i can do with this?

Thanks a LOT

Holy

[Mazinger]

PM me with your forum admin access and I'll have a look myself.

[HolyKiller]

PM me with your forum admin access and I'll have a look myself.

Funny, but ok, i'll send you access to test forum :)

Check your PM

[trotskid]

Then go to the style option and add these lines in the CSS

Hi, where exactly can I modify that?

Thanks ;)

[Mazinger]

Look at this:
http://www.vbulletin.com/docs/html/main/stylemanager_css_additional

[trotskid]

Thank you Mazinger!

It´s posible to limit also the width?

Greetings

[Mazinger]

I would recommend using an image resizer mod for this.

[trotskid]

ImageResizer don?t works very well on my forum (3.8.1) :S. Instead of this I use Resize IMG tag with Highslide but only for images.

Thanks anyway, and thanks also for this hack ;)

[HolyKiller]

I would recommend using an image resizer mod for this.

This is 100% better cos this restriction crop (or scrool) EVERYTHING, not only IMG tags. Even texts, hyperlinks, quote/code bars ... everything. So the signature is strictly cut everything larger than XXX px.

Love this hack :p

[Mazinger]

Love your comment too. ;)

[Pteppic]

I'm getting different problems with IE and Firefox. In the former, the signatures that are within the limit are stretched to fit it. This is not a problem in Firefox, although youtube videos embedded in signatures (by specialised bbcode) bleed over into the post below (or whatever's there). I suppose the embedding html overrides the mod somehow, but as a complete CSS noob, I haven't a clue how to fix it, and the IE stretching thing I can't figure out at all. (Screenshots attatched)

[Mazinger]

I think my mod have no control over flash objects in Firefox, may be there's something that can be done to solve it - I don't it now, sorry!

[Pteppic]

Well, necessity is the mother of invention :p , and I managed to find some solutions on my own - I set the wmode parameter in the embedding code to opaque and used "this.scrollHeight" in the css instead of "(document.documentElement.clientHeight)".

[Mike08]

Thank you Mazinger!

It?s posible to limit also the width?

Greetings

Thanks!!! It works! ;)

I needed a code to modify the width of the signature. So with your permission I have adapted to modify the code in height and width.

Here it is. Example with 800x300px.

.fixedsig {
max-width:800px;
width:expression((document.documentElement.clientW idth) > 800? "800px" : "100%");
overflow:hidden;

max-height:300px;
height:expression((document.documentElement.client Height) > 300? "300px" : "100%"); }
Here it is :D

****IMPORTANT: Place this code at very top of CSS.

[EvilJohn]

Thank you. Works very well. :up:

[HayleyP]

I used the "scroll" instead of "hidden" but how do I make it so if the signature is the right size, you can't see the scroll bars?

[valendono]

it is max-height is valid css for ie, ff or any else browser ? I dont max-height is global css variables, some browser cant read it.

[triff]

Is it possible to change the limitation from px to % or something that change with the users screen resolution? As it is it will look quite different depending on your screen resolution.

SGL.

[KID_1194]

This is awesome .. thaks a lot Mazinger !

[BUDIMAN]

Work perfectly...tq

[Mazinger]

You're welcome all.