Return to previous page

Checkout layout Classic version – how to edit?

This topic has 20 replies, 4 voices, and was last updated 9 months, 3 weeks ago ago by Andrew Mitchell

Mateusz

Participant

February 18, 2023 at 03:33

Hello,
Is there some way to fix how my checkout looks?

https://prnt.sc/HgF-bfFaObhL

List of shipping methods is extremely long. I tried YellowPencil buy I can stretch it only little bit. There is some plugins to edit checkout, but maybe you know how to do this in better way.

Help 🙂

Best regards

#347358 Copied Theme version: 9.0.4 WooCommerce version: 7.4.0

19 Answers

Tony Rodriguez

Support staff

February 18, 2023 at 06:20

Hello @Mateusz,

We have recently reviewed your website and noticed that there are no Shipping Methods available on the checkout page. It appears that you are using the Advanced Layout of the Checkout page. Please refer to the screenshot provided: https://postimg.cc/9wyD509h

We would appreciate it if you could provide us with the necessary steps to replicate the issue. If possible, please include a video clip. Additionally, please provide us with your website’s WP Admin Login URL and credentials in the private content area of this topic. This will allow us to further investigate the issue and provide you with assistance.

Best Regards,
8Theme’s Team

#347365 Copied

Mateusz

Participant

February 18, 2023 at 12:26

Please check now if you can see the next steps in the basket.

Best Regards

#347385 Copied

Rose Tyler

Support staff

February 19, 2023 at 08:44

Hello, Mateusz,

Here is what we can see on your site now – https://prnt.sc/Up0xwQ4VMg3b
Do you need any other assistance?

Kind Regards,
8theme team

#347422 Copied

Mateusz

Participant

February 19, 2023 at 08:55

Hello Rose,
Yes this is how it looks with multistep layout.

I changed it now for classic.
Please look at this now.
https://prnt.sc/rrPVn7aGWikb

Best regards

#347424 Copied

Rose Tyler

Support staff

February 19, 2023 at 11:14

Hello, Mateusz,

We can’t see it.
Could you provide access to the account from which you see the mentioned situation?

Kind Regards,
8theme team

#347442 Copied

Mateusz

Participant

February 19, 2023 at 11:52

Just today, the courier company has a technical break until 4:00 PM, that’s why the shipping options are not visible 🙂

#347446 Copied
Rose Tyler

Support staff

February 19, 2023 at 15:42
Hello, Mateusz,

You can try this code:
```
.woocommerce-checkout #shipping_method li {
    flex-wrap: wrap;
    position: relative;
}
.woocommerce-checkout #payment .payment_methods label, .woocommerce-checkout #shipping_method label {
    max-width: calc(100% - 20px);
}
.woocommerce-checkout #payment .payment_methods input[type=radio], .woocommerce-checkout #shipping_method input[type=radio] {
    float: left;
}
```
OR
```
.cart-order-details .woocommerce-shipping-totals.shipping td {
    max-width: 260px;
}
```
Kind Regards,
8theme team
#347464 Copied
Mateusz

Participant

February 19, 2023 at 16:29

Hello Rose,
Now shipping methods are more to the right side 🙂
It should be more stretched I think 🙂
https://prnt.sc/idkr6E8kPcx2

Kind regards

#347466 Copied

Mateusz

Participant

February 19, 2023 at 17:07

In cart it looks grat now, but still the same bad look is in checkout.

Kind regards

#347470 Copied

Tony Rodriguez

Support staff

February 20, 2023 at 05:38

Hello Mateusz,

We apologize for the difficulty you are experiencing, We are not able to locate the section on your site checkout page https://postimg.cc/JGFkvmXC .

To assist us in resolving this issue, please provide us with a screenshot of the issue along with the complete steps you are taking. We will then review the issue and provide you with the necessary assistance.

Thank you for your patience and understanding.

Best Regards,
8Theme’s Team

#347481 Copied

Mateusz

Participant

February 20, 2023 at 09:49

