Image Upload Guidelines for Your Slider Widget

In this article, we’ll share some tips for uploading images to your Slider widget. Learn the best image sizes, formats, and resolutions to showcase your photos. Let’s get started and make the most of your Slider!

Supported Image Formats

The Slider widget supports several image formats. These formats are suggested:

.jpeg	.png	.svg	.gif	.webp

Recommended Image Size, Resolution, and Dimensions

Here are some tips to optimize your images:

Optimal Resolution: Full HD (1920 x 1080 px) works well for most uses.
Maximum Resolution: Quad HD (2560 x 1440 px) is perfect for high-quality images.
Mobile Consideration: Lower resolutions work well for mobile devices, improving speed and saving data.
File Size: We suggest keeping images under 1 MB for faster loading and a smoother user experience.

Image Slide Options

The Slider widget offers three types of slides: Slide Builder, Image Slide, and Video Slide. Below, we’ll take a closer look at the two slide types that use images:

Slide Builder
Image Slide

Slide Builder

This slide type can include text, images, buttons, forms, and more. Images can be added in two ways:

Background – This image serves as the slide’s background, with text and other elements displayed on top of it.
Image Block – An additional image that appears on top of the background along with other content.

Click the toggles below to learn more about each option:

Background

To upload a background image, go to the Slide Builder editor → Background, and choose Image. Upload your image as a file:

Make sure the image ratio (for example, 3:2) matches the widget's Width and Height settings (e.g., 1030 x 700 px). This helps the image fit properly without being cropped:

The Stretch Background option makes the widget and background image fill the width. Keep in mind that square or vertical images may get cropped.

Image Block

You can add an image block by clicking ➕ Add Element in the Slide Builder and selecting Image Block. Upload your image using a file or direct link, and choose the layout you prefer.

Here's a screencast illustrating it in more detail:

The original image proportions are kept, so if you want to add a square image, use dimensions like 200 x 200 px or 300 x 300 px.

While you can’t crop images after uploading, you can resize them by adjusting the Image Area/Scale in the Customize → Image Layout settings:

Image Slide

The Image Slide shows a single full-screen image. Upload it as a file or use a URL:

You can upload images in any proportions and choose the Fitting Mode:

Fit – Displays the entire image in its original proportions within the slide area.
Fill – Fills the whole slide area, cropping the image if necessary.

Alt Tags Support

The Slider widget supports Alt Tags to improve accessibility and SEO. Please note that background images, which are purely visual, do not require Alt Tags.

You can add Alt Tags only to the Image Block images in the Slide Builder type. Here’s how:

In the Slide Builder, click on the Image Block:
Enter your desired text in the Image Alt Text field:

We hope these tips help you optimize your image uploads for the Slider widget! 🚀

FAQ

Can I edit images after they have been uploaded?

Direct editing like cropping isn’t possible.

How can I optimize my images for faster loading times?

Consider compressing your images using tools like Kraken.io, Squoosh.app, or ImageCompressor.com.

Will the widget automatically resize images to fit different screen sizes?

Yes, the widget automatically resizes images to fit different screen sizes smoothly.