Slide show

The Slideshow section is a fantastic way to showcase eye-catching images, videos, or promotional content. It’s ideal for running promotions or highlighting special offers with fully customizable slides. Create stunning visuals to captivate your customers and make your storefront stand out.

How to Add the Slideshow Section

Go to your Theme Editor by clicking Customize on your theme.
In the left-hand panel, click Add section.
Select Slideshow from the list of sections.
Once added, you can start customizing your slideshow!

Click on Slide show for the general settings

Full Width	Want your slideshow to stretch across the whole screen? Just enable the Full Width setting, and you’ll get a sleek, modern look that spans edge to edge.
Media Size	The Media Size setting lets you decide how your images fit into the slideshow. Here’s a quick guide: Adapt to Image: Your slideshow will automatically adjust to match the size of your image—no resizing, just the original dimensions. Small: Resizes your images to a smaller size while keeping their aspect ratio. Medium: Gives you a medium-sized display—not too small, not too big. Large: Offers a bigger view for your images, perfect for a bold look. Fill the Screen: Your image will stretch or crop to completely fill the slideshow container. It’s great for a dramatic, full-screen effect, though it might tweak the aspect ratio a bit.
Autoplay	Want to keep your slideshow flowing without having to click through? Toggle on Enable auto-rotate to make the slides transition automatically. Once enabled, you can use the Change slides every setting to adjust how long each slide stays on screen. This is done with a handy slider—so whether you want quick transitions or a slower, more relaxed pace, it’s super easy to customize. 🎥
Desktop Navigation Style	How do you want your slideshow navigation to look on desktop? Here are your options: Dash and Arrow: You’ll get arrows on the sides to switch slides and dashes at the bottom to show your position in the slideshow. Arrows: Just arrows on the sides—simple and clean. Dash: Only dashes at the bottom to show the current slide and total slides. None: No navigation at all for a super-minimalist style.
Appearance	The Appearance setting is shared across all sections, making it easier to maintain a consistent look and feel throughout your store. For more details on this, check out the [link].
Custom CSS	Add custom CSS for advanced styling.

Image Slide Block:

Now let’s talk about customizing your image slides. Here’s what you can do:

Image Width	Full Width: Want your image to fill the entire screen? This setting is for you! Half Width: Need a bit of balance? This setting makes your image take up half the screen, leaving space for other content.
Image Position	This settings is Only applicable when ‘image width’ is set to ‘half Left: Position your content to the left of the image. Right: Position your content to the right of the image.
Upload an Image:	For desktop, it’s best to upload an image with a resolution of 2880x1280 px to ensure it looks sharp and professional. For mobile, use an image sized 740x1100 px for the best display on smaller screens.

Text Slide Block

The Text Slide Block is perfect for displaying content without any images. You can easily customize it to fit your needs. Here's what you can modify:

Subheading	The Subheading appears above the main heading. It’s a smaller line of text that's perfect for adding additional context or a brief description that introduces or supports the main message of the slide.
Heading	The Heading is the main title of your slide. It's the most prominent text and serves to grab attention. Use it to clearly communicate the core message you want to convey.
Content (Description)	The Content is the body text that appears below both the subheading and heading. This is where you can provide more detailed information, describe a product or service, or share key points to ensure your audience gets the full picture.
Content Width	The Content Width slider allows you to adjust how wide the content will appear on the slide. You can drag it to the right to make the content wider or to the left for a more compact look, giving you control over the layout and presentation of your text.
Button Settings	When customizing your button, you’ll have the following options to choose from: Button Label The Button Label is the text that appears on the button. You can change it to anything you like—whether it's "Learn More," "Shop Now," or any call to action you want to use. Make it clear and engaging! Button Link The Button Link is where you’ll add the URL that the button will direct users to when clicked. You can link it to an external page, product, or any other location on the web. Open Link In This option allows you to choose where the link will open. If you want the link to open in a new tab, select New Tab. If you want the link to open in the same tab, choose Same Tab. This gives you control over how your audience navigates through your site. Use Outline Button Style Enabling the Outline Button Style gives your button a border and makes the background transparent. This can give your design a more minimal or modern look, making the button stand out without being too bold.

Video Slide Block

The Video Slider Block lets you showcase video content with a cover image, just like the Image and Text Slide blocks. You can customize the following options:

Video Width	Full: The video will stretch across the entire slide, filling up the whole space for a bold look. Half: The video will take up just half of the slide, leaving the other half open for additional content.
Video Position (Only available when Video Width is set to Half)	Left: The video will be on the left side of the slide, and your content will be on the right. Right: The video will appear on the right side of the slide, with content placed on the left.
Video Upload	Simply click Select to upload your video or choose one you already have. Your video will automatically play without sound and start right away for a smooth experience.
Cover Image	You can add a cover image for your video by clicking Select or picking from a selection of free images. For the best quality, we suggest using a cover image size of 2880x1280 px.

Common Content settings in Slider Blocks .

These settings are available for all blocks in the slideshow and let you customize your content to fit perfectly with your design:

Modify Title and Content	Change the title and content text to match the message you want to convey. This helps ensure the text aligns with the theme and purpose of your slide.
Adjust Content Width	This option is available in both Image and Video blocks when the image or video width is set to Full. It allows you to adjust how wide the content is to ensure it fits well with the full-width image or video, making the overall design look neat and balanced.
Edit Button Text or Link	You can change the text on your button to anything you like, and link it to an external page or URL. This helps direct users to where you want them to go.
Desktop Content Alignment and Positioning	Alignment: Decide where your content will appear on the image, video or text slide : left, center, or right. Positioning: Adjust where the content appears within the image, video or text slide—whether at the top, middle, or bottom—to make sure it fits your design.
Mobile Content Alignment and Positioning	Adjust the alignment and positioning for mobile devices so your content looks good on smaller screens. You can move text, buttons, and other elements to fit the mobile layout properly.
Add an Overlay	Available only for Image and Video blocks, the overlay helps improve the visibility of your content by darkening or lightening the background image or video. Hide Overlay in Desktop Enabling this option will show the overlay only on mobile layout. This is especially useful when the image width is set to half, ensuring the overlay doesn't clutter the design on larger screens while still enhancing visibility on mobile devices. Select Overlay Color Choose the color you’d like for the overlay to match your design and make the content more readable. Set Overlay Opacity Adjust the opacity of the overlay to control how much of the background image or video is visible. A lower opacity will show more of the background, while a higher opacity will make the overlay more prominent.
Color Scheme	Select a color scheme that complements your design. This ensures your content’s colors match the overall look of the slide, creating a cohesive and visually appealing presentation.