How to Disable the ‘Choose a Pattern’ Popup in WordPress TwentyTwentyFour

The WordPress 2024 theme includes a popup that suggests using a pattern when creating new pages. While this can be a helpful feature for some users, it can also be annoying or intrusive for others. If you’re one of those users, you can easily disable the popup using a custom JavaScript script.

Step 1: Create the JavaScript Script

/**
 * Attempt to click on the close button of the 'Choose a Pattern' popup.
 */
document.addEventListener('DOMContentLoaded', () => {
	const modalContainer = document.querySelector('.edit-post-start-page-options__modal .components-modal__header');
	const closeButton = modalContainer?.querySelector('button');

	if (modalContainer && closeButton) {
		const clickEvent = new Event('click', { bubbles: true });
		closeButton.dispatchEvent(clickEvent);
	}
});

This code will ‘click’ on the modal’s ‘close’ button, which will close the popup. Create a new file in your theme’s directory: mattr-dismiss-patterns-popup.js

Step 2: Enqueue the JavaScript Script

In your theme’s functions.php file, add the following code:

<?php
/**
 * Enqueue the JavaScript file
 */
function mattr_close_modal_enqueue_script() {
    $current_screen = get_current_screen();

    // Check if the current screen is the new page creation screen
    if ($current_screen && $current_screen->id === 'page') {
        
        wp_enqueue_script(
            'mattr-close-patterns-popup',
            get_stylesheet_directory_uri() . '/mattr-dismiss-patterns-popup.js',
            array(),
            '1.0',
            true
        );
    }
}
add_action('admin_enqueue_scripts', 'mattr_close_modal_enqueue_script');

This code will enqueue the mattr-admin-close-patterns-popup.js script in the admin area, where the popup is displayed.

Step 3: Test the Script

Create a new page and see if the popup is still displayed. If not, then you have successfully disabled it! Please note that it might appear for a short time as the script fires only 4 times per second to avoid overloading the browser.

WordPress Plugin

I’ve wrapped the above scripts in a simple plugin for convenience, so if you experience any issues with your 2024 theme you can simply deactivate it.

Direct download:

GitHub:

The plugin’s code is also available as a GitHub repository:

https://github.com/MattrCoUk/mattr-dismiss-patterns-popup

IMPORTANT: Please note that it is a hacky workaround. But until WordPress team come up with a proper solution it might prevent a nervous breakdown if you need to create let’s say 100 pages in a batch :-) Use with caution!

3 Comments

Anonymous
Sadly it doesn't work on wordpress 6.6.2 Norwegian. It would be very nice if it worked, because editing the wordpress…
Anonymous
Hi matt. I installed and enabled your plugin but it doesn't work, and still shows the pop up?
Anonymous
Sorry but this doesn't work. I found a another script instead that solves this: https://developer.wordpress.com/docs/developer-tools/block-patterns/disable-all-patterns/