Skip to main content
au4liferz
au4liferz
Level 4
Oct 16, 2015 2:28 AM UTC
Solved

Custom Carousel/Slider component using Sightly

I have a requirement to develop a custom carousel using Sightly, but there really isn't a lot of documentation out there, and I'm not sure where to start, or exactly how to go about it. There are several good javascript carousel/slider components, and I'm wondering if I should try to use one of them, or simply develop it from scratch using Java/JSP. If anyone can summarize the steps, provide tutorials orany other links and material you can share, it would be greatly appreciated. The most important thing is to develop this component in a manner that embodies best practices such as a good separation of presentation and business logic, (MVC'ish architecture), and loose coupling from a styling perspective.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Lokesh_Shivalingaiah
Lokesh_ShivalingaiahAccepted solution
Level 10
Oct 16, 2015 2:28 AM UTC

Refer [1] to create a sightly template and read values from the dialog 

[1] https://helpx.adobe.com/experience-manager/using/creating-sightly-component.html

Refer [2] for multiple taglibs available in Sightly. It helps you to in #2 to loop through all the images and create div

[2] https://docs.adobe.com/docs/en/aem/6-0/develop/sightly.html

For #3, once you have read the values and created div, apply JS to get the carousel running.

View in thread

14 replies

Show previous replies
smacdonald2008
smacdonald2008
Level 10
Oct 16, 2015 2:28 AM UTC

Can I ask why use Sightly - not JSP? 

There are a lot of good plug-ins available that will let you use JS libs to achieve this use case. For example: 

https://helpx.adobe.com/experience-manager/using/custom-carousel-components.html

Translate
Titus_Roby_K
Level 2
Jun 4, 2018 2:40 PM UTC

Is there any OOTB working carousel component present in AEM which we could leverage ?
i did found carousel component present in We.Retail , but on using that component , it wasn't working as i expected to work.
Could you confirm, whether its working or not ? 

Translate
smacdonald2008
smacdonald2008
Level 10
Jun 4, 2018 3:02 PM UTC

Using Bootstrap carousel component works nicely in AEM: https://getbootstrap.com/docs/4.0/components/carousel/

Translate
Titus_Roby_K
Level 2
Jun 5, 2018 6:43 AM UTC

But i was wondering how to make We.retail or OOTB carousel component work ?
can it  be made work , is there any documentation for the same ?

Translate
Terms & ConditionsAccessibility statement

Loading footer...