Register Members List Search Today's Posts Mark Forums Read

Reply
 
Mod Options
Prevent Oversized Images Breaking Message Tables & Sigs 2.1 Details »
Prevent Oversized Images Breaking Message Tables & Sigs 2.1
Mod Version: 2.1, by Freesteyelz (Member) Freesteyelz is offline
Developer Last Online: Apr 2010 I like it Show Printable Version Email this Page

This modification is in the archives.
vB Version: 3.5.3 Rating: (0 vote - 0 average) Installs: 125
Released: 14 Mar 2006 Last Update: 15 Mar 2006 Downloads: 65
Not Supported Template Edits  

Description: Using the CSS "overflow" attribute you can prevent large images from breaking your message column. This helps extremely for the people who use fixed widths. Images that display larger than the message column width will show a horizontal bar.

But it has already been done: Yes, but the other (non) CSS methods affect the overall performance of the forum. The CSS method previously provided required editing a .php file. Plus, in Internet Explorer both the horizontal and vertical scrollbar displayed. This method eliminates the vertical scrollbar. The modification only requires editing the postbit and/or postbit_legacy template and Main CSS.

What else to expect: The horizontal scrollbar will affect the entire post of the oversized image. That's the nature of the modification. No biggie.

Targeted Layout Type: Fixed width layout

Browsers tested: Internet Explorer and Firefox

Compatible vB versions: 3.5.3, 3.5.4, 3.5.5 and 3.6+

Thank yous: CyberAlien (Correction on ID to Class); kennn (PM resize - conditional code below)



Optional Modifications Added (3.14.06)!:
A) Signature (Cuts off oversized signatures in message bits by width & height.)

B) vBadvanced Newsbit (Same like the original, just with vBadvanced.)

C) vBadvanced Newsbit Signatures (Same like the original signature mod, just with vBadvanced.)

D) Private Message conditional posted by kennn (click here to post)

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

Finally, let's edit!
(Or you can download the .txt file for the installation instructions)

1. Back up your templates!

2. In your postbit or postbit_legacy template find this or something similar to:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Replace it with:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

3. Click "Save".

4. In Main CSS go to the bottom at Additional CSS Definitions and add code bit:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

5. Change the width "700px" to whatever you want. All other settings keep.

6. Click "Save".

7. Click if you use it.

Finished!


*For those of you who use a fluid layout take a look at this post. Thanks 007 for sharing.


=====================

Optional Modifications (Below)!!!:

*The 3 (A, B & C) optional modifications below follow the same steps as above with the exception of #2, #4 and #5.

A) For Signatures (Hide Oversized Images width & height):

2. In your postbit or postbit_legacy template find this or something similar to:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Replace it with:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

4. In Main CSS go to the bottom at Additional CSS Definitions and add code bit:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

5. Change the width "700px" and height "400px" to whatever you want. Signatures (text or image) that exceed either width or height limit will be cut off. This code does not affect the message Table. Keep the remaining codes the same.

*If the center tag doesn't work in the signature after implementing the code above see this post for the solution.

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

B) For vBAdvanced Newsbits:

2. In your vBadvanced CMPS Templates --> adv_portal_newsbits template find this or something similar to:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Replace it with:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

4. In Main CSS go to the bottom at Additional CSS Definitions and add code bit:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

5. Change the width "700px" to whatever you want. All other settings keep.

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

C) For vBAdvanced Newsbits (Signature):

2. In your vBadvanced CMPS Templates --> adv_portal_newsbits template find this or something similar to:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

Replace it with:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

4. In Main CSS go to the bottom at Additional CSS Definitions and add code bit:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

5. Change the width "700px" and height "400px" to whatever you want. Signatures (text or image) that exceed either width or height limit will be cut off. This code does not affect the vBadvanced message Table. Keep the remaining codes the same.

*If the center tag doesn't work in the signature after implementing the code above see this post for the solution.

Finished (Once More)!

7. Click if you use it.

Download Now

Only licensed members can download files, Click Here for more information.

Show Your Support

  • To receive notifications regarding updates -> Click to Mark as Installed.
  • This modification may not be copied, reproduced or published elsewhere without author's permission.
Comments
  #2  
Old 14 Mar 2006, 04:23
GTAce GTAce is offline
 
Join Date: Nov 2005
yaaayy!! I've been looking for a 3.5.4 compatible resizer lately and couldn't find one...and this one, with the scroll bar is very interesting

Will check it out now
__________________
vBSkinworks - Professional vBulletin Skins...Buy One, Get One FREE! vB4 Skins Available!
Reply With Quote
  #3  
Old 14 Mar 2006, 05:03
Zia's Avatar
Zia Zia is offline
 
Join Date: Dec 2005
Real name: Z.R.
simply a good idea for fixed width skin...
will that cut-off the image or re-size?
my bad luck...abt browser..hope it mite work on opera too
what will it do?
Reply With Quote
  #4  
Old 14 Mar 2006, 05:18
RaZor Edge's Avatar
RaZor Edge RaZor Edge is offline
 
