Product Page: Display Autoship as First Option

You can use custom CSS to change the order in which the Autoship option is displayed globally. Here we are ordering it first.

Example

/* 
  Custom Autoship CSS 
  Flip the Order of the Autoship options so that Autoship & Save is first.
*/
form .autoship-schedule-options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width:100%;
  }
  
  form .autoship-schedule-options > .autoship-type {
    width: 100%;
    display: block;
  }
  form .autoship-schedule-options > .autoship-type:nth-of-type(1){
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  form .autoship-schedule-options > .autoship-type:nth-of-type(2){
    -webkit-box-ordinal-group: 1;
        -ms-flex-order: 0;
            order: 0;
  }

Still need help? Contact Us Contact Us