Script Summary: Use this script to quickly scan your blog for images that
Ever try to stick a 550 pixel-wide image into a 500 pixel-wide space? Firefox will increase the space, but under Internet Explorer 6 (or lower) it will move the sidebar so that it comes AFTER the blog posts.
Figure 1: Crappy MSPaint drawing explaining what I’m talking about.
Find Wide Images is a script I use it to find images that are too big and would “break” fixed width blog themes under Internet Explorer.
What it does
- Warns if images are too big and will break your blog.
- Suggests dimensions for resizing images so they will fit.
Figure 2: Highlighting which image is too big and breaks the theme.
Why would you want to find images wider than a certain size on a web page?
Blog themes come in two flavours. Fluid/liquid where the template stretches around the content to use the maximum width and fixed where the template will always be a certain number of pixels wide.
Problems can arise when using a fixed width template with images. If the image is too wide to fit it can stretch the fixed width section. This can break your sidebar in Internet Explorer 6 by pushing your sidebar so that it comes after all of your content.
As a Firefox user I don’t “test” my blog in Internet Explorer 6 very often (even though it still has 50% of the browser market share). So I needed a script that scans my blog and warns me if I’ve added an image that is too big and will break my blog template under IE 6.
*Very Important*
This script doesn’t work “out of the box”. You need to edit the list of pages it runs on to include your blog. Find out how to do that.
I’ve set it up so that the default width is 500px (which is good for most Wordpress.com templates) but you may need to change the value for whatever is appropriate for your site. Find out how to do that.
You can get frequent updates about all of my new software, tools or blog themes by subscribing to IDT Labs by RSS or by email. Or you could just subscribe to my main blog, Internet Duct Tape.
