Almost EVERYONE who tried headless systems said they saw benefits. Download the state of CMS now!

Storyblok now on AWS Marketplace: Read more

O’Reilly Report: Decoupled Applications and Composable Web Architectures - Download Now

Empower your teams & get a 582% ROI: See Storyblok's CMS in action

Skip to main content

Access image dimensions of assets in JavaScript

  • FAQ
  • Access image dimensions of assets in JavaScript

Below you can find an example of how to extract the width and height of one image URL provided by a Storyblok asset URL.

let url = "//a.storyblok.com/f/51376/664x488/f4f9d1769c/visual-editor-features.jpg"

console.log(url.split('/')[4], 4) // space id
console.log(url.split('/')[5], 5) // dimension string
console.log(url.split('/')[5].split('x')) // width and height as array

let dimensions = {
  width: url.split('/')[5].split('x')[0],
  height: url.split('/')[5].split('x')[1]
}

console.log(dimensions)