Hey guys,

Im part way through developing my first site on Silverstripe for a client, all the content is in, just needing to get some images in there. There was a delay on getting the images, so I've just started throwing them in now.

These images are coming in all shapes and sizes, as you'd expect, but is there any way to default the images to a certain size when placing them into an article? Sure I can resize them all in a batch action in Photoshop, but my client will upload some of his own images at some point, and what then? If I can somehow set that all images would be inserted with a default with of 250px, that would make it easier for my client, and also make the design remain as I intended it to be!

I'd also love to see caption's for these images, but I see that it has been ticketed already created and is slated to be included in 2.3.0 stable.

Any ideas on a default width for images?

There are a number of ways to do this.

The easiest way is on your template, do this:

<% control MyPhoto %>
<% control CroppedImage(250,250) %>
<img src ="$URL" alt="" />
<% end_control %>
<% end_control %>

Another, more slick way is to extend your image class

<?php

class SpecialPhoto extends Image
{
function generateSpecialThumbnail($gd)
{
$gd->setQuality(100);
return $gd->croppedResize(250,250);
}
}
?>

Now, as long as you've set up a relationship with SpecialPhoto instead of Image, you should be able to do this on your template:

<img src="$MyPhoto.SpecialThumbnail.URL" alt="" />

The coolest part about this is that you can change those dimensions any time you want, because the original image is always kept. There's a lot of documentation on the GD library. You can look there for more examples.

Does that limit me to one image per page though?

Hi Adam

no, it doesnt limit you to 1 photo, it works the same as with any other image. So in your page model you would have:

static $has_one= array(
          'Image1' => 'SpecialPhoto',
          'Image2' => 'SpecialPhoto',
          'Image3' => 'SpecialPhoto'
);

<img src="$Image1.SpecialThumbnail.URL" alt="" > 
<img src="$Image2.SpecialThumbnail.URL" alt="" > 
<img src="$Image3.SpecialThumbnail.URL" alt="" > 

this way you could have a number of different functions in your SpecailPhoto class which return different sized thumnails for example. So if i had a function in there called Special_Bigger_Thumbnail I could use <img src="$Image3.Special_Bigger_Thumbnail.URL" alt="" > and because I have defined the Image as a 'SpecialPhoto' in the $has_one array SS knows to look in that class for the function.

Or if you want a true 1-M relation..

static $has_many = array ('Photos' => 'SpecialPhoto')

and on your template:

<% control Photos %>
<img src="$SpecialThumbnail.URL" alt = "" >
<% end_control %>

Thanks guys, this stuff looks perfect for my needs, but it doesnt seem to work for me. Will this stuff work when I'm adding the photos via tinyMCE? I thought I mentioned that in my first post, but on a reread I see I didnt...

Unfortunately not, as far as I know there really isnt much you can do with the images loaded from tinyMCE beyond resizing them in the window and changing the CSS.

To have really control over the images you will have to have them upload into an ImageField.

I saw the tutorial on the wiki for the hasmanyfilemanager. I was about to try to implement that sort of setup, when I realised that they would have to upload the image each time they use it on a page, when some images are used several times across the site. Does anyone know if it is possible to hook into the filesystem to select an image from what has already been uploaded rather than uploading the image each time?