AEM Core Components

Carouselv1

Carousel allows a user to cycle through content panels. Slides of varying component type can be created.

GitHub

Technical Documentation

GitHub

Adobe

Using Core Components

Adobe Help Center

Examples

Image Slides

Carousel with three image components as child items.

Lava flowing into the ocean
Snowy mountain glacier
Gray lava rock formation 
    
    
  1. 
        jcr:primaryType:
        nt:unstructured
    
    2. 

  2. 
        jcr:createdBy:
        admin
    
    3. 

  3. 
        jcr:lastModifiedBy:
        admin
    
    4. 

  4. 
        jcr:created:
        
    
    5. 

  5. 
        autopauseDisabled:
        false
    
    6. 

  6. 
        delay:
        5000
    
    7. 

  7. 
        jcr:lastModified:
        
    
    8. 

  8. 
        sling:resourceType:
        core/wcm/components/carousel/v1/carousel
    
    9. 

  9. 
        autoplay:
        true
    
    10. 




    
        

    


    

        



    
        
            
            Lava flowing into the ocean
            
        
    
    
    



    








    
        
            
            Snowy mountain glacier
            
        
    
    
    



    








    
        
            
            Gray lava rock formation
            
        
    
    
    



    





        

            
            
            
            
        

        
    
            



        

    

    



    

    


    JSON

Teaser Slides

Carousel with three teaser components as child items.

Lava flowing into the ocean

First Teaser Title

Teaser Description

Snowy mountain glacier

Second Teaser Title

Teaser Description

Gray lava rock formation

Third Teaser Title

Teaser Description

    
    
  1. 
        jcr:primaryType:
        nt:unstructured
    
    2. 

  2. 
        jcr:createdBy:
        admin
    
    3. 

  3. 
        jcr:lastModifiedBy:
        admin
    
    4. 

  4. 
        jcr:created:
        
    
    5. 

  5. 
        autopauseDisabled:
        false
    
    6. 

  6. 
        delay:
        5000
    
    7. 

  7. 
        jcr:lastModified:
        
    
    8. 

  8. 
        sling:resourceType:
        core/wcm/components/carousel/v1/carousel
    
    9. 

  9. 
        autoplay:
        false
    
    10. 




    
        

    


    

        



    
    



    
        
            
            Lava flowing into the ocean
            
        
    
    
    



    



    

        
    

        First Teaser Title
    


        
    
Teaser Description




        
    

    




    









    
    



    
        
            
            Snowy mountain glacier
            
        
    
    
    



    



    

        
    

        Second Teaser Title
    


        
    
Teaser Description




        
    

    




    









    
    



    
        
            
            Gray lava rock formation
            
        
    
    
    



    



    

        
    

        Third Teaser Title
    


        
    
Teaser Description




        
    

    




    






        

            
            
            
            
        

        
    
            



        

    

    



    

    


    JSON

Automatic Transitioning

Automatic transitioning of slides can be enabled. The delay before transitioning to the next slide is also configurable. Pause and play buttons are displayed which allow stopping / continuing slide rotation.

Lava flowing into the ocean
Snowy mountain glacier
Gray lava rock formation 
    
    
  1. 
        jcr:primaryType:
        nt:unstructured
    
    2. 

  2. 
        jcr:createdBy:
        admin
    
    3. 

  3. 
        jcr:lastModifiedBy:
        admin
    
    4. 

  4. 
        jcr:created:
        
    
    5. 

  5. 
        autopauseDisabled:
        false
    
    6. 

  6. 
        delay:
        5000
    
    7. 

  7. 
        jcr:lastModified:
        
    
    8. 

  8. 
        sling:resourceType:
        core/wcm/components/carousel/v1/carousel
    
    9. 

  9. 
        autoplay:
        true
    
    10. 




    
        

    


    

        



    
        
            
            Lava flowing into the ocean
            
        
    
    
    



    








    
        
            
            Snowy mountain glacier
            
        
    
    
    



    








    
        
            
            Gray lava rock formation
            
        
    
    
    



    





        

            
            
            
            
        

        
    
            



        

    

    



    

    


    JSON

Auto-pause on Hover Disabled

The default behavior is to pause when hovering the carousel, and automatic transitioning is enabled. This can be disabled, which may be useful for certain use cases, such as a full screen carousel.

Lava flowing into the ocean
Snowy mountain glacier
Gray lava rock formation 
    
    
  1. 
        jcr:primaryType:
        nt:unstructured
    
    2. 

  2. 
        jcr:createdBy:
        admin
    
    3. 

  3. 
        jcr:lastModifiedBy:
        admin
    
    4. 

  4. 
        jcr:created:
        
    
    5. 

  5. 
        autopauseDisabled:
        true
    
    6. 

  6. 
        delay:
        5000
    
    7. 

  7. 
        jcr:lastModified:
        
    
    8. 

  8. 
        sling:resourceType:
        core/wcm/components/carousel/v1/carousel
    
    9. 

  9. 
        autoplay:
        true
    
    10. 




    
        

    


    

        



    
        
            
            Lava flowing into the ocean
            
        
    
    
    



    








    
        
            
            Snowy mountain glacier
            
        
    
    
    



    








    
        
            
            Gray lava rock formation
            
        
    
    
    



    





        

            
            
            
            
        

        
    
            



        

    

    



    

    


    JSON

Built with Core Components 2.3.0.