Revolution Slider Img Cutoff Guidance

Support
#1

Hello,

I have a Revolution Slider Carousel on this page https://sandbox.zivelo.com/products/hardware, and the bottom section of the image is cut off, and a lot of the carousel is cut off on mobile (see attached images). Can you point me in the direction of how I can make it appear cleaner (not cut off) on desktop and mobile?

Thank you!

#2

Hi Mary,

Thank you for reaching out to us. I checked your page and it looks like you’ve enabled the parallax effect for the slider. Try turning it off and see if this resolves the issue. To learn more about parallax and scrolling effects, please check out the documentation here:

https://www.themepunch.com/revslider-doc/parallax-3d/
https://www.themepunch.com/revslider-doc/scroll-effects/

Let us know how this goes!

#3

I turned off parallax and it’s still cut off on the bottom and on mobile. Is there another way to define the viewing/image area?

#4

Hi Mary,

Please navigate to Slider Settings under the Slide Layout enable the Custom Grid Size and define your Grid size (width and height) for every screen size.



Custom Grid Sizes

Cheers!

#5

I have done that, but the very bottom of the image is slightly cut off by the previews on the bottom. is there a way to add a little bit of padding to the bottom of the image?

#6

Hi,

You can try adding a padding to your carousel.

Please check screenshot below

For more information kindly refer to the link below

https://www.themepunch.com/revslider-doc/carousel/

Hope that helps

#7

I think that controls the carousel padding in general. I’m trying to control the padding on the bottom of the image vs the bottom’s preview slides, so the bottom of the picture won’t be cut off by the preview slides. the slider is 2/3 of the way down this page: https://sandbox.zivelo.com/products/hardware/ to see what i’m talking about.

#8

Hello Mary,

Please set a minimum height to your slider.

If that does not help, please provide us the updated credentials of your site so that we can check your slider setup settings.

Cheers.

#9

I’ve experimented and still can’t quite get it right. Can you please review?

#10

Hi Mary,

I believe your issue is the thumbnail and the image is overlapping? The word Cutoff is kind of misleading. If so, please navigate to Slider Settings > Navigation > Thumbs and set the Vertical Offset to 0, or a negative value if you want to push those thumbnails downward.

Now the real cutoff issue is on the netbook screen or tablet screen (somewhere 980px to 1200px), to resolve that please edit each of your slides, under the Main Background > Source Settings set the Background Fit to 100% 100% or try the contain



Yes, your slides will look squeeze a bit, but it is how background-image work. If you don’t like that look, please separate your Text (Text Layer) from the background-image.

Hope it helps,
Cheers!

#13

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.