Event Website Design
The second page of my website has two slides that I can fully view on RSVPify site, but when I preview it, those two slides are cut off. I've increased the image height but they're still cut off in the preview. help!
-
Official comment
Hi Debbie -
Thank you for reaching out. Happy to help!
Based on what you shared, it seems like you've added an image to the cover block in your event website. If the text on the cover image is getting cut off, and the preview when you're viewing the event on a desktop or mobile device, it is best to change the image format by going to Event Website Builder and clicking on the 'gear' tool icon in the top left-hand corner of the cover block.
I hope this was helpful. If any other questions come up, feel free to reach out!
Best,
The RSVPify Team -
Hi Debbie,
This usually happens due to how the RSVPify preview container handles responsive image scaling and section overflow. Increasing just the image height often causes the outer container to crop the content rather than expanding to fit it.
Here are a few steps to fix this:
Check Aspect Ratio & Container Settings: Instead of only increasing the image height, ensure the section/block layout is set to adapt to content height (Auto) rather than a fixed pixel height. If there is an image fitting setting, switch from Cover (which crops edges to fill space) to Contain or Fit, so the entire slide remains visible within the preview viewport.
Adjust Recommended Image Dimensions: RSVPify slides render best with standard widescreen aspect ratios (such as 16:9 or roughly 1920x1080px). If your slides are overly tall or vertical, the preview window will automatically slice the bottom off to preserve page structure. Try resizing the original slide graphics to a standard horizontal ratio before re-uploading.
Check Browser Zoom & Screen Resolution: Preview modes can occasionally reflect the viewport zoom. Set your browser zoom to 100% (Ctrl + 0 or Cmd + 0), or test the live shareable URL in an Incognito window to confirm whether the cutoff only happens in the admin editor interface.
Troubleshooting web layout and display issues usually comes down to checking responsive container constraints; for utility web apps and similar tools, see more to review a clean layout implementation.
0 -
Hi Debbie and thank you John,
Thank you for your patience, and I am sorry this is still causing trouble! Here are a few steps that should help keep your images from getting cut off.
RSVPify event websites are responsive, which means images automatically resize and may crop differently on desktop, tablet and mobile screens. Increasing the image height on its own will not always stop this, but these settings will:
1. Cover block: In the Event Website Builder, click the gear icon on your cover block and change the image format. Choose Fit and scale if you want the whole image to show, rather than Cover and zoom, which fills the space but can crop the edges.
2. Image block: If your image is in an Image block, hover over the image and choose Fit instead of Fill. You can also try a different Image type, such as Large or Medium, since each one crops differently on smaller screens.
3. Keep important text away from the edges: If your image has text on it, like an invitation or slide, leave some space around the outside so nothing important gets cut off on smaller devices.
4. Use the recommended size: For website images, we recommend 1600 to 2000 px wide, and keeping the file under 500 KB helps the page load faster.
5. Test on a real device: The most accurate way to check your website is on an actual phone or tablet, in both portrait and landscape.You can find more details in our Event Design Best Practices guide: https://support.rsvpify.com/en/articles/12661899-event-design-best-practices-and-recommendations
If you are still having trouble, feel free to reach out to our support team through the chat in your dashboard, and we will be happy to take a closer look at your event.
0
Please sign in to leave a comment.
Comments
3 comments