CMS Development

DavidFJones
メンバー | Platinum Partner
メンバー | Platinum Partner

Accessing Image Files in CMS Theme Development

解決

Hello,

How does one access image files while making a custom CMS theme?

I am able to upload the images using the local development tools, but can't seem to find how to get these files onto the page.

I have tried using 

get_asset_url('')

but understand now that this is only used for js, html and css files.

Thank you

0 いいね!
1件の承認済みベストアンサー
stefen
解決策
キーアドバイザー | Solutions Partner
キーアドバイザー | Solutions Partner

Accessing Image Files in CMS Theme Development

解決

@DavidFJones when using the get_asset_url inside a HubSpot theme, you can use a relative path to the image file. Let's say your theme is structured like so:

  • /images
    • example.jpg
  • /templates
    • home.html

if you wanted to reference the example.jpg inside the home.html you would use the function like so:

{{ get_asset_url('../images/example.jpg') }}
Stefen Phelps, Community Champion, Kelp Web Developer

元の投稿で解決策を見る

3件の返信
daveroma
トップ投稿者 | Platinum Partner
トップ投稿者 | Platinum Partner

Accessing Image Files in CMS Theme Development

解決

Hey @DavidFJones 

 

get_asset_url() is the move - you may just need to back up a directory or 2...

 

Here's some real-world HTML + HubL code I used to render an image in my HubSpot Theme

<img src="{{ get_asset_url('../../images/img-meeting-default.png') }}" alt="meeting-calendar">

Let me know if this helps!

 


Dave Roma,
HubSpot CMS Developer

Build a revenue generating website on HubSpot without a developer using The Generator Theme

0 いいね!
stefen
解決策
キーアドバイザー | Solutions Partner
キーアドバイザー | Solutions Partner

Accessing Image Files in CMS Theme Development

解決

@DavidFJones when using the get_asset_url inside a HubSpot theme, you can use a relative path to the image file. Let's say your theme is structured like so:

  • /images
    • example.jpg
  • /templates
    • home.html

if you wanted to reference the example.jpg inside the home.html you would use the function like so:

{{ get_asset_url('../images/example.jpg') }}
Stefen Phelps, Community Champion, Kelp Web Developer
TRooInbound
キーアドバイザー

Accessing Image Files in CMS Theme Development

解決

Hi @DavidFJones 

 

You can use direct file manager path here, no need to use this type of path as an image is editable from page edit mode. so issues to adding static file manager path here. 

See this screenshot - https://prnt.sc/t39fu8

 

FYI - need to add image path in single quote.

 

We hope it works for you.

Did our post help answer your query? Help the community by marking it as a solution.

 

Thanks,

Team TRooInbound