Core Docs - Digital Publishing - Understand File Types
Rock Version: v19.0
Last Modified: 2025-10-16 4:44 PM
Image File Type
Serving your image files with the right dimensions is the simplest way to improve your website performance. It means less load on your site and faster images for your users. And with Rock, it couldn't be easier!
We think you’ll find the information below helpful and straightforward on how to use these tools for your best benefit. Oh, and if you are anything like us you might even find yourself having a little too much fun with your content. So, we will spare you and only go over the primary and most useful commands, knowing that this is a powerful tool where the sky is the limit.
Before anything – you have to set up an image attribute on your content channel or whatever it is you are standardizing such as page attributes.
Alright let's look at an example. Let's say you have a content channel with an item attribute named "Public Photo." Normally in your Lava you would add that image to your mark up like this:
GetImage.ashx?Guid={{ detailImageGuid }}
Here we see the original photo without any resizing.
Let's make this image smaller. GetImage.ashx?Guid={{ detailImageGuid }}&w=468&h=232
Those are super basic. Let’s add some extra commands. Say we always want the images to be a certain aspect ratio and if the image uploaded doesn’t meet that size, then a black border will fill in the rest of the area and the image will align to the top center. Our command would then look something like this:GetImage.ashx?Guid={{ detailImageGuid }}&w=768&h=432&mode=pad&bgcolor=black&anchor=topcenter&quality=100
That’s just a glimpse of how you can use these tools to standardize your content.
Commands
Width and Height
If only the width and height is set, then the aspect ratio of the image is maintained and defaults to the width size.
Modes
&mode=
Background Color
&bgcolor=
Named colors and hex values are supported.
Alignment
&anchor=
The alignment parameter allows you to specify the starting location within the size parameters. Valid values are:
topleft
topcenter
topright
middleleft
middlecenter
middleright
bottomleft
bottomcenter
bottomright
Crop
&crop=
Resizes the image to fill the width and height dimensions and crops any excess image data. The resulting image will match the width and height constraints without distorting the image. Cropping is used by coordinates, x1, y1, x2, y2.
Disable Optimizations
&disableoptimizations=true
Allows disabling resizing by adding disableoptimizations=true to the query string. This allows a CDN or image optimization service to do the resizing. Without this, the query string parameters for resizing will often conflict causing both Rock and the CDN to resize and optimize the file.
Compression and Performance
Compression helps remove unnecessary data from your images, while providing the control you need for high quality at small sizes.
More Info
For a list of even more image resizing options, checkout this website: ImageResizer.