JustinWDev of Archived Theme Support
8/14/2015 - 10:32 PM

How to avoid quantity and their units to be separated in any content

How to avoid quantity and their units to be separated in any content

What you have

Notice how the 1 is separated from kg, and the 250 number is separated from g. You want the number and unit that follows to be on the same line.

What you want

How to get it

  1. Come up with a jQuery selector for the text you wish to fix. E.g. in the Supply theme:

    .product-grid-item > p
    
  2. Add at the bottom of your theme.liquid file the following script:

    <script>
    $('.product-grid-item > p').each(function () { 
      var title = $(this).html().replace(/(\d+)\s+/g,'$1&nbsp;'); 
      $(this).html(title); 
    });
    </script>
    

    Use the selector found in step 1.