Features Breakdown: Product Cards Slideshow

This section creates a carousel of "split-layout" cards, where each slide features text content on one side and an image on the other. It is designed for high-impact product highlighting or promotions, offering extensive control over gradients, typography, and responsive behavior.

Card Layout & Geometry

• Split Layout: Adjustable split between text and image (e.g., 40% Text / 60% Image).

• Image Position: Option to place the image on the Left or Right of the text (Desktop).

• Aspect Ratios: Independent control for Mobile and Desktop ratios (21:9, 16:9, 3:2, 4:3, 1:1, 4:5, 9:16).

• Styling: Adjustable Card Corner Radius and Drop Shadow (CSS value).

• Backgrounds:

  • Global: Set a default Solid Color or Gradient for all cards.

  • Per-Slide: Option to override the background on specific slides to create a colorful, varied sequence.

Slide Content & Typography

• Content Alignment: Fully independent alignment controls (Vertical and Horizontal) for both Mobile and Desktop.

• Responsive Sizing: Pixel-perfect font size sliders for Desktop and Mobile for the Heading, Subheading, Badge, and Button.

• Text Blocks:

  • Heading: Custom text with color override.

  • Subheading: Rich Text support with color override.

  • Badge: Optional tag (e.g., "New") with customizable background (Solid/Gradient), border, and text color.

Images & Media

• Dual Source: Upload separate images for Desktop and Mobile for perfect art direction.

• Smart Fallback: If a Desktop image is missing, the Mobile image is used automatically (and vice versa).

• Focal Point: Adjust image alignment (Top, Center, Bottom, etc.) within the card frame.

Buttons (Per Slide Customization)

• Independence: Unlike many sections, this allows each slide's button to have unique colors and borders to match the specific card background.

• Styling: Supports Solid Colors or Gradients, custom border width/color, and text color.

• Global Shape: A global setting for Button Radius ensures consistency across slides.

Slideshow Behavior

• Navigation: Pagination lines (dashes) with customizable height, gap, and active/inactive colors.

• Interaction: Supports Swipe gestures on Mobile and Drag gestures on Desktop.

• Autoplay: Configurable interval (speed) and "Start on View" logic (only starts playing when the user scrolls the section into view).

• Transition: Smooth crossfade effect with adjustable duration.

Wrapper & Visibility

• Section Width: Choose between Theme Page Width, Standard Container, or Custom Max-Width with adjustable padding (independent for Mobile/Desktop).

• Device Visibility: Toggle to show the section on Mobile Only, Desktop Only, or Both.