Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

General Questions

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Defaulting images to a certian width

Go to End

10 Posts   1674 Views


1 January 2009 at 9:01pm Community Member, 145 Posts

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 [url=]ticketed already created[/url] and is slated to be included in 2.3.0 stable.

Any ideas on a default width for images?


2 January 2009 at 8:11am 4085 Posts

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


class SpecialPhoto extends Image
function generateSpecialThumbnail($gd)
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.


2 January 2009 at 1:30pm Community Member, 145 Posts

Does that limit me to one image per page though?

Carbon Crayon

3 January 2009 at 3:22am (Last edited: 3 January 2009 3:26am), Community Member, 598 Posts

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'

and then in your template you can use:

<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.


3 January 2009 at 4:01am (Last edited: 3 January 2009 4:01am), 4085 Posts

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 %>


3 January 2009 at 12:40pm Community Member, 145 Posts

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...

Carbon Crayon

3 January 2009 at 1:29pm Community Member, 598 Posts

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.


3 January 2009 at 1:43pm Community Member, 145 Posts

I saw the tutorial on the wiki for the [url=]hasmanyfilemanager[/url]. 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?

Go to Top