Slideshow

The Slideshow is the centerpiece of your page. Athora provides a powerful, motion-focused slideshow that supports image and unique scrolling animations to make a strong first impression.

How do I control the height of the slideshow?

You can set different heights for desktop and mobile to ensure the perfect aspect ratio.

• Desktop: In the section settings, use Image height to choose between Fill screen height (immersive) or Adapt to image (respects your original file size).

• Mobile: Use the Mobile image height setting. You can set a specific Fixed height using the slider (e.g., 450px) to prevent the banner from taking up too much vertical space on small screens.

Can I use different images for Mobile and Desktop?

Yes, this is highly recommended for optimization.

1. Click on a specific Slide block.

2. Under Image, upload your desktop version.

3. Under Mobile image, upload a portrait-oriented version. If you leave this blank, the desktop image will be used.

4. Note: You can also switch the Media type to Video if you prefer a dynamic background.

How do I change the slide transition style?

In the section settings under Transition type, you can choose:

• Slide: Standard horizontal movement.

• Fade: Smooth dissolving effect.

• Overlay: Layered transition effect.

How do I enable the "Shrink" scrolling effect?

Athora features a signature animation where the banner slightly reduces in size as the user scrolls, creating a premium feel.

1. Go to the Slideshow section settings.

2. Scroll down to Shrink animation.

3. Toggle Desktop shrink on scroll to On.

4. You can also enable Reverse shrink animation for a different visual style.

Slide item

What content can I add to a slide?

You build your slide content using Blocks. Click + Add block inside a Slide to add:

• Heading: The main title.

• Sub text: For descriptions.

• Group button: To add Call-to-Action buttons.

• Spacer: To add breathing room between elements.

How do I change the slide transition style?

In the section settings under Transition type, you can choose:

• Slide: Standard horizontal movement.

• Fade: Smooth dissolving effect.

• Overlay: Layered transition effect.

How do I position the text and buttons?

You can place your content exactly where it fits best over the image.

• Positioning: Inside a Slide block, use Desktop content position (e.g., Middle left) and Content position to align your text.

• Max Width: Use the Content maximum width slider to control how wide the text block stretches.

• Mobile Layout: If your text covers the image on mobile, go to the main section settings and check Stack content below image to move the text underneath the banner for better readability.