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.

in place editing doesnt make effect

Avatar

Level 2

Hi, I have on component rotate, crop and etc. but when I try to submit changes, for example rotate to left my image stay as it is.

I'm adding image on this way:

 

 

<div class="cmp-cardcomponent__image" data-image="url(${properties.fileReference @ context='text'})"
     style="background-image: url(${properties.fileReference @ context='text'});"></div>

 

Before submiting:

 

stefanjank_0-1653557133004.png

 

And after I press submit
You can see that my pitcure is not rotated:

 

stefanjank_1-1653557158899.png

But, when I use this:

 

 

<div data-sly-use.image="com.adobe.cq.wcm.core.components.models.Image">
    <div class="cq-dd-image ">
        <img src="${image.src}"/>
    </div>
</div>

 

Rotate is working, but I now lose all css styles, no one is working. I tried to add it like this:

 

<div data-sly-use.image="com.adobe.cq.wcm.core.components.models.Image">
    <div class="cq-dd-image cmp-cardcomponent__image">
        <img src="${image.src}"/>
    </div>
</div>

 

But doesnt work. Ass you see I added my cmp-cardomponent__image in div class

Someone to help?

 

 

2 Replies

Avatar

Community Advisor

Hi @stefanjank ,

 

It seems the issue is with your CSS. Try to give max-height and check, Because in the 2nd screenshot rotate is working but the image is getting cropped. If possible then please share your CSS snippet?. So that I can try to reproduce it.

Avatar

Level 2

Rotate isn't working. Original picture is people are in normal position, then first ss is when I rotate picture and click submit and second ss is how picture is looking after I click submit, as you can see that crane or something is in normal position, not rotated.