[Resolved] Using the generate_media_queries filter

Home Forums Support Using the generate_media_queries filter

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #1189408


    I’m trying to change the breakpoint at which my right sidebar drops below the content area. Right now it is set at 768px (by default), which is a way too small value for my needs. From what I understand, I need to alter these values using the generate_media_queries filter (for some reason it is missing from the documentation –> filters page).

    I found a helpful snippet in this topic and I used the following code:

    add_filter( 'generate_media_queries', function( $queries ) {
        $queries['mobile'] = '(max-width: 900px)';
        return $queries;
    } ); 

    However, it doesn’t seem to work. Any help would be much appreciated.

    Thank you

    Lead Developer
    Lead Developer

    Hi there,

    Not all of our mobile CSS is controlled via that filter, unfortunately.

    In this case, you can do this:

    @media (max-width: 900px) {
        .inside-footer-widgets > div {
            float: none;
            width: 100%;
            left: 0;
            right: 0;
        .site-main {
            margin-left: 0 !important;
            margin-right: 0 !important;

    Let me know if you need more info πŸ™‚


    Hi Tom,

    Thank you for your reply, that does exactly what I needed.

    Just out of curiosity, any chances of being able to alter these breakpoints via a filter or the customizer with a future update? I try not to rely too much on overwriting css rules and templates in my child theme.

    Thanks again. πŸ™‚

    Lead Developer
    Lead Developer

    Not likely, unfortunately. PHP isn’t able to change static CSS/media queries.


    Yeah, that makes sense. Thank you for your help.

    Lead Developer
    Lead Developer
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.