Fixing Common Blocksy Companion JavaScript Errors: TypeError and Sticky Header Issues

If you've encountered JavaScript errors after updating the Blocksy Companion plugin, you're not alone. Based on community reports, these errors often manifest as TypeError: t.firstElementChild.firstElementChild is null, Uncaught TypeError: document.body.dataset.header is undefined, or TypeError: Object(...) is not a function in the browser console, particularly related to the sticky.js or main.js files.

These errors typically occur due to a version mismatch between the Blocksy theme and its companion plugin. The two are designed to be updated in tandem, and running an outdated version of one while using the latest version of the other can break functionality and cause scripts to fail.

How to Resolve These JavaScript Errors

Follow these steps to troubleshoot and resolve the issue. Always remember to create a full backup of your site before proceeding.

1. Update Everything: The first and most crucial step is to ensure both the Blocksy theme and the Blocksy Companion plugin are updated to their latest available versions. This is the solution most frequently suggested by the Blocksy Companion team in response to these errors.
2. Reinstall the Plugin: If updating doesn't work, the update process itself may have failed. Completely deactivate and delete the Blocksy Companion plugin. Then, go to Plugins → Add New and install a fresh copy. This can clear out any corrupted files from a failed update, which has been known to cause issues like 'Undefined variable' notices.
3. Clear All Caches: After updating or reinstalling, clear your WordPress caching plugin (if you use one), your browser cache, and any server-level or CDN caches. This ensures your site serves the new, corrected JavaScript files to all visitors.

What If the Error Persists?

If you continue to see errors after completing the steps above, further investigation is needed. The specific error often provides a major clue:

• Sticky Header Errors (e.g., document.body.dataset.header is undefined): This usually indicates a conflict with your specific header configuration. Troubleshoot by temporarily switching to a default WordPress theme like Twenty Twenty-One to see if the error disappears. If it does, the issue is likely with your custom header setup in Blocksy.
• General Function Errors (e.g., onDocumentLoaded is not a function): This is almost always a version compatibility problem. Double-check that your versions match. If you are using a child theme, ensure it is also compatible with the latest versions of Blocksy and its companion plugin.

By systematically following these steps, most common JavaScript errors related to the Blocksy Companion plugin can be resolved, restoring your site's functionality and ensuring it passes tools like the Google Mobile-Friendly Test.