Understanding Photo URLs

Every photo uploaded to Osmek gets resized to several different sizes, based on the image size settings in the content bin it was uploaded to.

You can also dynamically render an image at any size just through it's URL. Here's how it works.

Photo URLs

A Photo URL looks like this


Photo URLs consist of 4 parts.

  1. The photo server - http://photos.osmek.com
  2. The photo ID - 103805
  3. The size of the photo - "l"
  4. The file type - jpg

To render an image, only the first two parts are required.

http://photos.osmek.com/103805 - renders the image as it was originally uploaded.
http://photos.osmek.com/103805.l - renders the image at size "l", in the original file type.
http://photos.osmek.com/103805.l.jpg - renders the image in jpg format, regardless of the format it was uploaded in.
http://photos.osmek.com/103805.l.png - renders the image in png format, regardless of the format it was uploaded in.

Photo Sizes

Photo sizes are defined with three options:

  • Width - An integer, in pixels
  • Height - An integer, in pixels
  • Crop - 0 or 1 (true or false, defaults to 0)

When crop is set to 1, the image will be scaled and cropped to the exact width and height specified. When crop is set to 0, the image will be scaled so that the largest side matches the corresponding width or height definition.

Each content bin can define it's own list of image sizes. By default, Osmek stores 3 copies of every image uploaded.

o - Original image
l - Large image (700x700x0)
sq - Square thumbnail image (70x70x1)

Images sizes can be defined by a size extension, or a size definition

// These are the same image

Images can be called at any size by adjusting the size definition in the URL

http://photos.osmek.com/103805.100x100x1 - Image scaled and cropped to exactly 100x100px
http://photos.osmek.com/103805.240x120 - Image scaled to fit within 240x120px (not cropped)
http://photos.osmek.com/103805.1000x1000 - Image scaled to fit within 1000x1000px (not cropped)

*NOTE: Images will never be scaled up past their original dimensions. 
Example, if an image is originally 500x400px, the URL http://photos.osmek.com/103805.1000x1000 will return an image which is 500x400px.


URL: http://photos.osmek.com/103805.sq

Rendered Dimensions: 70x70

URL: http://photos.osmek.com/103805.100x100x1

Rendered Dimensions: 100x100

URL: http://photos.osmek.com/103805.240x120

Rendered Dimensions: 180x120

URL: http://photos.osmek.com/103805.l

Rendered Dimensions: 700x467

URL: http://photos.osmek.com/103805

Rendered Dimensions: 1024x682

URL: http://photos.osmek.com/103805.2000x2000

Rendered Dimensions: 1024x682