Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Difference in Component on Local SDK vs RDE

Avatar

Level 4

Hey guys,

 

I have been tweaking the OTB teaser component and been trying to validate it on my local and RDE.

The local output is as below -

Cross_Leaf_0-1728463535195.png

 

While on RDE the image tag in HTML is not loading as seen below -

Cross_Leaf_1-1728463578921.png

We're pushing the code with aio-plugin and the changes are reflecting promptly but the HTML for image which is defined in Sightly as below is coming in local but not RDE

<div class="image-container">
   <div class="teaser-image">
      <sly data-sly-call="${imageTemplate.image @ teaser=teaser}"></sly>
   </div>
</div>


Any pointers for the same?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Can you send your dialog.xml and the dialog screenshots?
Like @arunpatidar mentioned you want to check whether the checkbox for "Inherit featured image from page" is selected or not. Ideally if you are configuring the image then it should be unchecked.

 

Hope this helps!
Rohan Garg

View solution in original post

7 Replies

Avatar

Community Advisor

Hi @Cross_Leaf ,

 

Inspect the image element in RDE and see what you are seeing for image url if AEM is shortening the image src path on publish environment, you can confirm that by looking at Day CQ Link checker Transformer on the OSGI configs.

Then you need to match those rule with a rewrite or a mapping in dispatcher

RewriteCond %{REQUEST_URI} !^/apps
RewriteCond %{REQUEST_URI} !^/bin
RewriteCond %{REQUEST_URI} !^/content
RewriteCond %{REQUEST_URI} !^/etc
RewriteCond %{REQUEST_URI} !^/home
RewriteCond %{REQUEST_URI} !^/libs
RewriteCond %{REQUEST_URI} !^/saml_login
RewriteCond %{REQUEST_URI} !^/system
RewriteCond %{REQUEST_URI} !^/tmp
RewriteCond %{REQUEST_URI} !^/var
RewriteCond %{REQUEST_URI} (.html|.jpe?g|.png|.svg)$
RewriteRule ^/(.*)$ /content/${CONTENT_FOLDER_NAME}/$1 [PT,L]

 

 

-Tarun

Avatar

Level 4

The image tag itself is not rendering - The problem I think is not related to the image URL.

Avatar

Community Advisor

Hi @Cross_Leaf 
The image tag will render only if there is an image imageResource either from DAM or from page properties

 

 

media_1cf5aa7aea4affd09a08d5a6dae89602e28c4dc52

 

 

<sly data-sly-template.image="${@ teaser}">
<div class="cmp-teaser__image" data-sly-test="${teaser.imageResource}" data-sly-resource="${teaser.imageResource @ wcmmode=disabled}"></div>
</sly>

 

https://github.com/adobe/aem-core-wcm-components/blob/main/content/src/content/jcr_root/apps/core/wc... 



Arun Patidar

Avatar

Level 4

@arunpatidar- the issue's due to the inherit feature image from page being selected even while I have dropped the photo as @Rohan_Garg has suggested. Ideally if the checkbox is enabled and the image is dropped - shouldn't it choose the selected image as the one with higher precedence?

Avatar

Correct answer by
Community Advisor

Can you send your dialog.xml and the dialog screenshots?
Like @arunpatidar mentioned you want to check whether the checkbox for "Inherit featured image from page" is selected or not. Ideally if you are configuring the image then it should be unchecked.

 

Hope this helps!
Rohan Garg

Avatar

Level 4

The issue is due to the checkbox for inheriting image being selected - Since no image is present it doesn't render any image. But my query is if the image is not present and we have manually inserted the image shouldn't that take a higher priority in terms of inheritance?