Image Path URL Encoding in Sightly | Community
Skip to main content
Level 2
July 31, 2023
Solved

Image Path URL Encoding in Sightly

  • July 31, 2023
  • 2 replies
  • 976 views

There is a container component developed having a image field to author a Background Image with sling:resourceType --> cq/gui/components/authoring/dialog/fileupload. When images with space in their name are drag and drop into the image field it is stored along with the spaces in the node. As the image properties are read in Sightly using properties.imagepath, the spaces in the image path is creating issue to display the image as background image. Is there a way to encode the URL of the image path in Sightly or to remove or replace the image path spaces in sightly (HTL). The image path stored in page is -- /content/dam/bhn/Flowers FTD Image.png .

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by SivakumarKanoori

@sayali1 : 

 

Using below Javascript function you can get the path for the image 

 

"encodeURI('/content/dam/bhn/Flowers%20FTD%20Image.png'); 

'/content/dam/bhn/Flowers%20FTD%20Image.png'

 

You can invoke this Javascript functionn from your sightly code.

 

Thanks 

Siva

2 replies

Saravanan_Dharmaraj
Community Advisor
Community Advisor
August 1, 2023
SivakumarKanoori
Community Advisor
SivakumarKanooriCommunity AdvisorAccepted solution
Community Advisor
August 1, 2023

@sayali1 : 

 

Using below Javascript function you can get the path for the image 

 

"encodeURI('/content/dam/bhn/Flowers%20FTD%20Image.png'); 

'/content/dam/bhn/Flowers%20FTD%20Image.png'

 

You can invoke this Javascript functionn from your sightly code.

 

Thanks 

Siva

Thanks,Siva