In my cards container component has multifield with title ,description,image etc Now there is one requirement that we need to extend the core image so that it will use image.html to render. Since card component will be having multiple cards with images how can i make sure that for images it is using image.html by extending v3 image
Solved! Go to Solution.
Topics help categorize Community content and increase your ability to discover relevant content.
Views
Replies
Total Likes
To extend the Core Image component for your multifield in the card component:
1. Create a Custom Image Component: Extend the v3 image component and override image.html to customize the image rendering.
2. Modify the Image HTML: In your custom image.html, define the custom rendering logic for images (e.g., custom classes or attributes).
3. Update Multifield: Make sure your card component’s multifield references the custom image component so it uses your extended image.html when selecting images.
4. Example:
- Custom component path: /apps/your-project/components/image
- In multifield, reference: sling:resourceType="your-project/components/image"
This ensures your card images use the custom rendering from image.html.
Please check article from @aanchal-sikka
To extend the Core Image component for your multifield in the card component:
1. Create a Custom Image Component: Extend the v3 image component and override image.html to customize the image rendering.
2. Modify the Image HTML: In your custom image.html, define the custom rendering logic for images (e.g., custom classes or attributes).
3. Update Multifield: Make sure your card component’s multifield references the custom image component so it uses your extended image.html when selecting images.
4. Example:
- Custom component path: /apps/your-project/components/image
- In multifield, reference: sling:resourceType="your-project/components/image"
This ensures your card images use the custom rendering from image.html.
Views
Likes
Replies
Views
Likes
Replies