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.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

Template Questions /

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

Image.SetWidth(150) Link


Go to End


10 Posts   7995 Views

Avatar
Ben Gribaudo

Community Member, 181 Posts

25 February 2009 at 9:38am

Hello,

How do I get the link to a resized image in a template? It would be nice to be able to do something like:

Image.SetWidth(150).Link

However, I can't do that as Image.SetWidth(150) always returns HTML.

(In case you're wondering, I'm building a desktop background download page where the background image needs to be offered in several resolutions. I would like to auto-generate those variations using image resizing functionality.)

Thank you,
Ben

Avatar
Ben Gribaudo

Community Member, 181 Posts

25 February 2009 at 11:45am

More on this....
It is possible to extend Image by adding convenience methods to provide the desired data. Example:

class WallpaperResourceImage extends Image {
	public function ResizedURL($width) {
		return $this->SetWidth($width)->URL();
	}
}

The downside with this approach is that referencing the resized image to retrieve different pieces of data in the template becomes cumbersome. Instead of being able to do something simple like this --

Image.SetWidth(150).Link
Image.SetWidth(150).getHeight

-- we have to add a method to our Image extension (in this case, WallpaperResourceImage) for every piece of data we want.

Avatar
alirobe

Community Member, 35 Posts

25 February 2009 at 7:45pm

Edited: 25/02/2009 7:46pm

Strangely, I came across this very same problem today, trying to set some page-specific CSS.

Writing a class is a very messy solution because it also means the theme and mysite folders are more coupled. This syling information should definitely be in the themes directory. If anyone can offer any ideas, I would also love to hear them.

Avatar
Ben Gribaudo

Community Member, 181 Posts

5 March 2009 at 12:07pm

More on this:

The template parser (in sapphire\core\SSViewer.php) uses regular expressions to convert template method/property calls into PHP. These regexes look for a fixed combination of call signatures--i.e. "Property.Subproperty", "Property(one_argument).Subproperty", "Property.Subproperty(one_argument)", etc. The signature of "Image.SetWidth(150).Link " does not match any of the defined call signatures. However, the signature of "Image.SetWidth(150)" does match one of the signatures. So, the parser converts "Image.SetWidth(150)" into PHP (which then is rendered as HTML) and then outputs ".URL" after it.

A draft patch has been proposed which will remove the limitation of having a fixed list of allowed call signatures.

Avatar
Willr

Forum Moderator, 5523 Posts

5 March 2009 at 4:24pm

This is a bit clumsy but should work

<% control Image %>
<% control SetWidth(150) %>
<a href="$Link"><img src="$URL" alt="$Title" /></a>
<% end_control %>
<% end_control %>

Avatar
Ben Gribaudo

Community Member, 181 Posts

6 March 2009 at 7:01am

Thanks, Will!

Avatar
Ben Gribaudo

Community Member, 181 Posts

19 March 2009 at 8:21am

The above-mentioned patch is attached to ticket #3738. Testers are needed to try it out.

Avatar
Willr

Forum Moderator, 5523 Posts

19 March 2009 at 1:27pm

Nice work bgribaudo looks patch sounds like an awesome addition to the SSViewer!

Go to Top