Viewing 1 replies (of 1 total)
  • The JS Fiddle you linked to should work, it’s mainly going to take using the correct jQuery selector for your selects. That’s the tricky part.

    When I look at your problem page, it looks like the same ID, “stoerrelse” is used for the size selects for all items. That will cause problems with javascript/jQuery, because the ID attribute is supposed to be unique throughout an HTML document. You may need to fix that for other reasons, but it shouldn’t affect this.

    You might give the following selector in the JSFiddle code a try. It uses the body class “.woocommerce-page” to limit the change to your selects to that page, because your theme doesn’t include a page ID:

    
    ReplaceSelectWithButtons($('.woocommerce-page select'));
    

    A good way to test your selectors without disrupting things for your customers is to use the developer tools in Firefox or Chrome/Chromium to test the selectors with CSS; for example, I used the following to make sure I was getting all the selects on your problem page:

    
    .woocommerce-page select {
    	display: none !important;
    }
    

    Since it hid all the size selects when I tried it, I am (fairly) confident it will work in jQuery.

    There’s also the jQuery plugin Select2Buttons.

    Ideally, all the selects you want to change to buttons would share the same class, to make this easier, but they don’t. There may be a filter or hook to add a class to them.

Viewing 1 replies (of 1 total)

The topic ‘Making select into buttons’ is closed to new replies.