Home Forums Feature Requests Flexible content fields – global expand and collapse Reply To: Flexible content fields – global expand and collapse

  • I messed around with a code to collapse with shift-click on Flexible Content ‘headers’. Shift-click felt more natural than a button somewhere on the page.

    It also works with the pretty-edit-pen icon from ACF Extended. Not further tested on other Extended settings.

    It checks if the currently clicked header is open/closed, and applies open/close to all other elements accordingly. Some weird timeout function was required not to interfere with (probably) default click behaviour?

    For anyone interested you can add this to admin JS:

        // Function to handle shift+click event on .acf-fc-layout-handle
        $('.acf-fc-layout-handle').on('click', function(e) {
            if (e.shiftKey) {
                closestLayout = $(this).closest('.layout');
                if (closestLayout.hasClass('-collapsed')) {
                    // console.log('Layout is hidden');
                        $('.acf-flexible-content .values .layout').removeClass('-collapsed');
                        $('.acf-flexible-content .acfe-fc-placeholder').addClass('acf-hidden');
                      }, 1);
                } else {
                    // console.log('Layout is visible');
                        $('.acf-flexible-content .values .layout').addClass('-collapsed');
                        $('.acf-flexible-content .acfe-fc-placeholder').removeClass('acf-hidden');
                      }, 1);