Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Extend AEM Core Carousel Component

rahuls80678827
Level 3
Level 3

I am working on a business requirement to show 3 images per slide using Core Carousel Component.
I have extended Core Carousel component to achieve this but I am stucked now with the Panel Implementation.

 

For ex:

If I have 5 images and click on 2nd image from the panel then it should go to 2nd image but currently it goes to 2nd slide (instead of 2nd image)

rahuls80678827_0-1580233066816.png


Has anyone tried to achieve this? Any help would be really appreciated.

 

Thanks
 

 

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

5 Replies
mrobinson
Level 2
Level 2

Just curious, but have you considered having a 'Container' component be the 'Slide', and then you can place 3 Image components within each slides' container? That way you would only have 2 panels, but would still be able to manage/configure the images individually.

rahuls80678827
Level 3
Level 3
I have added cq:isContainer="{Boolean}true" in the Carousel's content.xml for carousel component to behave like a container.
mrobinson
Level 2
Level 2
Right, but what you can do is select the Adobe Core 'Container' component as the 'Slide' of your carousel. Doing so would allow you to place any number of other components in that 'Slide', such as 3 Image components, and those could be resized using the layout editor of the Container.
rahuls80678827
Level 3
Level 3
Yeah, I tried to add "Core Container" Component inside "Carousel" Component as well and then insert "Image" components in it.
rahuls80678827
Level 3
Level 3

Yeah, I tried to add "Core Container" Component inside "Carousel" Component as well and then insert "Image" components in it. But it's not fulfilling the purpose:

 

  1. We have to show 3 images/items per slide but in above case, user will be able to insert more than 3 images within "Core Container" component. How can I restrict them?
  2. If user has included 5 images in total, then each slide should have 3 images that is:
    • 1st, 2nd & 3rd Image = 1st Slide
    • 3rd, 4th & 5th Image = 2nd Slide