Troubleshooting Common SiteOrigin Widgets Bundle Issues: Features, Icons, and Compatibility

Users of the SiteOrigin Widgets Bundle occasionally encounter issues where widgets don't behave as expected. Based on common community reports, this guide covers the most frequent problems and their solutions.

Common Issues and Their Solutions

1. Features Widget Images or Icons Not Displaying

The Problem: Icons or images in the Features Widget fail to appear on the live site, even though they are configured correctly in the editor.

Why It Happens: This is most often caused by a conflict with another plugin or the active theme. It can also be related to caching.

How to Fix It:

1. Conflict Test: Disable all other plugins except the SiteOrigin Widgets Bundle. If the icons appear, reactivate your plugins one by one to identify the culprit.
2. Theme Test: Temporarily switch to a default WordPress theme like Twenty Twenty-One. If the icons work, the issue is with your theme.
3. Clear Caches: Clear any server, plugin, or browser caches after making these changes.

2. Widgets Not Working in Customizer or When Nested

The Problem: Certain field types, like the post selection field, may not function when placed inside a section widget or on the WordPress customizer screen.

Why It Happens: This is a known bug that the SiteOrigin Widgets Bundle team has logged for a future update.

How to Fix It: As a temporary workaround, avoid nesting these specific fields. Configure them in the main widget area instead of within a section.

3. Mobile-Specific Display Issues

The Problem: Text or other content appears missing when viewed on a mobile device (e.g., an iPhone), but looks fine on a desktop.

Why It Happens: This is typically not a plugin bug but a CSS issue. The theme or other custom CSS might be hiding content on smaller screens using responsive design rules.

How to Fix It:

1. Use your browser's developer tools (responsive design mode) to simulate the mobile view and inspect the missing element.
2. Look for CSS properties like display: none; that might be applied specifically to mobile screen sizes.
3. Add custom CSS to override any rules that are incorrectly hiding the content.

4. Compatibility with Other Page Builders (Elementor)

The Problem: Widgets cannot be edited or are causing errors when used alongside another page builder like Elementor.

Why It Happens: Page builders can sometimes load their scripts in a way that conflicts with other plugins.

How to Fix It:

1. Ensure both the SiteOrigin Widgets Bundle and the other page builder are updated to their latest versions.
2. Perform a conflict test by disabling all other plugins to see if the two can work together without interference.

5. JavaScript Widgets Not Loading in Dynamic Environments (VueJS, React)

The Problem: Widgets that rely on JavaScript to initialize (e.g., a full-width image slider) may not work on sites that load content dynamically using a JavaScript framework like VueJS or React.

Why It Happens: The widget's scripts are designed to trigger on a standard page load. In a dynamic app, this event may not occur after new content is fetched and injected into the DOM.

How to Fix It: This requires a development solution. After your VueJS or React router injects new content, you may need to manually trigger the SiteOrigin Widgets Bundle's initialization scripts. Consulting the framework's documentation for how to execute scripts after a route change is recommended.

General Troubleshooting Tips

• Always Update: First, confirm you are running the latest version of WordPress, the SiteOrigin Widgets Bundle, and your theme.
• The Conflict Test: The most reliable method to isolate an issue is to disable all plugins and switch to a default theme. This quickly tells you if the problem is due to a conflict.
• Check the Knowledge Base: The SiteOrigin Widgets Bundle team maintains documentation that can provide additional insights into specific widget functionality.

If these steps do not resolve your issue, describing your problem in detail on relevant community forums can help others provide more targeted assistance.