Back to Community
Home / Community / Plugin → Siteorigin widgets bundle

Fixing Common SiteOrigin Widgets Bundle Display and Responsiveness Issues

20 threads Sep 9, 2025 Plugin → Siteorigin widgets bundle

Content

If you're using the SiteOrigin Widgets Bundle, you might occasionally run into display quirks, spacing problems, or responsiveness issues. These problems are often not bugs in the plugin itself but arise from conflicts with your theme's CSS, other plugins, or specific browser behaviors. Based on common community support threads, here are the most frequent issues and how to resolve them.

1. Unwanted Spacing or Gaps Between Widgets

The Problem: Your sidebar or widget area has large, unwanted gaps between widgets on certain pages (like posts) but not others (like pages).

Why It Happens: This is almost always caused by your theme's stylesheet applying specific margin or padding to widgets in certain contexts.

The Solution: You can override the theme's CSS with a more specific rule. Add custom CSS via Appearance > Customize > Additional CSS.

.et_pb_widget {
    margin-bottom: 10px !important;
}

Adjust the value (e.g., 10px) and the CSS selector (e.g., #sidebar .et_pb_widget) to match your theme's structure. Use your browser's inspector tool to identify the exact class and current value causing the gap.

2. Widgets Not Responsive on Mobile Devices

The Problem: Widgets like the Post Grid, Slider, or Hero Image do not stack or resize correctly when viewed on a mobile phone.

Why It Happens: The theme or other custom CSS might be overriding the widget's responsive grid rules.

The Solution: For a Post Grid that won't stack, use this CSS media query:

@media (max-width: 780px) {
 .sow-blog-layout-grid .sow-blog-posts {
  grid-template-columns: repeat(1, 1fr) !important;
 }
}

For a Hero Widget that isn't resizing, consider that it uses background-size: cover; by design and does not resize content. For a truly responsive image slider, the SiteOrigin Slider Widget is often a better alternative for images that need to fit a container.

3. Page Builder or Widget Interface Not Appearing

The Problem: The Page Builder editing interface or a widget's options do not load on the page editor screen.

Why It Happens: This is typically due to a JavaScript error caused by a conflict with another plugin or your theme.

The Solution: Follow a conflict test to identify the culprit.

  1. Temporarily switch to a default WordPress theme like Twenty Twenty-One.
  2. Temporarily deactivate all plugins except SiteOrigin Widgets Bundle and Page Builder.
  3. If the issue is resolved, reactivate your theme and plugins one by one, checking the editor after each, to find which one causes the conflict.

4. Images Not Displaying or Loading Incorrectly

The Problem: Images in Image Widgets don't appear, look stretched, or only load correctly after a page refresh in certain browsers like Microsoft Edge.

Why It Happens: Common causes include mixed HTTP/HTTPS content, CORS errors, or browser-specific bugs.

The Solution:

  • Ensure your WordPress Address and Site Address (in Settings > General) are both set to the same URL, preferably https://.
  • Clear your browser and site cache.
  • Check if the issue occurs on another computer or browser to rule out a local problem.

5. Using Custom Code in Widgets

The Problem: You want to use a YouTube embed code to disable related videos or add custom HTML that isn't supported by a standard widget.

The Solution: Instead of the Video Widget, use the standard WordPress Custom HTML widget to insert your embed code directly. This gives you full control over the parameters.

Most display issues can be solved with some custom CSS or a quick conflict test. If you continue to have trouble, the WordPress community forums are a great place to seek help from other users.

Related Support Threads Support