WordPress.org

Forums

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

  1. jnette3
    Member
    Posted 1 year 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 1 year 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 1 year ago #

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

  4. byronyasgur
    Member
    Posted 8 months ago #

    Thanks Zimm0r

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WooCommerce - excelling eCommerce
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic