My Squarespace Site is cutting off embeds

When using arketa embeds in the Squarespace website builder, there are settings that could impact the display of the widgets.

Updated over a week ago

If you use Squarespace, and you notice a popup window (oftentimes this is seen in the On Demand Library embed) that gets cut off when embedding content in the chosen template can be caused by various factors. Here are some common reasons and solutions:

1. **iFrame Size**: Check the dimensions of the iframe you are using to embed your content. If the dimensions are larger than the space available within your Squarespace template, it will cause the popup to get cut off. Ensure that the dimensions of the iframe match the available space.

2. **Squarespace Template Design**: Different Squarespace templates have varying layouts and design elements. Some templates may have fixed or limited areas where you can embed content, which could cause content to get cut off. Review your template's documentation to understand its specific constraints.

3. **Responsive Design**: Squarespace templates are designed to be responsive, meaning they adjust to different screen sizes and devices. Ensure that your embedded content is also responsive. Use CSS media queries or responsive HTML/CSS to make sure the content adapts to different screen sizes.

4. **Z-Index or Layering**: CSS styles in your Squarespace template might have z-index settings that affect how embedded content is displayed. Adjusting the z-index of your embedded content or Squarespace elements may help prevent popup issues.

5. **Content Overflow**: Check if the content you're embedding has elements (like modals or popups) that are set to appear outside the boundaries of the iframe. If this is the case, the content may get cut off. Adjust the content's CSS to ensure it stays within the iframe's dimensions.

6. **Browser Compatibility**: Test your embedded content in different web browsers to ensure that the issue isn't browser-specific. Sometimes, certain browser settings or extensions can affect how embedded content is displayed.

7. **Squarespace Version**: Squarespace periodically updates its platform. Ensure that you are using an up-to-date version of Squarespace, as older versions may have bugs that affect how embedded content behaves.

Remember to back up your site before making significant changes to ensure you can easily revert to a previous state if needed. Additionally, always test changes on a staging or test site before implementing them on your live site to avoid disruptions.

Did this answer your question?