topic Re: How to get asset path in javascript? in CMS Development

How to get asset path in javascript?

jinwoooh — Wed, 17 Mar 2021 15:01:14 GMT

I need to implement animation on our website, and we are trying to use 3rd party library.

The problem is that I don't know how I can get the asset file path from a javascript file.

I know that get_asset_url works on hubl, but it doesn't work on a javascript file.

Any idea how to get an asset path from js file?

Re: How to get asset path in javascript?

Anton — Wed, 17 Mar 2021 19:31:38 GMT

Hi @jinwoooh,

if you want to use an external JS file in a module/template I recommend you to use the require_js function.

How to get the asset path of your js file:

copy/paste the URL(if it has one) into the require_js function and place this snippet into the header/footer (where it should be placed) // most likely the easiest solution
create a new js file in the design-manager and paste the whole js code into it - save it - right-click on the file and select "copy path" - place it into the require_js function // great if you wnat to modify the file; HubSpot will automaticly minify the file if it's not minified
create a new js file locally and upload it to the file-manager(not design-manager) copy the path and place it the require_js function // it's okay but not really recommended since HubSpot won't minify it
There is another option but since this is quite "the worst way possible" I won't tell you 😁

hope this helps,

best,

Anton

Re: How to get asset path in javascript?

jinwoooh — Wed, 17 Mar 2021 19:39:43 GMT

Hi @Anton ,

I get that we can get a js file path, but I want to get a json file path that I uploaded to module/template from a js file.

My js code looks like this,

var st = bodymovin.loadAnimation({
container: document.getElementById('st'),
renderer: 'svg',
loop: true,
autoplay: true,
// animation file path
path: 'JSON FILE PATH HERE!!!!!!'
})

and I don't know what's the best way to get json file path from here.

Thanks,

Jinwoo

Re: How to get asset path in javascript?

MEl-ghorfi — Thu, 15 Sep 2022 23:45:12 GMT

I had the same issue, check it out here: https://medium.com/@elghorfi.med/get-shopify-asset-url-in-javascript-33dd5c6ff1d7

Re: How to get asset path in javascript?

Anton — Tue, 20 Sep 2022 14:45:35 GMT

Hi @jinwoooh,

if get_asset_url doesn't work:
Try to write it like this:

basically replacing the first folder with "..". This can help sometimes.

Another possible way could be to upload your JSON file to the file manager and get the URL from there.

best,

Anton