[SOLVED] WOOF Product Filter conflict with Elementor

If you're facing the problem of Elementor not loading the builder on the left pane, with the loading gif just stuck there, this is the solution for you. This is caused by a plugin conflict with Elementor: for some people it's WOOF Product Filter, for others it's Black Studio TinyMCE Widget or JNews – Essential, or it could be something else. This post covers the fix for the WOOF Product Filter conflict only.

This was on Elementor 2.6.x and WordPress 5.2 at the time, so if you're running anything current, you're unlikely to hit this exact conflict.

To double check you're facing this problem, open the browser console (press F12 at the Elementor loading page) and you should see an error like this:

Uncaught TypeError: Cannot set property 'controls' of undefined
    at Object. (editor.min.js?ver=2.6.6:7)
    at Function.each (load-scripts.php?c=0&load[]=underscore,jquery-core,jquery-migrate,backbone,shortcode,utils,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jqu&load[]=ery-ui-core,jquery-ui-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.2.2:3)
    at Object.success (editor.min.js?ver=2.6.6:7)
    at i (load-scripts.php?c=0&load[]=underscore,jquery-core,jquery-migrate,backbone,shortcode,utils,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jqu&load[]=ery-ui-core,jquery-ui-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.2.2:3)
    at Object.fireWith as resolveWith (load-scripts.php?c=0&load[]=underscore,jquery-core,jquery-migrate,backbone,shortcode,utils,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jqu&load[]=ery-ui-core,jquery-ui-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.2.2:3)
    at Object.e. as resolve (load-scripts.php?c=0&load[]=underscore,jquery-core,jquery-migrate,backbone,shortcode,utils,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jqu&load[]=ery-ui-core,jquery-ui-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.2.2:3)
    at common.min.js?ver=2.6.6:2
    at Array.forEach ()
    at success (common.min.js?ver=2.6.6:2)
    at Object.o.success (common.min.js?ver=2.6.6:2)

The solution

Source: https://products-filter.com/conflict-with-elementor-page-builder/

References:

WOOF Product Filter actually provided the fix for this, it's not my original code. Add the below to your functions.php file:

add_action('elementor/widgets/widgets_registered', function($widgets_manager)
{
    $widgets_manager->unregister_widget_type('wp-widget-woof_widget');
});

If you don't know where to find it, you can access it from either:

WP Admin > Appearance > Theme Editor > functions.php
Your hosting file manager (e.g. cPanel) > public_html/wp-content/themes/[your active theme]/functions.php

Save your functions.php file and reload Elementor, it should work.

If the code doesn't work

This is because of... /drumroll... COPY & PASTE. Yes, it's a dumb problem. I don't know why, but sometimes when you copy-paste code, it changes the ' symbol into something else, and it's very hard to notice.

You'll need to manually change the ' symbol in 4 places. If you do it right, you'll see the text change colour.

functions.php code with curly quotes around the string arguments, shown without the code editor's normal string highlighting — BEFORE

Same functions.php code with straight quotes, now correctly highlighted as strings in the editor — AFTER

Save your functions.php file after you've made the changes, and reload Elementor. It should work again, and you don't have to sacrifice your WOOF Product Filter :)

Good luck!