Embedding Carousel Experiences

One option in the Experience Canvas is around creating carousels as a separate experience and then embedding that experience into a parent one. Please note that embedding a carousel will require an iframe to load the experiences. Because an iframe is required, a carousel will not load as quickly as an experience without an iframe. Therefore, it is often recommending to put embedded carousels below the fold, so they aren't visible during the initial load. If you encounter any difficulties embedding a carousel or have any questions, I recommend reaching out to support@getfastr.com for assistance.

For instructions on creating carousels, please refer to the following article:
Fastr Frontend Experience Canvas: Multi Scene Experiences
Fastr Frontend Experience Canvas: Overlay Widgets

To embed a carousel, please follow the below steps:

1. As a first step, you'll need to copy the embed code of the carousel experience which we'll use to embed the carousel in the main experience. Please make sure that the carousel has been published and is live. Click on the "Copy Code" option to copy the embed code for the content slot with your carousel:
   
   
   
2. Next, you'll want to navigate to the experience canvas for your parent experience. Add an HTML widget to your canvas. You'll want to make sure that the aspect ratio for your HTML widget matches the ratio for the carousel experience. In my example, my carousel was 400x250 pixels. You can see that I've made my HTML widget the same size:
   
   
   
   
   
3. After creating the widget you can paste the copied code into the HTML code section. You'll notice a live preview of the carousel will appear, which can help with sizing your content: 
   
   
   

After adding the code, your embedded carousel will be all set. If you have any issues, please reach out to support@getfastr.com