By Sam308 on

Set the maximum size of aggregated images displayed on your Drupal website

I have searched all the forums and could not come up with a "proper solution" to set the maximum display size of images that are aggregated into a Drupal website using the standard aggregator module.

I have come up with a tested solution that works in both Firefox and Internet Explorer.

All you would need to do is add the following CSS properties to the aggregator.css file.

Reason:
Some people like to include very large images in their websites. If you happen to pull in an RSS feed from one of these websites into your Drupal site, the feed item article including one or more of these large images can destroy the layout of your Drupal site. In most cases, these large images would push out the right side blocks, causing them to wrap at the bottom of the page. Also, the top of your web page content area may appear blank.

Add the following CSS properties to the aggregator.css file:

Location: modules\aggregator
File: aggregator.css

#aggregator .feed-item-body img {
   height:auto;
   max-width: 400px;
   width:expression(this.width > 400 ? "400px" : this.width);
}

It appears that the max-width: 400px; sets the maximum display image size in Firefox and the width:expression(this.width > 400 ? "400px" : this.width); sets the maximum display image size in Internet Explorer.

Keep in mind that these CSS properties only sets the maximum display image size displayed on your website and does not change the dimensional properties of the original images.

Hope this helps you all,

Sam Raheb

⋅ Categories: Drupal 6.x

Comments

a_c_m’s picture

a_c_m commented

Very helpful, thank you for sharing!

I was also looking at an input filter + lightbox solution or similar, so when we needed to downsize, it could add a lightbox link to see the full size version.