[mat_kinotekParticipant]

Hi,
I cannot wrap my head around this: Is there a way to change the shipping method selections in the final order to a drop-down menu, instead of the radio buttons? Here: https://cherrylaser.com/?page_id=9
Or alternatively, how can i style the layout of only the ‘product’, ‘subtotal’, and ‘total’ sections so that the product descriptions are each one on one line, and not all cramped on the left side as they are now?
Thanks!

[Rue NelModerator]

Hello There,

Thanks for writing in! Regretfully there isn’t a way to change the radio to a select or drop down menu from the shipping method. Further customizations from here would be getting into custom development, which is outside the scope of support we can offer. If you need more in depth changes, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities.

Regarding the styling of product, subtotal and total, Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

Thank you.

[mat_kinotekParticipant]

Hi, sorry for not had being clearer. Please have a look at my screenshot attached ( https://cherrylaser.com/?page_id=9 )
Im trying in particular to:

1. align the ‘ship to a different address?’ column to the others, so that the titles and the content (i.e. the ‘order notes’ field) is aligned with the fields of the left column.

2. diminish vertical space between the fields so that the page is more compact – i know I should use padding-top or padding-bottom, but where can i isolate only the fields?

3. in the ‘your order’ column I want to align the ‘total’ column the right, instead of left, so it’s not so close to the ‘product’ column. When shipping method UPS has more options, that entire column gets way to close.

Thanks so much, your help on this is really appreciated.

[Paul RModerator]

Hi,

For 1,2 & 3

You can add this under Custom > CSS in the Customizer.

.checkout.woocommerce-checkout h3 {
      line-height:50px;
}

.woocommerce-checkout form .form-row {
    margin-bottom: 0;
}

.shop_table.woocommerce-checkout-review-order-table .product-total {
    text-align:right;
}

Hope that helps.

[mat_kinotekParticipant]

thank you!
I need to right-align also the value for ‘subtotal’, ‘turnaround’, and ‘total’. I see there is a cart-subtotal class,
but Im not able to make it work. What’s the CSS for that?
Thanks!

[Rue NelModerator]

Hello There,

Thanks for the updates!

To align the said elements to the right, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.woocommerce-checkout .cart-subtotal td,
.woocommerce-checkout .shipping td,
.woocommerce-checkout .fee td,
.woocommerce-checkout .order-total td{
    text-align: right !important;
}

Hope this helps. Kindly let us know.

[Author]

Posts