Hello Tony,
I think because I set shipping methods only for my country.

I changed it now, so you guys can see everything.

Best regards

#347494 Copied

Tony Rodriguez

Support staff

February 20, 2023 at 14:29

Hello Mateusz,

We have provided video proof that the issue is still not resolved for us. You can view the video here: https://www.veed.io/view/ab1ed95c-0126-4b29-99f0-89efc33a4e8f?sharingWidget=true&panel=share

Best Regards,
8Theme’s Team

#347530 Copied

Mateusz

Participant

February 23, 2023 at 07:47

Hello Tony,

Yes you can’t see this because this shipping method are available only in Poland I UK…
I recorded a video how it looks in checkout.

In cart is great, but I need to change it in checkout.

https://www.veed.io/view/36bdd9b6-70f5-4dfa-bacd-37327174e477?panel=share

Best Regards

#347802 Copied

Tony Rodriguez

Support staff

February 25, 2023 at 05:47

Hello, Mateusz,

We apologize for the delay in our response as we were working with the development team to address your issues.

1. Regarding your first issue, the video you provided is archived and we are unable to view it. https://prnt.sc/XPjEj4YsXLbw

2. We also tried using a VPN in Poland, but the issue still persists. We do not believe that another video would help us, as we would still be unable to resolve the issue without access to it. We suggest that you open up delivery methods for the short-term so that we can make the necessary fixes, or create a staging environment and grant us access to it.

3. Regarding your third issue, the checkout page appears to be working properly: https://prnt.sc/agdF2AYkLj_e

Best Regards,
8Theme’s Team

#347942 Copied

Mateusz

Participant

February 27, 2023 at 07:43

Hello Tony,
I don’t know how to solve this problem.
You right, checkout looks fine, except shipping methods you can’t see.

Please contact administrator
for this information.

#348150 Copied

Rose Tyler

Support staff

February 27, 2023 at 16:50

Hello, Mateusz,

If you are not satisfied with the outcome of the custom CSS code that was previously provided, you may attempt to further customize the files through the use of a child theme. Copy the origin file from xstore/woocommerce/cart/cart-shipping.php to xstore-child/woocommerce/cart/cart-shipping.php and make a few changes in these areas -> https://prnt.sc/0tA7D4tHpwJx
the result will be like this here – https://prnt.sc/7t8Rr8mmGWiV
Please note that additional customization is outside the scope of our basic support.

Kind Regards,
8theme team

#348225 Copied

Mateusz

Participant

March 2, 2023 at 22:28

Hi Rose,
Of course I’m satisfied 🙂
Now everything looks very nice in the cart and in the checkout.
I made it with Yellow Pencil. Great tool!

But I think I broke off-canvas mini cart 😀
It is very long now and reach footer. Could you pleas look at this?

Best regards,
Mateusz

#348657 Copied

Rose Tyler

Support staff

March 5, 2023 at 08:53

Hello, Mateusz,

The problem is caused by custom CSS code you added via YellowPencil, check the code (edit or remove it) –
https://prnt.sc/9eMUbNhgKCuf https://prnt.sc/NlpjYxOmox7L

Kind Regards,
8theme team

#348893 Copied

Andrew Mitchell

Support staff

March 1, 2024 at 07:55

Dear Mateusz,

Choosing our theme reflects your commitment to quality, and for that, we’re genuinely grateful. As we constantly strive to elevate your experience, your feedback is an invaluable gift. Could you kindly take a moment to rate our product with 5 stars on ThemeForest?

Click here to share your insights: https://themeforest.net/downloads

Your support fuels our journey, and we appreciate it more than words can express.

Best Regards,
The 8Theme Team

#385326 Copied
Tagged: checkout, classic, edit, layout, themes, woocommerce, wordpress
Viewing 20 results - 1 through 20 (of 20 total)

The issue related to '‘Checkout layout Classic version – how to edit?’' has been successfully resolved, and the topic is now closed for further responses

Checkout layout Classic version – how to edit?

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection