Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?

In Astra Theme, the default header breakpoint is 921px. That means mobile header will be triggered at 921px screen size.

To change the default header breakpoint, edit the astra_header_break_point in a child theme. In the example below, the mobile header will be triggered at 1120px screen size. Change 1120 to the screen size of your choice.

/**
 * Change the breakpoint of the Astra Header Menus
 * 
 * @return int Screen width when the header should change to the mobile header.
 */
function your_prefix_change_header_breakpoint() {
	return 1120;
};
 
add_filter( 'astra_header_break_point', 'your_prefix_change_header_breakpoint' );

Additional resources:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment