Troubleshooting Column and Row Layout Issues in Kadence Blocks
Content
Users of the Gutenberg Blocks with AI by Kadence WP plugin sometimes encounter issues where column and row layouts don't display or function as expected. This guide covers the most common causes and their solutions, compiled from community reports and resolutions.
Common Symptoms
- Columns stack vertically instead of appearing side-by-side on the front end.
- Unable to adjust column widths using the drag-and-drop handles.
- Row layout blocks appear to span the full width instead of maintaining their set column structure.
- Custom width percentages are not applied or reflected in the front-end display.
Why This Happens
These problems are typically caused by one of three factors: a plugin bug introduced in an update, a conflict with another plugin or theme, or custom CSS that overrides the plugin's default styling.
How to Fix It
1. Update the Plugin
The most straightforward solution is often to ensure you are running the latest version of Kadence Blocks. The development team is proactive about fixing bugs. For example:
- A bug in version 3.2.20 that broke custom column widths was resolved in version 3.2.21.
- An issue with the Advanced Button block's width after WordPress 6.8 was fixed in Kadence Blocks version 3.5.2.
Always check your plugin version and update if a newer one is available.
2. Perform Conflict Testing
If updating doesn't help, a conflict with your theme or another plugin is likely. To test for this:
- Switch Themes Temporarily: Activate a default WordPress theme like Twenty Twenty-Four. If the problem disappears, the issue is with your original theme.
- Deactivate Other Plugins: Deactivate all plugins except for Kadence Blocks. If the column layouts work correctly, reactivate your other plugins one by one to identify the one causing the conflict.
3. Check for Custom CSS
Custom code can sometimes interfere with how blocks are rendered. One user discovered their problem was self-inflicted: "My mistake was, that I overwrote the row element to display as a flex element instead of grid." Inspect your page using your browser's developer tools (DevTools) to see if custom CSS is overriding the default display: grid; styling on Kadence row layouts.
4. Adjust Column Number Setting
In one specific case, a user found a workaround for a non-functional width slider: "I found a bug, the slider does not work, if you select the number of columns... then everything works." If the drag handle is unresponsive, try manually selecting the number of columns in the block settings sidebar, which can sometimes re-enable the width adjustment functionality.
When to Seek Further Help
If none of the above steps resolve your issue, the problem may be more specific. When seeking help from the community, be prepared to provide:
- The version numbers of WordPress, your theme, and Kadence Blocks.
- A clear description of the problem and what you expect to happen.
- A link to the page where the issue is visible.
- Screenshots or a screen recording that visually demonstrates the problem.
Related Support Threads Support
-
After 3.2.20 update my site looks different.https://wordpress.org/support/topic/after-3-2-20-update-my-site-looks-different/
-
Editor Max Width not being applied automaticallyhttps://wordpress.org/support/topic/editor-max-width-not-being-applied-automatically/
-
After update to WP 5.5 not possible to change the column widthhttps://wordpress.org/support/topic/after-update-to-wp-5-5-not-possible-to-change-the-column-width/
-
Row widthhttps://wordpress.org/support/topic/row-width-2/
-
After 5.5 update drag and drop missing from left of containerhttps://wordpress.org/support/topic/after-5-5-update-drag-and-drop-missing-from-left-of-container/
-
Error after WordPress 5.7 update with responsive settingshttps://wordpress.org/support/topic/error-after-wordpress-5-7-update-with-responsive-settings/
-
Column width not workinghttps://wordpress.org/support/topic/column-width-not-working-4/
-
Problem after upgradehttps://wordpress.org/support/topic/problem-after-upgrade-16/
-
Wide Width button gone after upgrading to 1.5.3https://wordpress.org/support/topic/wide-width-button-gone-after-upgrading-to-1-5-3/
-
Please dont kill “Editor Width”!https://wordpress.org/support/topic/please-dont-kill-editor-width/
-
Columns padding and margins units missinghttps://wordpress.org/support/topic/columns-padding-and-margins-units-missing/
-
Button errorhttps://wordpress.org/support/topic/button-error-4/
-
Columns not rendering as columnshttps://wordpress.org/support/topic/columns-not-rendering-as-columns/
-
Button settings with WP 6.8https://wordpress.org/support/topic/button-settings-with-wp-6-8/
-
WP 5.5.1 not possible to change the column widthhttps://wordpress.org/support/topic/wp-5-5-1-not-possible-to-change-the-column-width/