How do I get an array of widgets?

How do I get an array of widgets?

You can look into

$sidebars_widgets =  wp_get_sidebars_widgets();
print_r( $sidebars_widgets );

Here's an output example:

Array
(
    [orphaned_widgets_1] => Array
        (
            [0] => text-6
        )

    [wp_inactive_widgets] => Array
        (
            [0] => text-7
            [1] => rss-2
        )

    [sidebar-1] => Array
        (
            [0] => recent-posts-3
            [1] => recent-posts-4
            [2] => text-9
            [3] => calendar-2
            [4] => categories-3
            [5] => search-4
            [6] => text-8
            [7] => categories-2
        )

    [sidebar-2] => Array
        (
            [0] => search-5
        )

    [sidebar-3] => Array
        (
            [0] => recent-posts-2
        )

)

To dynamically calculate the number of columns in the footer widget area and apply appropriate CSS classes, you can achieve this by:

1. Registering the Widget Area in your theme's functions.php.
2. Counting the Number of Active Widgets in the widget area.
3. Applying the CSS Classes Dynamically based on the number of widgets.

Here's a step-by-step approach to accomplish this:

Step 1: Register the Widget Area

Add this to your theme's functions.php file to register the footer widget area.

function my_theme_widgets_init() {
    register_sidebar(array(
        'name' => 'Footer Widget Area',
        'id' => 'footer-widget-area',
        'before_widget' => '<div class="widget %2$s">',
        'after_widget' => '</div>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ));
}
add_action('widgets_init', 'my_theme_widgets_init');

Step 2: Count the Number of Active Widgets

In your theme’s functions.php file, create a function to count the active widgets and assign column classes.

function count_active_widgets($sidebar_id) {
    $sidebars_widgets = wp_get_sidebars_widgets();
    return isset($sidebars_widgets[$sidebar_id]) ? count($sidebars_widgets[$sidebar_id]) : 0;
}

function dynamic_footer_columns() {
    $widget_count = count_active_widgets('footer-widget-area');
    $column_class = '';

    if ($widget_count == 1) {
        $column_class = 'one-column';
    } elseif ($widget_count == 2) {
        $column_class = 'two-columns';
    } elseif ($widget_count == 3) {
        $column_class = 'three-columns';
    } elseif ($widget_count >= 4) {
        $column_class = 'four-columns';
    }

    echo $column_class;
}

Step 3: Apply the CSS Classes Dynamically

In your theme’s footer template file (e.g., footer.php), apply the dynamic column class to the footer widget area container.

<footer id="footer">
    <div id="footer-widget-area" class="<?php dynamic_footer_columns(); ?>">
        <?php if (is_active_sidebar('footer-widget-area')) : ?>
            <?php dynamic_sidebar('footer-widget-area'); ?>
        <?php endif; ?>
    </div>
</footer>

Step 4: Add CSS for Column Classes

In your theme’s CSS file (e.g., style.css), add styles for the column classes.

#footer-widget-area {
    display: flex;
    flex-wrap: wrap;
}

#footer-widget-area.one-column .widget {
    flex: 0 0 100%;
}

#footer-widget-area.two-columns .widget {
    flex: 0 0 50%;
}

#footer-widget-area.three-columns .widget {
    flex: 0 0 33.33%;
}

#footer-widget-area.four-columns .widget {
    flex: 0 0 25%;
}

Summary

This approach dynamically calculates the number of active widgets in the footer widget area and applies appropriate CSS classes to render them in columns. By using CSS Flexbox, you ensure that the widgets will adjust their layout according to the specified number of columns. Adjust the CSS as needed to fit your theme's design.