Use of currentDesign.path in HTL for referencing images in AEM 6.4? | Adobe Higher Education
Skip to main content
Level 3
November 9, 2018
Répondu

Use of currentDesign.path in HTL for referencing images in AEM 6.4?

Since the recommendation to move designs from /etc/designs to /apps/settings/wcm/designs I would like to know what the preferred approach to making a request to an image in that design from HTL

eg we have two designs and in both there is a logo.jpg file. We want to be able to swap the design at the page level using the designPath

If we follow the guides in this Designs and the Designer   it generates a link with the /apps/settings/wcm.........../logo.jpg Shouldn't this be coming through some kind of proxy like etc.clientlibs?  If so how best to structure the design tree and how to reference the image from HTL?

Thanks

Ce sujet a été fermé aux réponses.
Meilleure réponse par Mark_Adamcin

We've solved this in a large upgrade project by creating a BindingsValueProvider service akin to com.day.cq.wcm.scripting.impl.WCMBindingsValuesProvider that wraps the currentDesign and the resourceDesign with a DesignWrapper class (implements Design) that overrides getPath() to return the /etc.clientlibs/ proxy-prefixed path instead, for any design paths under /apps/settings/wcm/design.

5 commentaires

shubhaga1
November 9, 2018

You have to convert any CSS, JavaScript and static resources in the Design to a Client Library with allowProxy = true. for eg. check

/libs/settings/wcm/designs/dashboards/static

Restructuring guidance

For any Designs that are managed in SCM, and not written to at run-time via Design Dialogs.

  1. Copy the designs from the Previous Location to the New Location (/apps).
  2. Convert any CSS, JavaScript and static resources in the Design to a Client Library with allowProxy = true.
  3. Update references to the Previous Location in the cq:designPath property.
  4. Update any Pages referencing the Previous Location to use the new Client Library category (this requires updating Page implementation code).
  5. Update AEM Dispatcher rules to allow the serving of Client Libraries via the /etc.clientlibs/.. proxy servlet.
For any Designs that NOT managed in SCM, and modified run-time via Design Dialogs.
  • Do not move author-able Designs out of /etc.

Level 3
November 9, 2018

Thanks. I have done some of the movement to proxied clientlibs which works for some of the css and js.

However the area I am really struggling with is how to reference an image in a design from an htl file. what is the actual code?

pre HTL it would be <%= currentDesign.getPath() + "/static/img/icon.gif %>

HTL i would have assumes something like

${currentDesign.path}/static/img/icon.gif

but if the designs are in /apps/settings/wcm/design/project the link generated is /apps/settings/wcm/design/project/static/img/icon.gif

Mark_AdamcinRéponse
November 9, 2018

We've solved this in a large upgrade project by creating a BindingsValueProvider service akin to com.day.cq.wcm.scripting.impl.WCMBindingsValuesProvider that wraps the currentDesign and the resourceDesign with a DesignWrapper class (implements Design) that overrides getPath() to return the /etc.clientlibs/ proxy-prefixed path instead, for any design paths under /apps/settings/wcm/design.

Level 3
November 12, 2018

Mark,

Thanks for this - I think I basically understand.

This does seem to be an omission from the core code. com.day.cq.wcm.api.designer.Design not having a getProxyPath() method

smacdonald2008
Level 10
November 12, 2018

Nice response Mark - thank you!