WordPress.org

Ready to get started?Download WordPress

Forums

WooCommerce - excelling eCommerce
[resolved] Change layout small screen friendly breakpoint from 768px to 760px (3 posts)

  1. jnette3
    Member
    Posted 6 months ago #

    Hello,
    Firstly, thank you so much for all your support on this forum!

    So.. Woocommerce changes the layout to "small screen friendly" when the width is 768px or under.
    This feature clashes with my theme, as my layout changes to "small screen friendly" at 760, not 768.
    (I prefer 760 over 768, because iPad's portrait view is 768px wide, and I think iPad's screen is still too large for a "small screen friendly" view, and therefore 768px is too soon to activate it.)

    I located the code responsible for this, it's at:
    woocommerce/includes/class-wc-frontend-scripts.php
    line number 32
    Specifically: $breakpoint = '768px'

    When I change the number above to 760, it fixed the issue, but i'm in need of a more permanent solution.
    I was hoping someone could help me write a code for my theme's functions.php, which will change 768 to 760, even after woocommerce gets updated, etc.
    I'd really really appreciate your help.. :)
    Thank you so much,

    Love,
    Jeanette

    https://wordpress.org/plugins/woocommerce/

  2. zimm0r
    Member
    Posted 5 months ago #

    In case you're still looking (I found your post when I was looking to do the same thing), there's a filter for that:

    add_filter('woocommerce_style_smallscreen_breakpoint','woo_custom_breakpoint');
    
    function woo_custom_breakpoint($px) {
      $px = '760px';
      return $px;
    }

    The code above in your theme's functions.php file will change the breakpoint printed out by woocommerce.

  3. jnette3
    Member
    Posted 5 months ago #

    @zimm0r
    Thank you so much!!! I really appreciate your help. I'll try it out. :)

Reply

You must log in to post.

About this Plugin

About this Topic