Major Additions - Image Resizer - CMS | Blogs | Posts | Signatures | Albums | VM's | PM's

Image Resizer - CMS | Blogs | Posts | Signatures | Albums | VM's | PM's - Using JQuery Script


This hack resizes LARGE images in CMS, Blogs, Posts, Signatures, Albums, Visitor Messages, Private Messages ...


Warning: Please note that this hack will resize all LARGE images in the IMG tags.
If you are using large images for your logo or background and they are in IMG tags they will be resized too.
This hack works perfectly fine with default vBulletin styles and in Internet Explorer 8, FireFox 3.5, Chrome and Opera.


You have the option to:

• Disable the hack.
• Choose default message for warning bar.
• Option to choose the height and width in CMS.
• Option to choose the height and width in Blogs.
• Option to choose the height and width in Posts.
• Option to choose the height and width in Albums.
• Option to choose the height and width in VM's.
• Option to choose the height and width in PM's.

LIVE DEMO
Username: demo
Password: demo



Installation:

Upload jquery.min.js to clientscript folder.
Import the XML file via Plugins & Products > Manage Products > Add/Import Products.

Note #1. This script will work after page is fully loaded. While the images are being downloaded they will be seen in full size.
Note #2. At the moment there is option to resize/exclude images in signatures. Signatures will be resized to the same size as posts.


If you have a LARGE LOGO and you dont want resized, do this:

In the header template find:

<div><a name="top" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></div>

Replace it with: (Edit the height and width in the above code to the size of your logo.)

<div><a name="top" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}" class="logo-image" title="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}">
<span style="background: url({vb:stylevar titleimage}) no-repeat; width:600px; height:120px; display:block"></span></a></div>

And this for other images you don't want resized:
Normal img tag:

<img src="image.png" width="600" height="120" border="0" alt="" />

Edit it to for this hack:

<span style="background: url(image.png) no-repeat; width:600px; height:120px; display:block"></span>

_________________________________ _________________________________

Please nominate this modification for the MOTM.
Please support me by donating ... click the link on the right. (Support Developer)
Please remember to click Mark as Installed if you use this hack.
_________________________________ _________________________________


13 March 2010
Version: 1.0 Released


.

[RaceJunkie]

This seems like a good hack but having to add every image you don't want to re size to your header is really a hassle. :down:

This mod also will re size any images you have in your advertisement blocks. So how do you prevent it from resizing your ads?

[valendono]

can u set if 728x90px ignored ?

[Athena1984]

Why is this making my images smaller than the specified height and width?

EDIT: No worries, I fixed the issue. I'll be marking this as installed. Thank you for this!

[AndrewDavis]

Question: It's not better to give the image, there not to resized a class? For example :

<img src="example.pic" class="notresized" /> ?

Cheers AndrewD

[RaceJunkie]

uninstalled:down:

[KURTZ]

Originally Posted by RaceJunkie

This seems like a good hack but having to add every image you don't want to re size to your header is really a hassle. :down:

This mod also will re size any images you have in your advertisement blocks. So how do you prevent it from resizing your ads?

need some improvements ... hope the dev will release an upgrade soon ...

[argothiusz]

What about option to define the size of signature?