Join Date: Jan 2002
Excellent!!! With vb 3.5 i don't like to edit php files... so your Template modification is perfect for me!!
Reply With Quote
  #5  
Old 14 Mar 2006, 05:52
Freesteyelz's Avatar
Freesteyelz Freesteyelz is offline
 
Join Date: Jan 2006
Yup. I too don't like editing .php files.

Originally Posted by Zia
simply a good idea for fixed width skin...
will that cut-off the image or re-size?
my bad luck...abt browser..hope it mite work on opera too
what will it do?
It does neither. Basically the code adds a horizontal bar in a post with oversized images using the "auto" value. If you want to simply cut off the image just replace "auto" with "hidden". As for Opera, I don't know. My guess is CSS strict compliant browsers will render the code properly.

An example is provided in my first post just in case you didn't see it.
Reply With Quote
  #6  
Old 14 Mar 2006, 11:34
agiacosa agiacosa is offline
 
Join Date: Dec 2004
Be great if you could get this to work for vBA CMPS portal. Nice hack in any event.
Reply With Quote
  #7  
Old 14 Mar 2006, 12:03
LBSources LBSources is offline
 
Join Date: Nov 2005
Real name: Lenny
wow! this is great .. now i can set a larger size for images and it wont break the margins.. sweet!

/me clicks install
__________________
.....
LBSources

Learn About The Bronx, New York!
Reply With Quote
  #8  
Old 14 Mar 2006, 13:08
FleaBag's Avatar
FleaBag FleaBag is offline
 
Join Date: Dec 2001
Installified!
Reply With Quote
  #9  
Old 14 Mar 2006, 16:48
The Realist's Avatar
The Realist The Realist is offline
 
Join Date: Oct 2001
Real name: Brian
Installed and works a treat, well done.

Laters
Reply With Quote
  #10  
Old 14 Mar 2006, 21:02
Freesteyelz's Avatar
Freesteyelz Freesteyelz is offline
 
Join Date: Jan 2006
Thank you again for the feedback and support everyone!

Originally Posted by agiacosa
Be great if you could get this to work for vBA CMPS portal. Nice hack in any event.
Ask and shall receive. Updated above are the optional codes. :banana:

Optional Modifications Added (3.14.06)!:

1. Signature (Cuts off oversized signatures in message bits by width & height.)

2. vBadvanced Newsbit (Same like the original, just with vBadvanced.)

3. vBadvanced Newsbit Signatures (Same like the original signature mod, just with vBadvanced.)

Last edited by Freesteyelz; 14 Mar 2006 at 21:07.
Reply With Quote
  #11  
Old 14 Mar 2006, 21:31
MissKalunji's Avatar
MissKalunji MissKalunji is offline
 
Join Date: Aug 2003
Real name: Mj Bain
Nice!
__________________
____________
BossLady
Reply With Quote
  #12  
Old 14 Mar 2006, 21:31
MissKalunji's Avatar
MissKalunji MissKalunji is offline
 
Join Date: Aug 2003
Real name: Mj Bain
it would be nice if you put all that in a txt so we can download
__________________
____________
BossLady
Reply With Quote
  #13  
Old 14 Mar 2006, 21:33
CyberAlien's Avatar
CyberAlien CyberAlien is offline
 
Join Date: Mar 2002
Real name: Vjacheslav Trushkin
You should use "class", not "id" for those <div> elements. That template is repeated for every post, so you'll have several divs with same id but every id should be unique so your code isn't correct. And you don't need additional div at all - just add class to existing div.
__________________
Former phpBB/vBulletin style designer.
Latest project: ColorizeIt - change color scheme of any style with just few clicks.
Reply With Quote
  #14  
Old 14 Mar 2006, 21:49
Freesteyelz's Avatar
Freesteyelz Freesteyelz is offline
 
Join Date: Jan 2006
Originally Posted by MissKalunji
it would be nice if you put all that in a txt so we can download
I'll work on it.
Reply With Quote
  #15  
Old 14 Mar 2006, 21:50
Freesteyelz's Avatar
Freesteyelz Freesteyelz is offline
 
Join Date: Jan 2006
Originally Posted by CyberAlien
You should use "class", not "id" for those <div> elements. That template is repeated for every post, so you'll have several divs with same id but every id should be unique so your code isn't correct. And you don't need additional div at all - just add class to existing div.

Each ID is unique. Only the front name "hide" remains the same. The reason I didn't use class is that some users, like myself, add additional (and/or common) values to the existing <div> element (e.g., <div id="hidemsg" class="whatever">). The way this modification was written, each modification is independent from one another. This gives the user full control how he/she want to display the messages, signatures, vBadvanced messages and vBadvanced signatures. I just copied and pasted lines of code to make it simple to understand. So the codes are correct.

In the CSS rule, "ID's" can be repeated but "class" cannot within an element.

Last edited by Freesteyelz; 14 Mar 2006 at 21:56.
Reply With Quote
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Mod Options

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off


New To Site? Need Help?

All times are GMT. The time now is 10:50.

Layout Options | Width: Wide Color: