can edit width of image when it in text component?

[user07108]

does aem has any native function for the user to edit width of image when it in text component manually

[B_Sravan]

Hi @user07108 ,

Width of the image inside the text component?   click on the source edit button and you can paste your html there and hence you can edit your height and width attributes. 

 
There's one problem here though, the image path might not get shortened on dispatcher/production.

I would suggest you to use the core component image which comes with renditions and you can make use of layout system.
Thank you.

-Sravan

[Jörg_Hoh · Accepted solution]

Normally you should not deal with these things directly, because the system provides you with an overall style every text and image should adhere to. Manual "tweaks" is likely to cause problems because of broken layouts.

[Aditya_Chabuku]

Hi @user07108 , It might cause you problems in future if you just add an Image in the HTML section of the Text Component. Instead, Develop a custom Image Component with JS handling dimensions. 

here I give you one such HTL code, please write your own JS & CSS as per your needs.

<div class="ColumnImage">
    <div class="imagecontainer"
        data-sly-use.image="com.adobe.cq.wcm.core.components.models.Image"
        data-sly-use.templates="core/wcm/components/commons/v1/templates.html"
        data-sly-test="${image.src}">${image.src}"
    </div>
</div>
    
<div class="ColumnText">
    <div class="textcontainer col-md-12 text-center">
        <h2>${properties.textTitle}</h2>
    </div>
</div>

~Hope this helps,

Aditya.Ch